【day68】紬かけつぎ店 #1日1サイトレビュー

紬かけつぎ店

【概要】
愛知県一宮市でかけつぎ（かけはぎ）店のサイト

【選んだ理由】
一般的なWebサイトではないレイアウトで、とっても柔らかい印象に惹かれたから。
→レイアウトやイラストの使い方などを分析

【参考になるデザイン（PC）】
・かけつぎのイラスト糸の線画でページのエリアや導線が誘導されているデザイン
→ページ下部に向かって、かけつぎをするところからの修理がおわった様子までの工程がエリアの内容にあわせてレイアウトされていて、ストーリー性を感じる！
・グローバルナビゲーションの横に、メニューアイコンが縫い跡のようなデザインで配置
→メニューをクリックすると、縫う動作のようにメニューアイコンが「×」に変化する！かけつぎとリンクしたデザインで素敵

▼縫い跡のようなデザインのメニューアイコン。

・ページ全体での色数が少なく、線画のイラストが活きてスッキリシンプルな印象
・各ページへのリンクボタンのボックスは、メニューアイコンと同じような、画像で手書きっぽい線のデザインになっている
→ただのボタンではなく、優しさを感じるし、線画イラストとマッチしている

▼リンクボタンのデザイン。矢印も線画になっている。

・ページは中央揃えでレイアウトされていて、イラストはコンテンツがレイアウトされているエリアの横幅を超えてレイアウトされている
→サイト全体で「動」のデザイン要素は少ないけど、その分、「静」のデザインが活きている
・わたしたちについての動画も、アングルや間がかっこいい、、サイトの雰囲気とマッチしているし、真面目な方々なんだと伝わって信頼度もあがる
・ブログとお知らせの部分はラインなどはなく、余白でエリアがわけられている

▼余白の大きさでエリア分けされている。

【ターゲット】
服を修理したい人

【サイトの目的】
・服を修理したい人に、修理内容をしってもらう
・修理を依頼してもらう
・問い合わせをしてもらう

【フォント】
和文タイトル：FOT-筑紫A丸ゴシック Std
和文本文：Noto Sans JP

【カラー】
フォント：4C4948（グレーっぽい黒）
アクセントカラー：FAEEE7（くすみサーモンピンク）

【レスポンシブ（SP）】
・下層ページへのリンクはコンテンツエリアで右寄せになっている
→親指でのタップがしやすいから？優しい、、
・PCではなかった電話問い合わせのリンクもページ右下に配置されている
→スマホならではのデザイン

▼「料金表を見る」やSNSリンクが右寄せにレイアウトされている

・メニュー画面は1画面に全リンクが表示されるようにレイアウトされている（スクロールしなくてもいい）

▼1画面に収まるよう、コンパクトにレイアウトされているメニュー画面

【感想まとめ】
かけつぎとお店の方の雰囲気が伝わる、優しくて信頼感のあるサイト。
このサイト、好きだッ！

▼PCサイズ キャプチャ