【実践課題】LP制作 ｜情報設計・ワイヤーフレーム・デザインカンプ

■目次

　❶期間　❷制作物　❷クライアント要件　❸工夫点　❹学び   『ソフト：Photoshop』

❶期間

・制作期間 約2週間

　- ワイヤーフレームの修正案作成（２日）　      - SPワイヤーフレーム（２日）

　- ムードボード作成（1日）　　　　　　　　　- PCデザインカンプ制作（７日）

　- ブラッシュアップ（３日）　　　　

❷制作物

　１）デザインカンプ

　２）PCWF（編集前後）

　３）SPWF

　４）ムードボード

　１）デザインカンプ

⚫︎コンセプト＆テーマ「向上心高めのキャリアウーマン」

　・フレッシュ、ハツラツ

　・シンプル、効率的　

⚫︎伝えたいイメージ「明るくて前を向いて鼓舞する知的な女性」

　☑︎女性向けキャリアアップが学べるビジネススクール

　☑︎2０〜30代向け

　☑︎経営者になりたくて、繋がりが欲しい仕事意識高めの女性

　・以上の企業のメインターゲットとペルソナから明るくハツラツとした、知的な女性をイメージ

　・オレンジをベース、くすんだ色を取り入れ、落ち着いてるけど可愛らしい印象ある女性が目を引かれるデザイン設計

　・SNS等で、20〜30代の個人で働いてる女性がくすんだ茶色を利用しているものを普段よく見かけるので、くすんだ茶色をベースカラーとして利用

　・余白と細い線で上品で大人ぽいイメージを作る

　２）PCWF（編集前後）

　３）SPWF

　４）ムードボード

❸クライアント要件（利用方法やアクセス情報を載せたWebサイト制作  ）                           

⚫︎クライアント名：WORK ,inc.（女性向けのビジネススクールを展開）

　・会員は20~30代の女性

　・キャリアアップの為ビジネススキルを学ぶ

　・定期的にビジネスコンテストなどのイベントも開催

⚫︎目的：WORK lounge Aoyamaについて知ってもらう

⚫︎ターゲット

　・ビジネススクールWORKの会員様
　・ ビジネススクールWORKの会員ではないがWORKが気になっている方

⚫︎ペルソナ

　・川上希望（３２）｜ 仕事で成果を出したい

　・属性

　　　- 東京在住

　　　- 某メガベンチャー　ゲーム事業部（8年目）

　　　- 既婚で旦那さんと２人暮らし

　・背景や行動

　　　- 仕事が大好きで今までスキルアップには多くの投資 をしてきた        

　　　- 同じような目標を持った同年代の女性と繋がり切磋琢磨したい

　　　- 会社外での人脈を作りたい

　・ニーズやゴール

　　　-  仕事での成果をもっと出していきたい

　　　-  経営への理解も含め役員になりたいが起業も考えている

　　　-   強いチームを作るためマネジメントやコーチングも学びたい                

❹工夫点

　１）文字を読まないで情報が伝わるよう文字が多い所は写真で表現

　例えばLP上部のスタートのコンセプトで沢山の文字が続くと、なんとなくしか頭に情報が入らず、その先を読みたくなくなるので、画像で「３つ情報がある」という事が先に伝わるようにした

　２）反復

　画像の配置・アイコン配置の仕方を反復させ（色々多用せずシンプルに）、Webサイトの情報を捉えやすくする

　３）丸みを少し足して（数字や角丸など）女性が目を引く可愛らしさと柔らかさも表現

　４）その他

　・地図や問い合わせボタンは詳細を知りたい人のみで、重要ではないので、メインカラーで区別

　・線を細く、余白を大きく取り、高級感を出す

❺学び

　・Window Resize機能

　　ウィンドウサイズを調節し、デザインを実際にWebページに載せた時のイメージが見れる

　・ボタンやキービジュアル、アコーディオンなど参考になるサイトを探して、組み合わせる（いきなり自分で作らない）

　・最大コンテンツ幅：1200px

　・WFに時間をかける（良いWFで良いLPが決まる）