デザインラフ

rough design

お手数をおかけしますが上の画像はクリックして見ていただけると助かります。

デザインラフ(ウェブサイトトップページ)

作品名・概要: 架空の「思い出横丁タイムトラベルツアー株式会社」のウェブサイトトップページデザインラフです。昭和世代や昭和レトロに興味を持つ若い世代をターゲットに、「明るく楽しそうな、時空を超えた旅への誘い」をコンセプトに制作しました。

使用ツール・スキル: Adobe XD

目的: ターゲットユーザーに対し、ユニークなタイムトラベルツアーの魅力を最大限に伝え、ツアーへの興味関心を高め、具体的な問い合わせや予約行動に繋げること。

工夫した点:

  • 情報設計: トップページで伝えるべき主要情報として「プラン紹介」「問い合わせ」「会社情報」の3点を優先し、ユーザーが直感的に見つけやすく、興味を持って読み進められるよう配置しました。ツアーの魅力が伝わる写真やキャッチコピーを効果的に配置し、好奇心を刺激するよう目指しました。
  • レイアウト: スマートフォンユーザーの利便性を高めるためハンバーガーメニューを追加し、限られた画面スペースでも主要ページへスムーズにアクセスできるよう配慮しました。メインビジュアルでコンセプトを強く印象付け、その下に各セクションへの導線を配置することで、自然な視線誘導を意識しました。
  • カラー・フォント: 「明るく楽しそう」な雰囲気を表現しつつ、視認性を最優先。基調色に白と黒を採用し、コントラストを明確にしました。アクセントカラーはレトロ感と現代的な印象を両立させ、単調にならないよう工夫。フォントは、見やすさを保ちながら懐かしさや遊び心を感じさせるものを選定しました。
  • UI要素: ユーザーの次の行動を明確にするため、「予約」「問い合わせ」「TOPへ」などの主要ボタンを分かりやすく配置し、視認性の高い色や形状、クリックしやすいサイズにデザインしました。

苦労した点: 「明るく楽しそうなコンセプト」を、シンプルで見やすい白黒基調の中でいかに表現するかという点に最大の課題を感じました。色が少ない分、レイアウトや写真、フォント選び、そしてUI要素の配置による視線誘導で魅力を伝えることに注力しました。

反省点・改善点:アニメーションやインタラクションの要素も、ワイヤーフレームの段階で検討すべきだった

制作期間・担当範囲: 約5時間 / デザインラフ(ワイヤーフレームとデザインカンプ)全般

コメント