●制作の流れ
今回ペルソナは設定されていたので、まずワイヤーフレームの作成に取り掛かりました。その後デザインのトンマナを固め、デザインカンプ制作に着手しました。
●カラー
「京都はんなり女子旅」というタイトルに合わせ、上品な女性らしいトーンをイメージして、ベース・メインカラーはライトクリムゾンを選択しました。
また、全体の雰囲気に合わせつつ目立つことを意識して、アクセントカラーはビビッドクリムゾンを選択しました。
●タイポグラフィ
フォントは女性らしさや上品さを感じられるShippori Minchoを選択しました。
CTAボタンやパッケージプランの案内はZEN角ゴシックNEWにすることで、読みやすさを意識しました。
●情報設計
PC版ファーストビューにはCTAボタンにパッケージプランの案内と同じ新幹線と宿のアイコンをプラスしたものを配置し、忙しいユーザーに対してはこの一画面だけでも本LPの目的が果たせることを意識しました。
スマホ版ファーストビューでは一画面で目的を果たすという意識に加え、幅が狭い分窮屈に見え「はんなり感」を損なわないよう、タイトルの位置を変更したりして、世界観の維持を意識しました。
●工夫したポイント
まず「お悩み」をいくつか挙げてからパッケージプランの詳細を載せることで、ユーザーが自然に「自分のことだ」と感じてボタンを押せる流れに出来ると判断し、PC版のワイヤーフレームからデザインカンプに移る際に変更を加えました。(※スマホ版はPC版ののちに制作したため、WFの段階でお悩みのセクションを挿入しています)
PC版モデルコースの詳細では各スポットをラインで繋ぐことで、各項目を左右に振っていながらも自然と視線を下へ下へ誘導できる構成にしました。
梅の花や和柄のあしらいを配置し、「京都」らしい和の雰囲気を出しつつ、かわいらしさも表現しました。
