見出し画像

サイトレビュー#4

こんばんは。
今日は1日働いた中でいろんなプチ事件があって、思ったこと。自分自身が抱えて乗り越えた「悩み」とか「不安」は、同じ様な立場になった人のために役立てる事ができるんだ!と。当たり前と言われれば当たり前なんだけど、今までは自分の「悩み」や「不安」でいっぱいでそんな事を考える余裕も無かったのかも!だけど今は俯瞰で見れる様になったり、自分以外の事も考えて行動できる様になった。うれしいな、そんな事に気付かせてくれる周りの方々にも感謝っ。さて、今日もサイトレビュー!


■卵・乳製品・白砂糖をつかわない
 おやつのアトリエmocoさま
http://oyatsu-moco.com/

■サイトの目的
売上アップ
(認知度アップ・ギフト注文・ケーキ予約)

■ターゲット
・卵・乳製品・白砂糖にアレルギーを持つ人
(そのお母さん)
・ビーガンの人
・アレルギーを持つ方にギフトなどを検討している人


■印象/メインビジュアル

画像1

4秒おきに写真が変わり、どれも商品をアップで撮影したもので素材に焦点があっている。また、写真の上にかかるコンセプト「誰もが安心して食べられるスイーツを」により、素材に安心感がある事をイメージしやすい。また明朝体な点も、繊細で丁寧な印象を受ける。


■TOPページ構成
メインビジュアル→バナーリンク→コンセプト→更新情報(お知らせ・お品書き・イベント情報)


【navi】
画像3

①HOME
②ABOUT 
オーナーの写真あり/オーナーの思い
材料の紹介/店舗情報

③SWEETS ★
取り扱っている商品のご案内
ギャラリー(Instagramへのリンク)
お客様の声
画像2

↑ブログの記事を並べている
客観的根拠で、信頼感もアップ!

④CONTACT
⑤BLOG ★
トップでは「更新情報(お知らせ・お品書き・イベント情報)」とされていたが、中身はすべてブログだった。需要が高いものにすぐにアクセスできるような工夫。


■文字
各セクションタイトルはimg、明朝体
本文:14px、YuGothic


■レスポンシブ
ブレイクポイント:740px
ぎりぎりの部分があった。1054px以降は横スクロールバーが出ていた。

■気付いた点
・naviは上部に固定でついてこない
→各ページが縦にあまり長くないから?

・スクロールしていくとタイトルが下から上へ姿を表すアニメーション
きれいに整った配置だがかっちりしている中にアニメーションが入るとサイト全体の印象が柔らかく感じた

・ボタン
ホバーは色が反転する仕様

画像4

画像5

・ゴシック体は小さくても線が一定なので、視認性が高く見やすい
・文字が小さめで整列していると「かっちり感」がでる
→きれいに見える

・ホバーすると白い背景がかかりプラスマークがくるっと回転する

画像6



■まとめ
構成自体はきれいに整列されていてボタンなどの形や全体的な色も落ち着いておりシンプルだった。ただその分、写真内のスイーツの色やイラストがきれいに際立っていたのでバランスが大切だと感じた。
ファーストビューも素材にこだわっている事がすぐにわかったので、依頼者が1番何を伝えたいか・届けたいかの擦り合わせは重要なんだと改めて学んだ。


感想めも
・ABOUTページでオーナーの顔がわかると安心感
・意外と文字もimgが多い印象
・メインビジュアルは写真切り替わるやつ多い
・色使いがまとまっている方が見やすい
→写真でたくさん色が入るのであれば、文字などは無彩色にした方が頭に入りやすい!