No.034 ブラウンライス – webサイト分析

表参道のヴィーガンレストランのブラウンライス公式サイト(https://brownrice.jp)分析

表参道のヴィーガンレストランのブラウンライスのサイトは、ページを開くと画面全体に動画が流れていて、動画を背景にして、ロゴが白文字で中央に配置されています。とても綺麗な画像の動画で、スクロールしても少し動画が続いています。縦文字の文章がワンプレビューの後に表示されます。

 

サイトは全体的に明朝体の文章で、とても洗練されています。

今回は勉強のために、デザインを分析しました。

 

PCメインビュー

 

font

文字:白・黒・茶系

読みやすい文字です。

 

color

背景:白・ベージュ

 

メニュー

PCではスクロールをすると上部にメニューが表示されて固定されます。このメニューはスマートフォンでは左上のハンバーガーメニューになっていて、上からハンバーガーメニューが降りてきます。

 

PCヘッダー・フッター

 

スマートフォンハンバーガーメニュー内

 

動き・画面について

サイトを開くと、動画が流れます。

スクロールをすると、各セクションが下から少し上に動きフェードインのように現れます。

 

 

 

まとめ

ブラウンライスのサイトは、画像がとてもきれいで、明朝体の文章使いや縦文字の使い方など、洗練された和を感じ、格調高さを感じるデザインに作られています。実際に店舗へ行ってみたくなるサイトサイトです。「大切にしたい日本の美しさ」(サイトより引用)とあるように、サイトも美しさを感じます。

初回は簡単に書かせて頂きました。分析内容はこちらのページか新規のページに不定期に追記をするかもしれません。

 

PCトップページスクリーンショット

 

スマートフォントップページスクリーンショット

 

webサイト100選 | 雨とホットケーキ