11.きなりと サイトレビュー

下北山村の暮らしと関わりを届ける きなりと

無性に自然暮らしがしたくなる
奈良県下北山村の暮らしを届けるWEBサイト、きなりと。
穏やかな暮らしが伝わってくる、じっくりと見たくなってしまうWEBサイトです。
Twitterで見かけたこのサイト。私も山に囲まれて育ったので、このサイトを見て地元を思い出してしまいました。

目的
・下北山村への移住、定住者を増やす
・観光客の誘致

ターゲット
・下北山村への移住を考えている人。30代〜
・宿泊やテレワーク先として滞在したい人。
・観光客。

特徴

余白
余白はコンテンツごとの高さが一定ではなかったため測りきれませんでしたが、広めでゆったりとした印象。

配色
#029fe9　  メインカラー　水色
#008BD4　サブカラー　　濁った水色
#111D23　   フッター　　　薄い黒
#1a1a1a　　 文字色　　　　黒

黒白水色のシンプルな配色。水色は明るいトーンで子供っぽくもなりそうな色ですが、他のバランスとも合致して万人に受け入れられる配色になっています。
少し濁ったような水色が入っていることで自然とそのコンテンツに目がいきまし、可読性もアップするのではないかと思います。

フォント
YuGothic　日本語
Noto Sans SC　英語　Google Fontから使用可

游ゴシックもNoto Sansもスタンダードな書体です。
SC表記は馴染みがなかったので調べてみたのですが、小文字と同じ大きさでデザインされた大文字とのこと。(こちらの記事より)

メインビジュアル

メインビジュアルは左に動画、右にロゴ＋写真2枚目、ヘッダー。
ロゴが右側に来る配置は少し珍しいですね。
人の視線はZ方向に移動するため、左にある動画に最初に目がいきます。まずはユーザーに動画を見てもらい、下北村の暮らしをイメージしてほしいという意図ではないでしょうか。
また右側にロゴが来ていたり、メインビジュアルに余白があるとゆったりとしたイメージになります。
動画では下北山村の自然や、そこで暮らす人たちが出てきます。メインビジュアルの動画だけではなく、このサイトは比較的若い年代の方が多く出てくるので、制作者の若い人をターゲットにしていることが伝わります。

視線誘導

このサイトは視線誘導がとても自然だなあという印象を受けました。
例えばこの画像のようにタイトルのフォントはあまり大きいわけではないのですが、本文と比べて少しでっぱっているのでタイトルだと一目でわかりますし、目がいきます。
またこのコンテンツをスクロールすると左側のコンテンツはスクロールするのに右側は固定されます。右側のコンテンツは画像も大きいし、気になってつい視線が固定されます。

真似したいポイント

・メインビジュアルの写真、動画が縦横どちらもあると自由度が上がる

・青の絵の具で書かれた絵が使われている
→写真、イラストだけではなく絵を使うアイデアは取り入れやすそう。

・ヘッダーに場所とハンバーガーメニュー、SNSアイコン
→シンプルだけど、知りたい情報が厳選されている。「きなりと」のサイト名では場所が分からないので、場所をヘッダーに入れるのは親切。ハンバーガーメニューが真ん中に配置してあるのも見やすいと感じた。

・ヘッダーは全画面
→左に写真、右にナビメニューがあり、余白も広いのでゆったりとした印象がある。

・ボタンは矢印が丸で囲んであり視認性が高い。ホバーすると下から上に塗りつぶされる動作で、気持ちいい。

・境界線が多い
→このサイト全体の特徴として、境界線が上手く使われている。ただ区切るだけでなく、色のついた境界線もあり、普段は目に留めない内容でも、自然と見てしまう。

・写真を見る時、春夏秋冬で選べる。またこの時スライドではなくクリックしてスクロールできるようになっている。写真が大きくて魅力的。
→アルバムなどはカテゴリ化してあげるとユーザーも見やすく、自分の意思で選んでいる感じがして好感が持てる。
また写真が大きいと横にスライドするのがめんどくさいので、クリックして移動できるのはとても便利。

感想

このサイトはとてものびのびした自然の中での暮らしやそこに住む人がとても魅力的に表現されたWEBサイトでした。
コンテンツの配置が毎回違うのに、ストレスなく視線誘導されているところがとても良いデザインだなあと勉強になりました。
今回のサイトレビューだけでも真似したいところがたくさん見つかったので、サイト制作の際にはよい部分をどんどん取り入れていきたいです。