今日は企画発表の日。スキルワークで学んだ企画書作成の授業を元にして、それぞれオリジナルの企画書を作って発表します。
ここから先は2週間毎にアウトプットをしていきます！自分の作った作品を、根拠と自信を持って発表しなければいけないのはなかなかタフですが、これが卒業後にとても役に立つので、頑張っていきましょう！
企画発表会
みなさん、思ったよりもすごくよくできていました！
時間もタイトだったので、完成度はそれほど求めていなかたのですが、みなさん企画をよく練って構成をしっかり仕上げてきていたことに驚きました！すごい！！
今日は、その後のスケジュール感を考えると、企画書とワイヤーフレームまでを提出して欲しかったのでそうお願いしていました。ワイヤーフレームの完成度は人それぞれでしたが、まだ途中でも、企画をしっかりワイヤーフレームに落とし込めている人が多かったように思います。
個別フィードバックタイム
- No.1 自分のためだけど人のためにもなるサイトが作りたい
-
ペルソナを自分にした、出産から1年間のことを記録した、”子育て支援サイト”のようなものを作りたい。
松山市の子育て情報は見づらいと自分が感じているので、知りたい情報をすぐに見られるサイトが理想！
キャッチコピーが最高です！イラストも上手〜！！カラフルで優しい素敵なサイトになりそうです。
情報整理が課題になりそうなので、しっかり整理して「得たい情報をすぐ得られる」サイトに仕上げていきましょう！ - No.2 お絵描き教室のサイト制作
-
絵画・造形・ワークショップをしているお絵描き教室のサイト制作。ネット検索しても出てこず、SNSでは全体像が把握できないことが課題なので、サイトを作って認知度をあげたい！
まだデザインを見ていないのにデザインも見せてもらったような気分になるほど作り込まれていますね！そして、課題や目的のまとめ方が端的でとても上手。このまま頑張っていきましょう！
- No.3 架空のエステサロンのサイト制作
-
架空とはいえモデルとなっているペルソナがいる。ワックス脱毛をメインとしたエステサロンの企画を、ベースとなるペルソナを元に自分で仕上げていく。
プレゼンが上手！企画書も、架空とは思えないほど作り込まれていて、すごくよかったです！ワイヤーフレームの構成もLPでうまくまとめられていました。今後Wordpressにするなら、というところも考えられていて、将来性も◎！
- No.4 薬に頼らない、薬剤師さんのサイト制作
-
当初の企画とちょっとだけ変えて、「大学時代の友人のお料理教室のサイト」から「薬に頼らない薬剤師さん」のサイト制作に方向転換。今後企画書をもっと進める。
ワイヤーフレームが完成形が想像できるくらいにきれいに整っていました
。文字情報多すぎないように調整していきましょう。企画書は、途中とはいえよくまとまっていたと思います。この調子で頑張りましょう！ - No.5 ダンスの先生のサイト制作
-
「ダンスにちょっと興味がある」人やファミリーがターゲット。憧れの、そのはじめの一歩のお手伝いとなるようなサイトを目指す。ダンスの先生の活動のハブとなるようなサイトにしたい。
クライアントさんにしっかりディレクション できていて、順調そうです！クライアントさんの意見も取り入れつつ、ご自分がデザイナーとして取り入れたいことも反映できるようなサイトに仕上げていきましょう！
- No.6 ボランティア団体（子供の遊び場）のサイト制作
-
駄菓子屋さん併設の、子どもの遊び場。クライアントさんのヒアリングを詰めるにつれて、盛り込みたい内容が膨らんできたのが課題。ゆくゆくはWordpress化したい。
クライアントさんにしっかりディレクション できていて、順調そうです！クライアントさんの意見も取り入れつつ、ご自分がデザイナーとして取り入れたいことも反映できるようなサイトに仕上げていきましょう！
- No.7 鍼灸院のサイトリニューアル
-
企画は構想時と変わらず。このために入学したと言っても過言ではない！クライアントと構成を詰めて、トレーナーにもレイアウトの相談をし、ワイヤーフレーム進行中。
企画がとてもいいので、完成が楽しみです！クライアントさんと相談しながら、鍼灸院のブランディングにもなるサイトを制作していきましょう！イラストもとっても可愛いので入れていきましょう！
- No.8 家族の活動の基盤となるプロフィールサイト
-
家族をクライアントに、そのスポーツを世の中に広めることと、本人の活動の基盤となるプロフィールサイトを作成することに決定！
文句なしにやり甲斐1番のサイトだなと思いました！ぜひ渾身の作品を作っていってください！画像や動画の選定に時間がかかりそうなので、スケジールをしっかりやっていきましょう。
- No.9 知人の会社のサイトリニューアル
-
金属加工業を営む知人のサイトリニューアルで、構想時と変わらず。ヒアリングを進めているところ。クライアントさんの業務を助けるサイトにしたい。
業務内容を理解するところから始まるので他よりも「情報設計」部分が時間がかかりそうですが、順調そうです！コンテンツが多くならないようにまとめましょう。
- No.10 有名観光地のお土産屋さんのサイト制作
-
構想時と変わらず、お土産処のサイト制作。意図せず「お食事処」と認識されてしまっているようなので「お土産処」として認識してもらえるようブランディングから整える必要あり。
クライアントさんのご要望を整理してあげることが重要そうです。ディレクターになって、情報整理をしてあげましょう！不要な情報はいれず、なるべくコンパクトにするのがおすすめです。
- No.11 ビアマイスターを世に広めるサイト
-
構想時と変わらず、技術が世界レベルのビアマイスターのプロフィールサイトを作成する。ビアマイスターを世に広めるようなサイトに仕上げたい！
企画とWF概ね固まってきていますね！構成もうまくまとまっていました。ニアマイスターに興味がなかった人も目に止まるような、魅力的なサイトに仕上がるように工夫していきましょう！
以上、11人発表してくれました！
企画発表フィードバック
みんなに言えることとして以下の内容を共有しておきますね。
文字情報編
文字情報は極力少なくまとめるのがポイントです。
私たちが思うほど、人は文字を読んでいません。
スマホだと特にそうで、みんな流し読みしています。長ければ長いほど、読んでもらえないと思った方がいいかも。
文章が長いだけで、せっかく作ったサイトを見てもらえないのは悲しいですよね。
なので、文字情報はスッキリコンパクトにまとめてあげるのが、ユーザビリティ的にはハナマルです！
今日の発表を見て、「私のWFの文字量が多いかも…」と思った人は、もう少し短くできるか検討してみましょう。
カラー・配色編
企画書のカラーは、コードも提示して数値化してあげた方が説得力があります。クライアントさんにとってはサイト制作後の他の制作物にも使える指標となるので、企画書にはカラーコードも入れてあげましょう。
純黒と呼ばれる#000や真っ白#fffは、デザインでは極力避けましょう。
#000は黒が強すぎて目がしんどく、#fffはデバイスで見ると目がチカチカしやすいということで避けられるようです。黒は意外と真っ黒じゃない方が黒っぽく見えたり、白もまた同じようです。（他にも理由はあるのかも？）
なんとなく多いのは、黒は#333、白は#fafafaあたりかなと思います。
もちろん、フォントカラーは薄すぎるのもNGです。
参考までに、著名なサイトのフォントのカラーはこんな感じ。
Yahoo! JAPAN：#333333
Wikipedia：#202122
NHK NEWS WEB：#333333
日本経済新聞：#333333
NOTE：#222222
ね、まっくろではないでしょ？参考にしてみてください！
構成編
ワイヤーフレームの中で、写真は写真とわかるように、見出しは見出しと分かるように作ってください。
基本的には写真は灰色に色付けします。今回は自分でWFを作って自分でデザインするので良いのですが、WFを渡して他の誰かにデザインしてもらうこともあるので、誰もが分かるようにルールに則って制作するのがおすすめです。
また、ナビゲーション の表記は、英語なら英語、日本語なら日本語に統一するのが良いです。
例）「ホーム・私たちについて・制作実績・お問い合わせ」「HOME/ABOUT/WORKS/CONTACT」
サイト型を作る人へ
「トップページ に何を置くか？」問題
「HOME」とも呼ばれているトップページは、Webサイト全体の入口にあたる重要なページです。トップページは訪れたユーザーにどのようなWebサイトか、誰のためのWebサイトなのか、Webサイト内で得られる情報は何かを伝える役割を持っています。
- ホームページの内容をユーザーに伝える
- ユーザーが必要としている情報へスムーズに案内する
- ユーザーに伝えたい内容を目立たせ周知する
という点を考えながら、トップページで全部を伝えようとせずに下層ページに誘導する入り口だと思って構成してみましょう。トップページが一番デザイン性を持たせて、下層は文字量多めでも大丈夫です！
アコーディオン やモーダルウィンドウを取り入れる方へ
それをやったら「ユーザビリティが上がるかどうか？」問題
何人かの方に、アコーディオン やポップアップまたはモーダルウィンドウという手法があるよとお勧めしたのですが、それぞれにメリットデメリットがあるのでお知らせしておきます。
▷アコーディオン はSEOに影響するのか？
▷モーダルウィンドウとは？（これはコーディングの解説になりますが..）
どちらも、ユーザーが使いやすいかどうか？を考えて取り入れてみることがおすすめです。
次はデザイン発表会！
今日発表した企画書とワイヤーフレームを元に、ブラッシュアップをしたら、みなさんどんどんデザインに進んでいきます。
クライアントさんがいる人は、待ちの時間に手持ち無沙汰にならないよう、できることをどんどん進めていきます。
次のデザイン発表は２週間後！怒涛のスケジュールで周りの進捗が気になり、焦ることもあるかと思いますが、自分らしさを忘れずに目の前のことだけに集中して取り組みましょう。
「自分の敵は自分！」です。自分に勝ちましょう！！
