【自主制作】架空ジムLP
SHE likes WebデザインコースにてWebサイトの制作課題に取り組みました。 コース内で支持されている色味や配置を工夫して作成しています。
< 制作概要 >
制作時間 :情報設計1日、ワイヤーフレーム2日、デザインカンプ 4日、
制作範囲 :情報設計、ワイヤーフレーム、デザインカンプ
使用ソフト:Photoshop
< 目次 >
1. 要件
2. 制作物
3. 工夫したこと
1.要件
目的:ウェブサイトから無料お試し体験を申し込んでもらう
ターゲット:20代から30代の女性 パーソナルジムに興味がある方
目標・ゴール:毎月100件以上の申込
デザインイメージ:洗練されて新しく始めたくなるような明るく爽やかなイメージ
堅くなく、誰でもこれるようなオープンな雰囲気
対応デバイス:PCスマホ
内容:自分らしい美しさを追求する女性限定パーソナルジム
ジムのコンセプト・ポイント・企業情報・システム・料金体系・よくある質問・アクセス
2.制作物

【コンセプトシート】

【ワイヤーフレーム】

3.工夫したこと
●メインビジュアル

〈加工前の写真〉

〈加工後の写真〉
写真素材をコンセプトシートで決定した配色のグラデーションに加工することでより一層まとまりが出るようにしました。
また、「今だけ限定!無料体験実施中」のボタンをメインビジュアルに入れることでファーストビューで体験申し込みに誘導できるようにしました。
●システム

課題では写真の横に文章があり、縦に3つ並んでいるような形でしたが文章が長くてフォントが小さいと離脱してしまう人も多いのではないかと考え、見出しのみ残してボタンで別ページに飛べるようにしました。
見出しの文字よりも写真がメインにし、それぞれシステムに関する写真素材を選択しました。
●CTA

課題では写真なしの色のみの画像でしたがウェブサイト全体の印象と馴染ませるためにの部分にも背景に写真を入れました。
また、配色を使用し、爽やかさを重視したグラデーションをかけることでメインビジュアルとの統一性を持たせました。
さらに、この部分にもメインビジュアルに挿入したボタンと同じものをいれ、ページの途中でも無料体験のページに誘導できるようにしました。
●FAQ

白い背景と区別するためにドロップシャドウを入れて見えやすくしたのがポイントです。
課題では孤立したタブのみでしたが「よく見られている質問から探す」と「キーワードから探す」の2種類の検索方法を設けることでより早く求めている回答に辿り着けるようにしました。
