【課題】コワーキングスペースLPサイト

【制作時間】2週間

【使用ツール】Photoshop

【目次】
1.制作物

2.制作要件

3.情報設計

• 要件をもとに考案したペルソナ
• ページ設計

4.ビジュアルデザイン

• デザインコンセプト
• デザインの工夫

5.学んだこと

1.制作物

PC版：デザインカンプ　SP版：ワイヤーフレーム

2.制作要件

• クライアント情報

企業名: Work inc. 

働く人々に新しい可能性を提供する事業を複数展開。事業のひとつに都内で働くビジネスパーソン向けのコワーキングオフィスを運営。会員は30代の女性が多く、キャリアアップのために日々仕事や勉強に励む意欲的な人々が集まるコミュニティとしても機能している。

• 制作の目的

WORK lounge AOYAMAの新規会員獲得、広告やSNSから流入してきた方に利用申し込みや見学予約につなげたい。

• ターゲット層

‐都内で働くキャリア志向が強い方、外交的で自己成長に積極的なタイプのビジネスパーソン。

‐30代で経済的にも余裕があり、自己投資によってさらなるメリットを得たい方。

• ペルソナ

3.情報設計

• ワイヤーフレーム改善案

‐クライアントが重視しているイベント開催の多さを訴求するため、イベントの雰囲気が伝わるセクションを新たに追加

‐施設・設備については、空間の魅力が直感的に伝わるよう写真を大きく配置し、レイアウトを調整

‐料金情報はフォントサイズと配置を見直し、視認性と比較のしやすさを向上

4.ビジュアルデザイン

• ムードボード

• デザインコンセプト

‐都内で働くキャリア志向のビジネスパーソンに向け、自己成長を日常に組み込めるワークプレイスとして設計

 ‐カフェのようなリラックス感と、インダストリアルな要素による集中しやすく洗練された空間デザインを両立

‐忙しい日々の中でも、気持ちを切り替えながら仕事の質を高められる居心地のよさを重視

• デザインの工夫

【配色】

‐メインカラーには #333333 を採用し、真っ黒（#000000）よりも柔らかく、落ち着きと信頼感のある印象を表現

‐ベースカラーにはウォームグレーの #948B81 を使用し、インダストリアルなコンクリート調の質感と空間の奥行きを演出

‐アクセントカラーとして #EE8F31（オレンジ） と #F2C94C（イエロー） を取り入れ、ムードボードにある温かみのあるインテリアや照明の雰囲気を表現

‐全体として、都会的で洗練されつつも冷たくなりすぎない、居心地のよいカフェライクな空間を伝える配色設計とした

【その他】

‐クライアントが特に重視している「コンセプト」と「イベント」を強調するため、背景にテクスチャ素材を使用し視認性を向上 

‐コンセプトセクションでは、コンクリート調を連想させる素材を用い、インダストリアルな世界観を視覚的に表現 

‐イベントセクションでは、暖色系の背景素材を選定し、温かい交流や人とのつながりを感じられる印象を演出 

‐SP版では、単調な縦スクロールによる離脱を防ぐため、必要に応じてカルーセルを採用し閲覧体験にリズムを持たせた

5.学んだこと

• 制作前にペルソナを明確に設定することで、制作途中でも判断軸がぶれにくく、目的に沿ったデザインを維持できることを学んだ。制作に取りかかる前に、ペルソナとゴールを言語化して整理することの重要性を実感した。

• ワイヤーフレームを作成することで、見た目だけでなく、実際に利用するユーザー視点での見やすさや操作性を意識することができた。情報設計や導線を事前に検討することで、デザイン全体の完成度が高まると感じた。

• クライアントが伝えたい要素を整理し、情報の優先順位をデザインに反映させることが、サービス理解のしやすさにつながると学んだ。ヒアリング内容をもとに、強調すべきポイントを明確にすることが重要だと感じた。

• 配色や写真、あしらいは雰囲気づくりだけでなく、ブランドイメージや信頼感を補強する役割を持つと理解した。ムードボードやトーン設計を意識することで、意図のあるビジュアル表現が可能になると感じた。