サイトデザイン分析 【つぎと】

プロフィール

都内web制作会社にコーダーとして勤務しています。

デザインはやった事がありませんが、サイト制作に携わる者として、自分のマークアップするサイトへの理解を深める為に、デザイン分析をしようと思いました。

納得感のある分析を目指して行きます。

分析するサイトは、ギャラリーを訪れた際に上段にあったサイトをピックしています。

[ 対象サイト ]

株式会社つぎと | 古民家でつづく営みをつくる

サイト全体を通して

「つぎと」は古民家を用いて、地域に新たな営みを生み出し、それを繋いでいく事を事業とした会社です。

サイトの目的は、古民家を通じた営みの可能性を伝える為
サイトのターゲットは、地方自治体の観光・集客の担当者

と想定しました。

「つぎと」は主に文章(テキスト)によって、ターゲットに訴求しています。それだけでなく、写真の使い所にも趣向が凝らされていて、アクセントとしての効果を十分に発揮する所(featureセクション等)で写真を配置しています。

そして、古民家 = 和というイメージがサイト全体で表現され、縦書きで和のリズムが作られています。和というイメージを損なわない為に英字は最小限にしていますが、敢えて会社ロゴを英字にする事でフォーカスを当たる様にして、他の要素に埋もれないように工夫。

カラーは白黒のモノトーンとアクセントカラーの橙色 (#d2b071)で構成し、他の色を増やさないということを徹底。
CTAの「お問い合わせ」でさえも、モノトーンで構成されています。

MV (メインビジュアル)

MVはヒビが入った背景画像の上に、「古民家でつづく営みをつくる」というコピーのとてもシンプルな構成。セクションの背景色にも使用されている淡味のグレーに加えて、ヒビが入った画像を重ねている。

写真や派手なカラーリングによるインパクトは抑え、確実にキャッチコピーが目につく様に。

ヒビというのは、古民家と連想を感じさせます。マンションや一軒家とは異なる特徴をヒビによって表現しているのですね。
 また、一過性の営みではなく、それを繋いでいくからこそ生まれるヒビとも取れる様に思います。

message

一般的なサイトにおける「about」セクションです。

写真は用意せず(文字はsvg画像)、テキストのみで構成。テキストの強弱をサイズやボーダーで付けながら、飽きさせない様に工夫。

社名である「つぎと」という造語に馴染みを持って貰う為に、「継ぐ」という言葉から来ているとまず認知させています。

ただし、「つぎと」は具体的にどんな意味を持つのかは明示されていません。漢字にすると、「継ぎ人」となるのでしょうか。

features

色彩あふれた写真を画面幅一杯、大々的に使用する事で、ここまでのモノトーンなサイトにアクセントを加えています。

普通、古民家のサイトと聞くと、家単体の写真が使用されている印象があります。家の中の写真とか。しかし、「つぎと」はあくまで土地全体に根差した事業をビジネスとしていて、その土地を俯瞰した視点が写真からは伝わってきます。

value chain

「つぎと」がどの様に営みを生み出し、地域に定着させるかのフローを具体的に提示。

そして三つの円の図からは、単に事業を起こして終わりではなく、営みとして循環させるという「つぎと」の思いが伝わって来ます。

続くproductセクションでは、古民家をどの様に活用していくのかといった事が写真と共に分かる様になっています。

また、membersセクションでは、名刺型のカードを採用し、日本らしさが感じられます。

最後に

「つぎと」のサイトを分析してみました。

古民家という「和」の文化、営みを伝承していくという「連続性」や「循環」、「地域密着」の事業形態と言ったキーワードが見えてきて、
「つぎと」が見据える古民家を通じた営みの可能性がひしひしと伝わってくる様なサイトでした。