概要

架空の古民家サウナ宿泊施設「杣-Soma-」の公式サイトを想定し、新規制作を行いました。（トップページのみ）

目的

ユーザーが「杣で過ごす時間」をイメージできる構成とし、日本の伝統的な静けさや落ち着いた空気感を丁寧に表現することで、施設への理解や利用意欲を高める。

ターゲット

日常から離れ、落ち着いた時間や“ととのい”を求める20代後半〜50代の男女。あわせて、日本の昔ながらの情緒を体験したい外国人観光客。

情報設計

写真と余白を活かし、滞在時のイメージや世界観が自然に伝わる構成としました。テキストは必要最低限に整理し、写真の印象を妨げない配置を意識しています。外国人観光客もターゲットとしているため、言語切り替えボタンを配置し、日本語ページでは英語のサブタイトルを併記することで、日本語が読めなくても宿の雰囲気が伝わる設計としました。また、自身の宿泊予約時の体験から、設備情報や周辺観光、宿での一日の流れを知ることが滞在イメージの具体化につながると考え、滞在を想起させる写真の配置・周辺観光スポットを明示したアクセス情報・「一日の過ごし方」セクションを設けています。さらに、「予約はこちら」のCTAボタンをFVからサイト下部まで追従させることで、興味を持ったタイミングを逃さず、行動につなげられるよう配慮しました。

デザイン

全体はダークトーンを基調とし、写真の明暗や質感が自然に際立つ構成としました。余白を活かしたレイアウトや縦書きテキストを取り入れることで、日本的な静けさや奥行きのある空気感を視覚的に表現しています。ロゴは、古民家サウナという非日常的な体験を直感的に伝えることを意識し、漢字を主役に据えることで、日本の伝統や空間の重みを表現しました。シンプルな配色にすることで情報を削ぎ落とし、心が自然と内側に向かう印象を目指しています。また、アクセスマップは手書き風にすることでサイト全体の世界観と統一し、公共交通機関や周辺観光スポットを明示することで、具体的な滞在イメージを想起させる工夫をしています。

使用フォント

しっぽり明朝 / Optima LT Prospan
本文には「しっぽり明朝」を使用しています。やわらかく上品な字形で可読性が高く、長文でも読みやすいため、落ち着いた世界観や信頼感を表現するのに適していると考えました。
見出しや英字には「Optima LT Prospan」を採用しています。セリフとサンセリフの中間的なデザインで、明朝体と相性が良く、全体の印象を引き締めつつも上品さを保っています。

配色

#0A1014

#FFFFFF

背景には深い黒を基調とし、文字色にはコントラストを抑えた白を使用しています。配色は最小限に留め、写真の色味や質感が主役として際立つトーン設計としました。強いコントラストを避けることで、静けさや落ち着きを感じられ、長時間の閲覧でも疲れにくい配色を意識しています。また、黒背景には部分的にノイズを加えることで、古民家ならではの質感や日本的な情緒を表現しました。全体にノイズを施すのではなく、セクションごとに使い分けることで、重くなりすぎないよう調整しています。

使用ツール

Figma

制作期間

企画・WF：約6時間
デザイン：約10時間