No.02「岡山の楽器とおもちゃ製作 - mori-no-oto - mori-no-oto.com」#サイトレビュー

岡山の楽器とおもちゃ製作 - mori-no-oto

《概要》

・岡山県西粟倉村を拠点にヒノキを使用して、楽器と音の出るおもちゃを製作している、「mori no oto」のwebサイト

《目的》

・ヒノキで製作したおもちゃの紹介、オンラインショップへの販売促進

・商品に関するお問い合わせを増やすため

《ターゲット》

・おもちゃを販売している企業

・小さな子どもがいる方

《全体の印象》

・積み木を連想させる配色や、角丸長方形で優しいイメージのサイト

・タイトルとテキストのジャンプ率が高く、コンテンツが理解しやすい

・ホバー時の動きが大きくてわかりやすい

《メインビジュアル》

・商品のスライドショーで、角丸長方形の写真が三つ表示されていて、ファーストビューから優しいイメージが伝わる

・左上にオンラインショップのボタン、ホバーすると線が茶色に変化する

・右上にハンバーガーボタン、開くとナビゲーションが表示される。茶色の背景が上からしなやかに出てくる

《コンテンツ》

・「ABOUT」が大きいタイトルの上に、テキストが配置され、その下に詳しくはこちらボタン。高さが抑えられ次のコンテンツへスムーズに進める。

・各コンテンツのタイトルはテキストサイズよりかなり大きくしたローマ字のみ。コンテンツの境界線がわかりやすい。

・「PRODUCTS」の横スライドのボタンが左側にある。ホバーすると茶色が円にとって色が変わり、矢印が動く。写真は初期だと右寄り。

・大型楽器〜INFORMATIONまでコンテンツごとに右側、左側によっており、視線がジグザグに進む。

・INFORMATIONは左寄せで右側に大きな余白がある

・ONLINE SHOPは背景が横いっぱいに写真で、その上にタイトルとテキストがある。写真を薄暗くすることで、テキストの可読性を上げている。

・フッターは茶色ベタ塗りでテキストは白。お問い合わせボタンのアイコンは、メールを送信しているかのように動く。SNSはホバーすると、各SNSのイメージカラーへと変化する。

《カラー》

・#b3d4fc

・#000

・rgba(201,185,147,.4)

《フォント》

・a-otf-gothic-bbb-pr6n

・europa

《レスポンシブ》

・コンテンツが縦積み

・フッターの電話番号がボタンになっている

（ONLINE SHOPとCONTACT USはなぜか全体キャプチャに表示されなかったので別々で）