Facebook 制作の流れ
Logo

【HerTech 架空案件】京都女子旅プラン紹介LP

クレジット
Avatar
WEBデザイナー
【HerTech 架空案件】京都女子旅プラン紹介LP-1
シェア
制作ノート
制作の流れ

要件を確認後、手書きのワイヤーフレームで大まかな構成を決定。その後ペルソナのリサーチを元にキャッチコピー、配色、タイポグラフィを決定。その後一度Figmaにてより具体的なワイヤーフレーム作成しそれを元にデザインカンプに着手。
最初にFVのデザインを決め、旅行プラン部分のデザイン、訴求案内、ボタンデザインの作成という順で作成しました。

1.カラーについて  

京都ということで和風な配色を意識しました。また、プラン名の「はんなり」という言葉から優しく穏やかなイメージ伝えたかったので、優しめのクリーム色をベースとし、アクセントはFVの着物画像から赤、京都といえば抹茶ということで緑、ベースカラーに近く装飾で使う予定をしていたゴールドに近いオレンジを使いカラフルでありつつも、上品さが崩れぬような優しいトーンの配色を意識しました。

2.タイポグラフィについて  

FVでは大正ロマン風な「Kaisei Opti」使用し、軽やかさと上品さを意識しました。メイン部分では「Kaisei Opti」と相性がよく、可愛らしく、かつ読みやすい「Kiwi Maru」を使用しました。

3.FVについて  

着物を着た女性が和風な街を歩く画像を一枚全面に使い、女性、和という情報で惹きつけようと考えました。そして、キャッチコピーは縦書きにし、写真の右半分と合わせて「はんなり」を感じてもらい、左半分でお得情報を見てもらうという視線誘導を意識しました。

4.工夫したポイントについて  

一つ目はモデルコース間を足跡で繋げ、スクロールの端に見切れるよう配置しました。これは次が気になり読み進めたいと思ってもらうようにした工夫です。二つ目はコンセプトをFVの下に置いたことです。プランの手軽さと京都という非日常が味わえるベネフィットを具体的なプランの前におくことでより魅力的に見てもらえるのではと考えました。

シェア
制作の流れ

要件を確認後、手書きのワイヤーフレームで大まかな構成を決定。その後ペルソナのリサーチを元にキャッチコピー、配色、タイポグラフィを決定。その後一度Figmaにてより具体的なワイヤーフレーム作成しそれを元にデザインカンプに着手。
最初にFVのデザインを決め、旅行プラン部分のデザイン、訴求案内、ボタンデザインの作成という順で作成しました。

1.カラーについて  

京都ということで和風な配色を意識しました。また、プラン名の「はんなり」という言葉から優しく穏やかなイメージ伝えたかったので、優しめのクリーム色をベースとし、アクセントはFVの着物画像から赤、京都といえば抹茶ということで緑、ベースカラーに近く装飾で使う予定をしていたゴールドに近いオレンジを使いカラフルでありつつも、上品さが崩れぬような優しいトーンの配色を意識しました。

2.タイポグラフィについて  

FVでは大正ロマン風な「Kaisei Opti」使用し、軽やかさと上品さを意識しました。メイン部分では「Kaisei Opti」と相性がよく、可愛らしく、かつ読みやすい「Kiwi Maru」を使用しました。

3.FVについて  

着物を着た女性が和風な街を歩く画像を一枚全面に使い、女性、和という情報で惹きつけようと考えました。そして、キャッチコピーは縦書きにし、写真の右半分と合わせて「はんなり」を感じてもらい、左半分でお得情報を見てもらうという視線誘導を意識しました。

4.工夫したポイントについて  

一つ目はモデルコース間を足跡で繋げ、スクロールの端に見切れるよう配置しました。これは次が気になり読み進めたいと思ってもらうようにした工夫です。二つ目はコンセプトをFVの下に置いたことです。プランの手軽さと京都という非日常が味わえるベネフィットを具体的なプランの前におくことでより魅力的に見てもらえるのではと考えました。

シェア
大島ぽちりの他の作品
foriio

あなたのforiioを無料で作成

fori.io/
【HerTech 架空案件】京都女子旅プラン紹介LP-1
制作の流れ

要件を確認後、手書きのワイヤーフレームで大まかな構成を決定。その後ペルソナのリサーチを元にキャッチコピー、配色、タイポグラフィを決定。その後一度Figmaにてより具体的なワイヤーフレーム作成しそれを元にデザインカンプに着手。
最初にFVのデザインを決め、旅行プラン部分のデザイン、訴求案内、ボタンデザインの作成という順で作成しました。

1.カラーについて  

京都ということで和風な配色を意識しました。また、プラン名の「はんなり」という言葉から優しく穏やかなイメージ伝えたかったので、優しめのクリーム色をベースとし、アクセントはFVの着物画像から赤、京都といえば抹茶ということで緑、ベースカラーに近く装飾で使う予定をしていたゴールドに近いオレンジを使いカラフルでありつつも、上品さが崩れぬような優しいトーンの配色を意識しました。

2.タイポグラフィについて  

FVでは大正ロマン風な「Kaisei Opti」使用し、軽やかさと上品さを意識しました。メイン部分では「Kaisei Opti」と相性がよく、可愛らしく、かつ読みやすい「Kiwi Maru」を使用しました。

3.FVについて  

着物を着た女性が和風な街を歩く画像を一枚全面に使い、女性、和という情報で惹きつけようと考えました。そして、キャッチコピーは縦書きにし、写真の右半分と合わせて「はんなり」を感じてもらい、左半分でお得情報を見てもらうという視線誘導を意識しました。

4.工夫したポイントについて  

一つ目はモデルコース間を足跡で繋げ、スクロールの端に見切れるよう配置しました。これは次が気になり読み進めたいと思ってもらうようにした工夫です。二つ目はコンセプトをFVの下に置いたことです。プランの手軽さと京都という非日常が味わえるベネフィットを具体的なプランの前におくことでより魅力的に見てもらえるのではと考えました。

シェア
大島ぽちりの他の作品
foriio

あなたのforiioを無料で作成

fori.io/