pace/Be(s)pace_pc.png)
pace/Be(s)pace_sp.png)
コワーキングスペース「Be(s)pace」様(架空店舗)
pace/works_firstview_Be(s)pace.png)
| 制作時期 | 2025年10月下旬～11月上旬 |
|---|---|
| 制作範囲 | ワイヤーフレーム/デザイン/コーディング |
| 製作期間 | ワイヤーフレーム：3日/デザイン：2日/コーディング：10日 |
| 使用ツール | Figma/VSCode/Adobe Firefly |
| ターゲット | 自宅では集中しづらく、作業場所を柔軟に選びたい20～30代テレワーカー。 落ち着いた空間で長時間の作業を行いたい利用者や、短時間の作業・打ち合わせを目的とするビジネスパーソンを想定しています。 |
| 課題 | 利用できるスペース・設備の種類が多いため、情報の整理と優先度の明確化、初めて利用するユーザーがどのようなスペース・料金体系なのかを直感的に理解できる導線の確保が必要があった。 |
| 情報設計 |
全体的な構成として、利用を検討している人の施行をページ構成として落とし込んでいます。 「どのような施設なのか？」「どのような席があり、料金体系なのか？」といった順に不安点をチェックできるような流れにしています。 また、中盤にFAQを配置して、問い合わせを減らし、不明点によるサイトの離脱を防ぎ、利用のハードルを下げることを意識しました。 |
| デザイン |
施設内装のようなカジュアルさ、カフェのような気軽に訪れられる雰囲気をイメージしたロゴを制作し、ベージュ・ブラウンを基調とし、背景色はオフホワイトにしています。 また、色の濃淡の差による視覚的な負担の軽減を意識し、セクションごとの背景に応じて文字とアイコンの明度を調整しています。 このwebサイトの最終的な導線として施設の利用予約のCTAボタンの配色を水色にして全体配色にアクセントを加えました。 今回の架空案件のサイト制作にあたって画像をAdobe Fireflyで生成しています。 |