ほぐれの湯

制作概要

山間にある大型温浴・宿泊施設を想定した自主制作サイト。温泉やサウナだけでなく、客室・食事・プール・館内施設など複数の魅力を持つ施設として設計し、「行く前から施設で過ごす時間を想像できるWebサイト」を目指しました。

情報設計

温浴施設は、温泉・サウナ・食事・宿泊・料金・アクセスなど必要な情報が多くなりやすいため、目的ごとに情報を整理。

写真を楽しみながら施設を知りたい人と、料金やアクセスなど必要な情報をすぐ確認したい人の両方が使いやすい構成を意識しました。

ビジュアル設計

山の静けさや湯のぬくもりを感じられるよう、写真を大きく使いながら余白を広く設計。

見出しには明朝体、本文にはゴシック体を使用し、アイボリー・墨色・深緑など落ち着いた色をベースに、ゴールドをアクセントとして取り入れました。

世界観の表現

情報を並べるだけではなく、「静かな山の中でゆっくり過ごす時間」そのものが伝わることを重視。

縦書きのコピーや大きな写真、セクションごとの背景変化を使い、スクロールするにつれて施設の世界観へ入り込んでいくような見せ方にしています。

動き・インタラクション

写真や文字のフェード・スライド、ホバー時の変化などを取り入れ、ページ全体に静かな動きを加えました。

派手に動かすのではなく、写真を見る時間や次の情報への視線の流れを補助することを目的にしています。

PC・スマホ設計

PCでは大きな写真と余白を活かして施設のスケール感を表現し、スマートフォンでは情報の読みやすさと操作性を優先。

画面サイズが変わっても、写真・コピー・情報の優先順位が崩れないようレイアウトを調整しています。