top of page

デイユースホテル

LP・WEBサイト

「nap now」

​※架空のサービスです

鬼﨑真愛がHTMLとCSSとJavaScriptで作成した、眠りを目的としたデイユースホテルのホームページかつLP(ランディングページ)の作成実績のうちパソコン版
鬼﨑真愛がHTMLとCSSとJavaScriptで作成した、眠りを目的としたデイユースホテルのホームページかつLP(ランディングページ)の作成実績のうちモバイル版

【基本情報】

  • 担当範囲: 企画 / 構成 / デザイン / コーディング

  • 使用ツール: Figma / VS Code

  • 言語・スキル: HTML / CSS / JavaScript

  • 制作期間: 1か月

 

【コンセプト】

「今すぐ寝たいユーザーを迷わせない、直感的な情報設計と遊び心」
「日中に急激な眠気に襲われた方」をターゲットに、必要な情報へ1秒でアクセスできるUIを構築。

新しいサービス形態の魅力を伝えるため、普遍的な使いやすさの中に「心地よい遊び心」を取り入れた、コンバージョン(予約)重視のWebサイトです。

 

【デザインの根拠・アプローチ】

ユーザーの離脱を防ぐシレスな情報伝達と、ブランドの持つ「心地よい微睡み(まどろみ)」の世界観を両立させています。

  • 1. 演出と情報設計(UI/UX):1セクション1画面のダイレクトな伝達
    「今すぐ寝たい」ユーザーが迷わず情報を取捨選択できるよう、シンプルかつノイズの少ない設計を徹底しました。

    • モバイル版の構成: 片手でのスクロール操作を前提とし、画像・文字のサイズと配置を細かく調整。PC版同様の圧倒的な可読性を構築しています。

    • グリッドの開放: 従来の型にハマらない新しいサービスであることを伝えるため、あえてグリッドを崩した配置や大胆な余白の持たせ方に「遊び」を取り入れ、トレンドに敏感な若年層へアピールしています。

  • PC版の構成: 「1セクション1画面」を意識し、スクロール時の視線移動を最小限に抑えたダイレクトな情報伝達を目指しました。

  • 2. 配色戦略:昼寝に最適化されたユニセックスなトーン
    安眠効果のあるブルーをアクセントに、ベースには落ち着きのあるブラウンを採用。あえて「夜の深い眠り」ではなく「午後の心地よい微睡み」を表現するため、明度と彩度を緻密に調整しました。性別を問わず誰もが入りやすいユニセックスなカラーリングに仕上げています。

  • 3. ビジュアルとタイポグラフィ:リラックス空間の醸成

    • 光の演出: 昼寝中の心地よい木漏れ日や淡い光を連想させる写真を選定し、サイト全体にリラックスした空気感を醸成。直感的に「昼寝のサービスであること」を視覚的に伝えています。

    • 游ゴシックの採用: メインフォントには、モダンで可読性が高く、角の取れた柔らかさをもつ「游ゴシック」を採用。情報の読み取りやすさと、サービスの持つ優しい雰囲気を両立させました。

bottom of page