【実践課題】課題④Webサイト制作A

OVERVIEW

架空のクライアントからの要件書とワイヤーフレームを元に、スマホのワイヤーフレーム作成とPCのデザインカンプを制作する課題です。今回はデザインのみで実装はなしという条件で作成しています。

【制作情報】

作成時期:2025年6月

制作時間:約2週間(デザイン決定・ワイヤーフレーム作成、デザインカンプ共に1週間)

使用ツール:Photoshop

【目次】

①クライアント情報

②ペルソナの情報

③制作物

▶︎要件定義

▶︎ワイヤーフレーム(PC・スマホ版両方作成)

▶︎デザインカンプ (PC版のみ)

▶︎ムードボード

④制作ポイント

⑤課題を通して学んだこと


①クライアント情報

②ペルソナの情報③制作物

▶︎要件定義◀︎ ZOOMでのヒアリングの様子の動画を視聴しながら要件書を作成

▶︎ワイヤーフレーム◀︎

▶︎デザインカンプ◀︎

▶︎ムードボード◀︎

④制作ポイント

【リラックス】【シンプルモダン】をコンセプトに進めました。

トップにサムネイル、駅までの時間などパッと見た際に店舗のイメージがつきやすくしています。その他に、画面サイズを全体的に大きいサイズにし、プラン内容、設備をアイコンにすることで忙しい中でも必要な情報がキャッチできるよう工夫しました。

配色はリラックス感のある大人の落ち着きをイメージしクールトーンで仕上げました。

⑤課題を通して学んだこと

ヒアリングからクライアントの要望、要件を汲み取るという作業をすることによりより実践を想定した作業を体験できました。制作ではクライアントの要望に添いつつもユーザー目線で利用しやすいカンプ作成の難しさを痛感しました。