ウェブデザイナーの強化書 https://cocohp.net ウェブデザイナーを目指す全ての人へ Thu, 23 Jun 2022 01:16:16 +0000 ja hourly 1 https://wordpress.org/?v=6.9.4 https://cocohp.net/wp/wp-content/uploads/2021/06/cropped-ico-1-32x32.png ウェブデザイナーの強化書 https://cocohp.net 32 32 評価ポイント https://cocohp.net/2347 https://cocohp.net/2347#respond Mon, 20 Jun 2022 08:52:02 +0000 https://cocohp.net/?p=2347 2学年は、初めての制作課題となります。一から制作が難しい人は、こちらのテンプレートを使って完成させてください。

サービスを伝える。

どのようなサービスを提供しているウェブサイトなのかが、概ねひと目で理解できる。

「コレ何のサイト？」
かっこいい写真やアニメーション、動画がトップページに現れ、どのようなサービスを提供しているのか？分からないウェブサイトがたまにあります。大手企業などテレビやラジオで頻繁にCMが配信され、誰が聞いても知っているような名称は別ですが、特定の場合をのぞき多くはウェブサイトに広告宣伝効果を期待しています。見栄えするサイトを作ることに専念せず、サービスや特徴をうまく伝えられるウェブサイトを目指しましょう。

ポイントを絞る

提供できるサービスは、たくさんあるかもしれません。しかし、その中からポイントを絞りましょう。トップページで、いかに興味を持ってもらうかを「写真とテキスト」を使って表現します。写真の美しさ、レイアウト、そして文章の読みやすさが最も大切です。テキストの大きさ・見出し・行間などの気配りを学習しましょう。

]]> https://cocohp.net/2347/feed 0 【参考・公式】ウェディング https://cocohp.net/2315 https://cocohp.net/2315#respond Mon, 13 Jun 2022 01:25:23 +0000 https://cocohp.net/?p=2315 参考になりそうなウェディング関連の公式サイトを紹介します。それぞれに特徴があります。どのような特徴があるか分析してみよう。

mitteミッテレストラン

おふたりの結婚式の“叶えたい”が全部つまった、mitte流の新しいカタチ。みんなで楽しむ自由な結婚式をコンセプトに、レストラン形式のウエディング。https://www.mitte.ne.jp/wedding/

デュクラス大阪

「挙式場総合2021第一位」など、自社のサービスを強く押し出しているサイト。ポイントを絞り、誘導している点に注目しよう。
https://www.duclass-osaka.com/

スローウエディング MiaVia

緑あふれる自然と青空が広がる中でこだわりのスローウエディング。「選ばれる理由」などが必ずあります。https://www.mia-via.com/

ベルクラシック

ベルクラシック「おめでとう篇」

CMでお馴染みのベルクラシック。「今日のおめでとうは、チカラになる」全国にあるベルクラシック総合。https://www.bellclassic.co.jp/

ゼロ婚

「持ち出し費用ゼロ円でここにしかない結婚式を」をコンセプトに、最大限に費用を抑えた挙式を提案。
https://zerokon.jp/

TAKAMI BRIDAL

TAKAMI BRIDAL | ウエディングドレス・和装・タキシードのレンタル

結婚式を総合プロデュースするTAKAMI BRIDALトップページモノクロで、非常にかっこいい。
https://costume.takami-bridal.com/

Photorait

フォトウエディングの決め手が見つかるクチコミサイト。何かヒントが見つかるかもしれません。https://www.photorait.net/

アールイズ・ウエディング

ブライダルフェア【愛するみんなと行く。リゾートウエディングフェア】| 海外挙式・海外ウエディング・結婚式は【アールイズ・ウエディング】

海外挙式・海外ウエディング・沖縄挙式。サービスが幅広いので、今回は参考にしながら、サービス特化して作成しよう。https://www.arluis.com/

ecruspose

よくあるご質問｜ウエディングドレスのレンタル・購入｜ecruspose

ウエディングドレスのレンタル・購入サイト。写真が中心の構成になっています。https://www.ecruspose.jp/

マタニティウエディング

マタニティウェディング│アニヴェルセル

おなかの赤ちゃんと一緒だからこそ、 より特別な結婚式になる。そんな想いから、アニヴェルセルの マタニティウェディングが誕生しました。https://www.anniversaire.co.jp/brand/support/maternity/

TUTUリゾートウエディング

おふたり婚/モントレ・ルメール教会】WEB限定うちなんちゅプランD（挙式＋衣装＋ヘアメイク＋ブーケ＋アルバム＋ムービー）: ブライダルハウスTUTU沖縄 - ainowaフォト

リゾートウエディングに特化した挙式。青い海と白い雲が眩しいデザインです。https://www.resortwedding.net/

ホテルフラッグス 九十九島

ホテルフラッグス 九十九島のプランナーブログ「館内のみどころの記事一覧」 結婚式場(ウエディング)・挙式(ブライダル)【ゼクシィ】

長崎県佐世保市のホテル・レストラン・ウェディング。ストーリー仕立てになっているページも必見。
https://www.capitolhoteltokyu-wedding.com/

京都神社婚

TAKAMI BRIDAL 世界文化遺産で結ぶ 京都和婚

「京都神社婚」は京都で和婚をされるお客様に、衣装・着付け・ヘアメイク・写真など必要なものをセットでご提供するサービスです。https://www.kyotojinjakon.jp/

花嫁日和

和装に特化した前撮り・フォトウェディング。インパクトあるカラー構成が印象的。
https://www.wasoumaedori.com/

アルモニーアンブラッセ

日本が世界に誇る「安藤忠雄建築研究所」が手掛けたスタイリッシュな大人のための結婚式場https://www.tgn.co.jp/hall/osaka/he/

錦屋マリエマリエ

色打掛】【宅配試着サービス】藤地鶴に牡丹 | 色打掛・白無垢のレンタル＜京都・華結び＞

日本の美しいきもの文化を呉服販売、および婚礼衣装レンタルサイト。https://nskym.jp/

Hanayume

「一組でも多くのカップルに“理想の結婚式”のきっかけを」という理念のもと誕生した、結婚式場情報サイト。全国に11店舗ある『ハナユメウエディングデスク』ではプロのアドバイザーに無料相談ができます。式場探しに迷ってしまう花嫁の気持ちに寄り添いながら『納得のいく』結婚式場を見つけるヒントをお届けします。https://hana-yume.net/

結婚スタイルマガジン

結婚を考えている人へ向けての総合マガジンサイト。参考になる情報が詰まっています。

https://www.niwaka.com/ksm/

]]> https://cocohp.net/2315/feed 0 2022年度生徒作品(ECサイト) https://cocohp.net/2279 https://cocohp.net/2279#respond Thu, 09 Jun 2022 06:46:51 +0000 https://cocohp.net/?p=2279 第一回企画発表 2022年/5/26・最終発表日 6/16
今年は、専門学生(3チーム＠6-7名)がECサイトを完成させました。およそ2ヶ月間に渡る制作期間、お疲れ様でした。それぞれのショップが「コンセプト」を掲げ、時代洞察を見据えた付加価値の創造、商品決定、サイトネーム、デザインをすべて企画制作しました。

実在のない架空商品・架空店舗です。システム等一切組み込んでおりませんので、購入もできません。学習のため、写真類一部ネット上のものをお借りしています。各ショップサイトは、検索対象外(noindex)として施してございます。検索に上がることもありませんので、ご了承ください。

<!----------下記のコードを<head>内へ入力すると、検索対象外となります。---------->
<meta name="robots" content="noindex">

]]> https://cocohp.net/2279/feed 0 【学生作品】ウェディング https://cocohp.net/2253 https://cocohp.net/2253#respond Thu, 09 Jun 2022 05:46:31 +0000 https://cocohp.net/?p=2253 学生作品

過去の生徒作品を紹介します。ウェディング課題は、2学年の課題ですので、習得期間およそ1年半での作品となります。※専門学生による作品紹介です。制作上での仮説立案・企画・架空の店舗です。制作練習の為、ネット上の画像やフリー素材を拝借しております。商用利用・営利目的等は一切ございません。

Photo 結び

Photo 結び

撮影・出張スタジオ。Photo結びは 「ふたりらしさ」を大切にし日常を忘れ、”人生最高”の写真をプランニングします。

2021年制作▶︎ サイトを見る

和ドレスオーダー

Wayoose 和ドレスオーダー 

「あなただけの和ドレスで記憶に残るウェディングを」大胆なデザインでインパクトを与えています。明朝体に拘ったところや写真の配置にも工夫されています。

2021年制作 ▶︎サイトを見る

HappyWedding

HappyWedding

できるだけ費用を抑えて挙式を上げたい人へ向けたコンシェルジュサービス。ユーザーの知りたい情報をみ易く整理されています。ベトナム留学生が制作しました。

2020年制作 ▶︎サイトを見る

joia season

joia season

季節をテーマにした結婚式場。桜舞い散る春、向日葵が咲き誇る夏、紅葉が美しい秋、灯り煌めく冬・・・。思い出の季節が結婚式を彩ります。

2020年制作 ▶︎サイトを見る

バウリニューアル 専門式場

バウリニューアル 専門式場

事情があり入籍時に結婚式を行えなかったカップルや、またもう一度愛を確かめ合うために結婚式を行いたい夫婦のためのバウリニューアル専門の結婚式場サイト。

2020年制作 ▶︎サイトを見る

世界一かっこいい脇役

世界一かっこいい脇役

「結婚式に招待されたけど初めてだし何から準備していけばいいかわからない！」という男性に向けた簡単なマナーをそれぞれの服装に合わせて紹介＋おすすめサイト案内。

2019年制作 ▶︎サイトを見る

色は人をより美しくする

HARUIRO FANFARE

「色は人をより美しくする」カラーをテーマに、挙式をコンシェルジュするサービス。春色ファンファーレというサイト名が素晴らしく「理想を追求できる結婚式」というキャッチコピーを掲げました。

2019年制作 ▶︎サイトを見る

]]> https://cocohp.net/2253/feed 0 コンバージョンとは https://cocohp.net/2185 https://cocohp.net/2185#respond Tue, 07 Jun 2022 00:51:32 +0000 https://cocohp.net/?p=2185 ゴールを決める

ウェブサイトを作るにあたって、まず最初に決定しなければならないのは、「ゴールを決める」という作業です。ゴールというのは、そのウェブサイにアクセスしたユーザーにどのような行動を取ってもらいたいですか？ゴールは、いわゆるウェブサイトの目的ということです。

ゴールがないウェブサイトは「何を伝えたいのかわからない」ということに繋がります。制作前に決めておかなければならない項目は、以下のシートに記載していますので参考にしてください。

▶︎ コンセプトシート(2枚綴り)

期待するユーザーの一般的な行動

  • 資料請求をする
  • 問い合わせをする
  • 電話をかける
  • 実際に来てもらう
  • ショッピングカートに入れる
  • 決済する(実購入)
  • お気に入りに追加する
  • SNS等で拡散するなど

期待する行動の中には、「ブランディングを高める」いわゆる「認知してもらう」というものもありますが、これは、行動ではないので、若干意味合いが異なります。また、ショッピングサイトは購入してもらうことが最大の目標ですから、商品がカートに入った後、決済まで確実に誘導し、売上に完結させることが最も重要です。一度ショッピングカートに入れたにも関わらず、最終決済が行われず、サイト離脱することを「カゴ落ち」と言います。優秀なアクセス解析では、細かい離脱率も計測できますので、いかにサイトの誘導が重要かを知ることが出来ます。

コンバージョンとは

ウェブサイトのゴール(目標)を決めた後は、ウェブサイトをどのように誘導すれば、その目標を達成することができるかを考えて設計します。ユーザーがその期待通りに行動を起こすことをコンバージョンといいます。また、その達成率を「コンバージョン率」といいます。

コンバージョンとは、「転換」などを意味する英単語「Conversion」のことで、Webのマーケティングでは「成果」を意味する言葉です。よく「CV」と略されます。「潜在顧客から見込み顧客への転換点」ということで、Webサイトの訪問者がサイト運営者の望む行動を取ってくれることを意味します。例えば製品・サービスのカタログを閲覧した訪問者がその製品・サービスの資料請求をするという行動を取った時、「コンバージョンに至った」「CVが達成された」と表現します。

出典/ミツエーリンクス

コンバージョンを達成させるために、デザインや設計を考えましょう。

]]> https://cocohp.net/2185/feed 0 GoogleWebFonts https://cocohp.net/2152 https://cocohp.net/2152#respond Sun, 05 Jun 2022 07:14:02 +0000 https://cocohp.net/?p=2152 近年、グーグルによるウェブフォントの充実が高まってきました。あらゆる環境で、読みやすく親しみやすいフォントが、気軽に使えるようになりました。今回は、人気の高い日本語フォントを紹介します。

▶︎GoogleWebFont(日本語バージョン)は、こちら

Noto Sans Japanese

Noto Sans Japanese

若干、丸みを帯びた優等生ゴシック体。

太さのバリエーションも豊富で、Black900などはポスターなどにも使えると思います。
▶︎ https://fonts.google.com/noto/specimen/Noto+Sans+JP?subset=japanese

M PLUS 1p

M PLUS 1p

日常的に使うための飽きのこない、それでいてちょっと気になるデザイン。若干手書き風なのが、子供ぽくて親しみやすいフォントですね。

▶︎https://googlefonts.github.io/japanese/#mplus1p

はんなり明朝

やさしくふんわりとした、墨溜まりを意識したデザインフォント。まるで万年筆で書かれたような美しい書体です。ひらがなとカタカナのみに対応。

漢字と英数字、記号などは「IPA明朝体」で補われていますので、タイトルや見出しなど限定した箇所に適しています。

▶︎https://googlefonts.github.io/japanese/#hannari

GoogleWebFontsの使い方

※パソコンで、参照することをお勧めします。

1.　お好みのフォントの太さを選び、その横に「select」をクリックします。

2.　画面をできるだけ広げて、サイドに出ている「Selected family」から、Use on the webのグレー部分のコードをコピーします。

Selected family

3.　Use on the web
To embed a font, copy the code into the <head> of your html
HTMLの<head>内どちらかにペーストします。

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+JP&display=swap" rel="stylesheet">

4.　「CSS rules to specify families」
コピーし、CSSに、プロパティをペーストします。例えば、body全体を、Noto Sans Japaneseで統一する場合は、以下のようになります。

body{font-family: 'Noto Sans JP', sans-serif;}
]]> https://cocohp.net/2152/feed 0 ウェブサイトの原則 https://cocohp.net/2028 https://cocohp.net/2028#respond Sun, 04 Jul 2021 02:48:57 +0000 https://cocohp.net/?p=2028 価値あるウェブサイトを目指して
ウェブサイトは、見て読んでもらわないと価値がありません。ウェブサイトは、「見る・読む・聞く」の構成で成り立っています。(「聞く」に関しては、動画や音楽の分野になりますので、今回は省きます。)そして、次に「理解させる」という工程につなげていきます。

モニターの向こう側には、見たり読んだりするユーザーがいることを意識しながら、制作しましょう。

目的・欲求を果たすために

ユーザーは、「知りたい・買いたい」など、何らかの目的や欲求があって、ウェブサイトに来訪しています。そして、以下の行動を介しながら、目的や欲求を果たそうとします。

  1. 見る(視覚・イメージ)
  2. 読む(視覚・購読・理解)
  3. 理解・感情・納得
    (見ると読むの結果)
  4. 行動を起こす
    (アクション・問い合わせる・カートに入れる)

ユーザーは、①②③の認識が前提となった上で、④行動に移します。行動に移す前に、まずは見やすく分かりやすく、そして理解しやすいデザインを心がけることが、ユーザーの行動に繋がるのです。

① 「見る」
見やすいウェブサイトとは

ユーザーが、サイトに到着した瞬間、視界に入る「パッと見」の印象は、非常に大事です。「読もう・見よう」とする意思決定は、もはやその瞬間に決まっています。見やすいウェブサイトは、「魅力あるウェブサイト」と直結しますから、魅力あるウェブサイトを作る第3原則は、主に次の通りです。

  • 写真・画像
  • 余白
  • 配色

NGの例

×画像の荒れ

写真が暗すぎる・小さすぎる・よく見えない・解像度が荒れている写真は、使えません。

×ごちゃごちゃ

マロンケーキは、一体いくらでしょう？配色を間違えると、商品がまずく見えたりします。

② 「読む」
読みやすいウェブサイトとは

見る＝は、主に写真や画像であり、読む＝テキスト(文章)は、画像と合わせて理解、納得させる役割があります。読みやすいウェブサイトは、内容を理解しやすく、興味や共感に繋がり、お問い合わせや資料請求への行動に結びつきやすくなるのです。

  • テキストのボリューム
  • テキストの大きさ
  • 適度な余白とバランス

NGの例

×余白・行間

テキストを読んでもらうには、余白・行間を正しく設定しましょう。近隣のボックスやテキストに接触しないように余白を設けるのが基本です。

「吾輩は猫である」の一節です。左右の文章は、どちらが読みやすいですか？左右のボックスの違いは、どこでしょうか。テキストの大きさ、行間、余白の配慮を心がけましょう。

③ 理解・感情・納得
伝わるウェブサイトとは

見やすさ・読みやすさが前提となり、　的確にユーザーに「伝わっているかどうか」これがウェブサイトの最大最終の役割となります。しっかり伝えることで、ユーザーは情報を知り、感じ取り、行動を起こすというアクションに繋がっていきます。

NGの例

×伝わらない
ユーザーの欲求に合わせるようなイメージとテキストの配合を考えましょう。例えば、ユーザーの欲求が「痩せたい」「鍛えたい」のなら、その欲求を満たせるようなイメージが必要になります。

ユーザーを迷子にさせない

ウェブサイトで、非常によくあるのが「ウェブを閲覧中に迷子になってしまう」という点です。

アイコン名を入力

あれれ？今、どこ見てるんだっけ？トップページに戻れない！

ページ数や情報がたくさんあればあるほど、ユーザーはサイト内で迷子になってしまいます。的確な誘導、リンクを掲示することも、優良なウェブサイトの原則です。

現在のページの把握

ユーザーは、情報を知ろうとするがあまり、サイトの中をうろうろと回遊していきます。サイト内を横断していくにつれ、自分自身が今、どのページを見ているのかわからなくなってしまうのです。迷子になると、本当に知りたかった情報、見つけたかった商品にたどり着けないまま、離脱(サイトを離れてしまう)ことがよくあります。

ウェブサイトの最大の基本は、「どのページにいても、すべてのページに辿ることができる」・「トップページに戻れる」設計をします。サイトマップ・ページ内見出し・パンくずリストなどを設け、迷子にさせない工夫を凝らしましょう。

  • ページ見出し
  • パンくずリスト配置
  • サイトマップ
  • 的確なナビゲーション

ロゴマーク・ナビゲーション

通常、サイトの左上、もしくは上部センターにロゴマークを配置します。これは、サイトのタイトルとなります。(いわゆる企業名であったり、ショップ名を掲載してあります)。実際知らない人も、多いのですが、ロゴマークはクリックできる仕様になっています。すべてのページから「ロゴマーク」がクリックできるようになっており、ロゴマークを押すことで、トップページに戻れる仕様になっています。

万が一、迷子になったもロゴマークを押すことでトップページに戻れるという仕組みです。フッターにもロゴマークやパンくずリストを配置することで、迷子にさせない工夫を施します。

サイトマップ

すべてのページの階層を一覧にすることで、目的のページへ着地できるように案内を託します。
▶ ソフトバンクサイトマップページ

パンくずリスト

パンくずリストとは、現在見ているページがどの階層ページに着地しているかを目次のように表した追記リンクです。ページ数が多いサイト、階層が深い構成のサイトなどにはパンくずリストが有効です。

例えば、下記の例は、ヤフオクのパンくずリストですが、パソコン階層下のマックの階層下のノート型の階層に着地していることが分かります。パンくずリストを追うこどで、いつでも、上の階層に戻ることができます。

]]> https://cocohp.net/2028/feed 0 和菓子ウェブサイト制作 (2021年) https://cocohp.net/1966 https://cocohp.net/1966#respond Fri, 02 Jul 2021 08:37:46 +0000 https://cocohp.net/?p=1966 株式会社陽陽さま

2021年7月、山口県にある株式会社陽陽さまのウェブサイトを、新規で制作することになりました。

今回の内容は、取り扱っている和菓子「蜂蜜求肥」のPRが主な内容となります。蜂蜜求肥は、現在、山口県、福岡県内に取引先、全国のお土産売り場(道の駅)で販売されています。

「販促先の拡大を目指したい」「取引先を増やしたい」というのが、クライアントのご要望です。ウェブサイトのCV(成果目標)は、お問い合わせを増やす・商品の知名度を上げることです。

背景

味の三幸

蜂蜜求肥は、「味の三幸」という会社が販売していましたが、昨年末に、株式会社陽陽が、業務を受け継いだそうです。

独特のもちもちした歯ごたえと素朴な甘みが全国から多くのファンを獲得しています。

蜂蜜求肥とは

「求肥」(ぎゅうひ)とは、和菓子の材料のひとつで、白玉粉または餅粉に砂糖や水飴を加えて練りあげたもの。食感がもちもちしていて、人気の和菓子です。

第17回全国菓子大博覧会　名誉金賞受賞 第20回全国菓子大博覧会　会長賞受賞 蜂蜜入りで、やわらかな求肥をきなこで仕上げている。添加物は一切使用していない。

Amazon

過日、商品を送っていただき、制作対象者が試食しました。ウェブを制作するにあたって、自ら商品やサービスの特徴や良さを、感じ取ることは、制作過程において非常に大切ですね。

商品先行のコーポレートサイト

コーポレートサイトにも、様々なものがあります。例えば、皆さんがよく知る「シャチハタ」。そう、あの印鑑ですね。朱肉がいらない印鑑です。会社名より、商品が先行しているブランドですね。

シャチハタ株式会社

シャチハタは、メーカー名

シャチハタは、実はメーカーの名前であり、商品名ではありません。シャチハタ株式会社という企業が生産しているシャチハタなのです。オフィシャルウェブサイトも、企業案内よりも、商品の紹介が先行した形になっています。

とらやの和菓子

会社名より商品が先行している企業はたくさんあります。とらやの和菓子のウェブサイトも、商品の写真がトップページに配置されています。会社概要は、階層下になっており、こちらが概要の内容になっています。

笹屋伊織

笹屋伊織

京菓子で有名な笹屋伊織のウェブサイトも、和菓子の写真がトップページに配置されています。


京菓子處 鼓月

京菓子處 鼓月
リクルートサイト

商品の紹介サイトと、会社概要のサイトを分けている場合もあります。また、リクルート情報などは、完全別サイトを立ち上げている企業もあります。京菓子處 鼓月も、オフィシャルサイトと採用サイトを分けてあります。全く異なるビジュアルですね。

商品の良さを伝える

今回、取り扱う蜂蜜求肥は、現在のところ商品数が1点ですので、非常に情報が少なく制作しにくいと思います。どのような写真、レイアウト、デザイン、キャッチコピーが決めてとなるでしょう。

愛情とこだわり

商品のどこにこだわりがあるか、商品への愛情が伝わります。／引用：仙太郎

食感や味

まだ食べたことがないひとが、食べたくなるような食感や味を、伝わるように掲載します。／引用：菓匠　十久堂

掲載する情報

今回の蜂蜜求肥のウェブサイトは、どのような人が訪問するでしょうか？リピーターとなりうる人の動きを想定してみましょう。クライアントは、将来はネット販売も視野に入れているとのことでしたので、ウェブを立ち上げることで、業者や消費者からのアクション(問い合わせ)を期待します。

すでに、食べログでも多くの感想が掲載されていますので、立ち上げるウェブサイトは、さらに知名度を広げる役割を担います。

  1. お土産売り場で、たまたま商品を購入した。
  2. 食べてみると非常に美味しかったので、また食べたい
  3. 通販はしているだろうか？
  4. 検索してみる。
  5. 問い合わせる。
  1. 知人から頂いた。
  2. 非常に美味しかったので、また食べたい。買ってみたい。
  3. 検索してみる。
  4. 問い合わせる。
  1. 商品名を知った。
  2. 仕入れてみたい。
  3. 検索してみる。
  4. 問い合わせる。

上記を想定した場合、必ず掲載する情報があります。

  • 問い合わせフォーム
    これは、必ず必要です。ある程度、個人情報を収集しますので、プライバシーポリシーも記載しましょう。
  • 電話番号(連絡先)
    電話対応が可能な場合、何時から何時までなら応対してもらえるのか、日祝での対応を掲載する必要があります。
  • 商品の価格
    小売価格を掲載しておきましょう。勿論、消費税価格も明記します。また、卸し販売が可能な場合は、卸価格も掲載します。オープンにできない場合は、卸価格については「お問い合わせください」と明記すべきでしょう。
  • 送料について
    送料が別途かかる場合は、掲載しておきましょう。●●円以上お買い上げの場合は送料無料、などと掲載があると買いやすいですし、離島への送料が異なる場合は、明記しておきましょう。
  • ギフト対応や返品についてなども、記載があると良いでしょう。

今回、株式会社陽陽さまのウェブサイトは、扱う蜂蜜求肥がメイン(現在のところ、商品は、ひとつです)となります。

これから商品の撮影を行い、最終決定は2021年8月の予定です。今回、制作に関わる学生は、10名。10のウェブサイトが仕上がり、プレゼンテーションをした後、クライアントが選ぶコンペティション形式となります。

▶URLはこちら(2021年8月リリース予定)

どのようなウェブが仕上がるか楽しみですね。ご期待ください。

ウェブデザイナーの強化書では、制作モデルになっていただける企業様・個人の方を募集しております。▶詳しくはこちら

]]> https://cocohp.net/1966/feed 0 ウェブ制作・教材用モデル募集 https://cocohp.net/1790 https://cocohp.net/1790#respond Thu, 24 Jun 2021 23:34:09 +0000 https://cocohp.net/?p=1790

「貴社のウェブサイト」学生が制作いたします。

当サイトでは、学生の制作演習のため、ご協力いただける企業様、個人の方を募集しております。制作費は、一切かかりません。取得3年目の学生が挑みますので、プロと変わりないデザイン・企画力を備えております。コーポレートサイト、ショッピングサイト、業種等も問いません。打ち合わせ等は、すべてリモートで行いますので、全国からご応募いただけます。まずは、下記の条件を満たしていることが条件です。学生が作ったと思えないクォリティの高いウェブサイトを制作いたします。

  • ホームページがない。あるいはリニューアルを検討している。
  • パソコン・通信環境が整っている。
  • メールでのやり取りがスムーズに行える。
  • 真摯に対応・協力ができる。
  • 制作に必要な写真や情報の提供ができる。

諸注意

カリキュラム上ある程度、制作開始時期が決まっていますので、公開したい希望日と合わせることが難しい場合がございます。余裕を持って、事前にお問い合わせください。教材モデルとしてご協力いただけることが前提ですので、ご要望に添えない場合もございます。事前に、リモート面談させていただきますので、まずは、お問い合わせください。

]]> https://cocohp.net/1790/feed 0 はじめに https://cocohp.net/1601 https://cocohp.net/1601#respond Thu, 24 Jun 2021 05:37:42 +0000 https://cocohp.net/?p=1601

スキルアップを目指して

ホームページが作れるようになったあなたは、綺麗な写真を配置したり、アニメーションを使って動かしたり、ホームページ作りが楽しくなっているのではないでしょうか。今は調べれば調べるほど、いろんな知識を収集することが可能ですし、最近では、様々なツールを使って、実に簡単にウェブサイトを作ることができるようになりました。

幼い頃、図工の時間に粘土で形がない物体や絵の具で絵を描いたりした記憶があるでしょう。

「これはなあに？」「上手に描けたね！」と親や先生が褒めてくれました。趣味の範囲でのものづくりは、あのレベルと同等だということです。料理でいうと、単純にカレーが作れるようになった！ということです。

出来なかったことが出来るようになることはとても嬉しいですし、褒めてもらえるとモチベーションも上がります。難しいHTML言語を覚えるには、まずはモチベーションを保ちつつ「作れる技術」をクリアする。作れる技術を先に習得し、楽しさを実感してから、仕事にしたいと思い始める手順がもっとも理想的です。

プロのデザイナーになるためには「作れる技術」に加え、「考えて作るスキル」が必要です。料理を例に、分かりやすく解説すると、以下のようになります。

  • カレーが作れるようになった。たまに友達を呼んで食べてもらう。
    (作れる技術・趣味の範囲)
  • もっと美味いカレーが作りたい。もっと多くの人に食べてもらいたい。お代をいただく。カレー屋を開店させよう。
    (考える技術・プロ思考)
  • どうしたらもっと多くの人が、食べきてくれるだろうか。何度もお店に来てもらいたいな。カレー屋の売り上げを上げるにはどうしたらいいだろうか。
    (マーケティング思考)

「カレーが作れるようになった」→「もっと美味しいカレーが作りたい」というプロセスと同じです。プロの料理人とは、「どのようにカレーを作れば、お金を支払って食べに来てくれるだろうか」ということです。

プロと素人の違い

プロと言われる人は、「その技術で生活を営んでいる人」のことを指します。ですから、知人から頼まれて、ちょっとしたホームページのお手伝いをしてお小遣いを貰ったりしたことがあるレベルの人は、プロではありません。ホームページを作って継続的に報酬や給料を貰うとうことは、依頼や評価をするクライアント(依頼者)や会社が必ず存在するのです。

自己満足感を捨てること。

ホームページを作り始めた人は、たいがい完成の暁に「自己満足感」に陥ります。「どや見てみ。すごいやろ」という感じですね。初めての作品ですから、喜びもひとしおです。それは、誰にでもある心理状態ですし、当たり前のことです。

ここからプロを目指すのであれば、まずその「自己満足感を捨てること」から始まります。いつまでも自己満足感が捨てれない人は、こどもの粘土遊びと変わらないレベルだということです。実際、ある程度作れるようになった頃に、この自己満足感をなかなか脱ぎ捨てられない人が非常に多いのです。自己満レベルから抜けれない人が、軽々しく請け負い制作をすると、趣旨が伝わらないウェブサイトが出来上がってしまいます。「依頼者(クライアント)」と画面の向こうに「顧客(ユーザー)」がいる」ということを認識することが、プロへの第一歩なのです。

マーケティングを学ぶ

実践的なスキルを習得するには、マーケティングの知識は欠かせません。WEB制作会社は、概ねウェブマーケティングやコンサルティング業務も兼ねています。ここでは、クリエイターとして最低限知っていただきたい知識を公開していますので、就職活動、フリーランスへの参考にしていただけたらと思います。

]]> https://cocohp.net/1601/feed 0