クライアント
オーガニック野菜宅配サービス「スグ食べ」様（架空／学校課題）
担当範囲
企画 / Webデザイン / コーディング
制作期間
企画、ワイヤーフレーム : 1週間
デザイン : 2週間
コーディング : 1週間
使用ツール
Photoshop / XD / Dreamweaver
概要
デジタルハリウッドスタジオ by LIGの課題として、架空のオーガニック野菜宅配サービス「スグ食べ」様の販促用LPを制作いたしました。お試しセットの購入をコンバージョンとして、食にこだわりがあり「ていねいな暮らし」が好きなママに向けた訴求を検討した情報設計、デザインとなっております。
背景
ターゲット : まだ成長期の子どもがいるママ。働き盛りの夫にも、まだまだ元気でいてほしいと思っている妻。
そこそこ食にお金をかけられる（普通のスーパーの1.5〜2倍程度）。 食にこだわる自分が好き。「ていねいな暮らし」が好き。
目的 :
お試しセットの購入へ誘導したい。
現状課題
・既存のスグ食べWebサイトは存在するが、今回リスティング広告を出すことにしたため、
より訴求力の高いランディングページが必要となった。
・新規購入までのハードルが高く、お試しセットが売れないor認知されていない
-
競合との差別化
競合のオーガニック野菜宅配サービスと比較してスグ食べ様の強みは、「より手軽であること」「より価格が安いこと」だと判断したため、本LPではこの2点を中心に訴求することを決定いたしました。
-
新規購入のハードルを下げる
競合他社の宅配サービスでは2,000~4,000円台の定期購入をコンバージョンとしているものが多く、新規購入への心理的ハードルが高いことが予測されます。スグ食べ様には¥1,280のお試しセットと商品に不備があった際の全額返金対応があり、この心理的ハードルを下げるのには有効と判断いたしました。
-
FV直下のCVエリアと品質保証
既存のWebサイトだとお試しセットの認知率自体が低い可能性が考えられるため、まずFV直下にCVエリアを配置します。次に、競合と比較検討しているターゲットに対して品質保証の内容を見せ、「低価格で手軽に試せる」ことを訴求し、LPを読み進めてもらえるように誘導します。その後もCVエリアは繰り返し登場させ、お試しセットの購入を促します。
-
ていねいな暮らしをイメージさせる
FVやユーザーボイスの写真は「オーガニック野菜を取り入れたていねいな暮らし」のイメージで選択しています。メインカラーの緑はFVの野菜からスポイトで抽出し、サイト全体での統一感を保つとともに「ナチュラルで明るく、清潔感がある感じ（クライアント指定のトーン）」を演出しています。
-
画面幅いっぱいに広がるCVエリア
CVエリアを目立たせてクリックを促すため、画面幅いっぱいに広げております。買い物カゴのアイコンを使用するなど、「CVボタン自体も目立つようにしてほしい」というクライアントリクエストに応えたデザインです。
-
でこぼこに切り抜いた農場の写真
FARMERSのセクションでは、シンプルな長方形や角丸ではなくシェイプを利用した切り抜き方で写真の見せ方を工夫しています。でこぼこしたラインでオーガニック感を演出しました。
EN font
Playfair Display
TOP REASONS FARMERS REVIEWS FAQ
JP font
游ゴシック体
商品に不備があった際には、スグ食べが “全額” 返金対応します
カラー
よかった点
初めて実践的な学校課題に挑戦しましたが、情報設計からコーディングまで一通りWeb制作の流れを経験することができ、各フェーズで苦戦しながらもトレーナーさんへの質問やWeb検索でひとつひとつ解決していけたのがよかった点です。
反省点 / 今後の課題
デザイン制作時に画面の可変幅をあまり意識できておらず、コーディングのレスポンシブ対応でとても苦戦しました。また、flexやpositionプロパティの理解が浅く、かなり効率の悪い方法でレイアウトを整えています。本課題をきっかけに、コーディングの効率の良さや可変のしやすさなどを意識して、改善を心掛けるようになりました。