【自主制作】LP制作（デザインカンプ/コーディング/サーバーアップ）

＜担当範囲＞

デザインカンプとコーディング制作しサーバーアップまでを行いました。

（要件定義書に基づき作成。素材は提供素材を使用。）

HTML、CSS、JQueryを用いて実装し、スマホサイズのレスポンシブ対応しております。

★右下の「WEBSITE」の黒いボタンを押していただくと、実際のサイトをご覧いただけます。

【クライアントの課題とWEBサイト制作の目的】

• リゾートホテルLIKESの新規オープンにあたりSNSキャンペーンを実施する
• ホテルはまだ建設中だがサイトを見て興味を持ってもらいキャンペーンに参加してもらいたい

【ターゲット】

• 自分の時間がなかなか取れなくてストレスを抱えている人
• 週末を利用して心身ともに整えたい人
•  アクティビティよりリラクゼーションを求めてくる人
• ワーケーションに興味がある人
• 1人で旅行に行ったことがないが興味がある人、初めての1人旅行者
• 身体にご褒美を与えたい人
• 自分なりに丁寧に暮らしている人
•  無農薬野菜やオーガニックという言葉に惹かれてしまう人

【デザインの方向性】

自然に囲まれているホテルであることと、ターゲットの特性を踏まえ、「リラックス」を連想させるグリーン系のデザインにしました。

日本語フォントはNoto Sans CJK JP、英語フォントはAssistantを使用。細めにし、洗練された印象を与えられるようにしました。

【メインビジュアル】

MV内のコピーは当初はコンセプト内にあったが、ファーストビューでユーザーの感情に訴求するためMVの中心へ移動。Shippori Minchoフォントを使用し高級感を出しました。

キャンペーンバナーはPhotoshopで作成しpngで貼付。もともとクライアントからはテキストのみでの提供でしたが、ファーストビューの世界観を崩さないかつ視覚的に訴求できるよう画像にしました。

クリックするとキャンペーンセクションに飛べるように。

提供素材↓

メインビジュアル内

・2022年7月2日オープン

・リゾートホテルLIKESオープン記念

・Instagram／Twitterに投稿すると抽選で無料宿泊プレゼント

写真メインのファーストビューにしたかったためバナーを作成↓

【コンセプト・キャンペーン】

コンセプトセクションではテキスト量が多いため写真を挟み、視覚でも訴求できるようにしました。

キャンペーンセクションでは背景を写真にし、世界観をなるべく壊さないようにしました。

【アクセス】

もともとクライアントからはテキストのみでの提供だったが、理解しやすくするためPhotoshopで図を作成し貼付。Googleマップもはめ込み、すぐに調べられるようにしました。

提供素材↓

公共交通機関ご利用 

 ※箱根湯本駅　または　小田原駅　からバスご利用が便利です

新宿駅 > （小田急ロマンスカー）> 箱根湯本駅（約90分）> 箱根登山バス（約30分）>「▲▲美術館前」バス停 >リゾートホテルLIKES（徒歩約3分）

 東京駅 >（新幹線）> 小田原駅（約40分）> 箱根登山バス（約40分） > 「▲▲美術館前」バス停> リゾートホテルLIKES（徒歩約3分）

図を作成↓

スマホサイズのデザインカンプはこちら↓