今回は #SundayNightレビュー というタグに参加させてもらい、選ばれたサイトについて分析させていただきます～！（ぜんっぜんSundayでもNightでもねーじゃねぇかというごもっともなツッコミは甘んじて受け止めます…。）
今回のサイトはこちら。
SASAWASHI ONLINE SHOP
ささ和紙（sasawashi）プロダクトは、画期的特性を持つ自然素材の「くまざさ」を原料とするスリッパ、タオル、シーツ、シャンプー、リンス、ソープ、カーテン、まくら等の製品群です。優れた抗菌性、サラサラとした質感をお楽しみください。
サイトの目的とターゲット
こだわりの素材でシンプル・心地よい暮らしを提案するサイト
見ためのおしゃれさだけじゃない、使い心地の良いものを選びたい30代～50代の男女をターゲットとしたECサイト。「ささ和紙」を素材とした衣類や雑貨を展開しており、素材へのこだわりで競合との差別化を図っているためファーストビューには商品の写真だけではなく素材の写真も使用している。またECサイトであるにも関わらずカテゴリなどのサイドバーはなく（下層ページにはある）、トップページはストーリー重視のブランディングを意識した構成になっている。
性別を問わず商品展開をしているため装飾は極力ひかえめになっているが、動きはオリジナリティを感じる仕様となっており、シンプルだけどこだわりがあるという商品のイメージとサイトのイメージが合致している。サイト全体として余白を大きめに取り一つの商品を目立たせるわけではなく、あえて暮らしの中にとけこむような形で商品画像をちりばめることで、購入後に得られるであろう心地よい暮らしを想像しやすくなっている。また、人気アイテムには使用感を想像できるようなコピーとともに商品画像が配置されており、ブランドの強みである「心地よさ」がより感じられる。
デザイン分析
深い緑のアクセントカラーが映える無彩色を基調とした配色
無彩色を基調に、ささ和紙の原料であるくまざさを感じさせる深い緑をアクセントとして使用している。有彩色を一色だけしか使用していないため派手な色ではないアクセントカラーの緑が際立つ印象を受ける。また、ECサイトで様々な色の商品画像を載せる必要があるため、どの色とも調和のとれる色が採用されているのでは。
ゆるやかな空気を感じるフォントと文字間
本文フォントは欧文は”Lato”、日本語は”Noto Serif JP”を使用。いずれもGoogle fontsでWebフォントとして使用可能。
ロゴタイプに使用されている欧文フォントのしっかりとした特定ができていないが、Frutigerが近いのでは。流れるようなSの形が特徴的。本文フォントに”Lato”が選ばれたのもロゴタイプに近い書体を使用して全体の雰囲気を統一するためかもしれない。
上記画像フォントで使用されているのは（おそらく）”りょう Text PlusN”。筆の流れがあり、日本らしい美しさの感じられつつ、視認性の高いフォント。
全体的にゆったりとした雰囲気をつくるためか、cssの「letter-spacing」プロパティを用いてデフォルトより字間を大きめにとっている箇所が多い。
letter-spacing: .04em;
②font-size:15px;
letter-spacing: .12em;
整列・ランダムのメリハリのあるレイアウト
きっちりと整えられた正方形のレイアウトの後に画像の大きさも様々なランダムなレイアウトが配置されていることによって注意をより引くような構成になっている。ランダム配置の場合も両端は揃えていることでバラバラにはなりすぎないようにバランスがとられている。
シンプルだけど奥行を感じるラインの使い方
この部分のラインの使い方が素敵。枠の上にスライダーの画像を重ねることでまとまりのあるかつ奥行を感じられるデザインになる。自分のデザインに「なんだかのっぺりしている…」と感じることが多いので、奥行を出す一つの方法として覚えておきたい。
instagramへの導線を自然に配置
一日の始まりを感じさせる写真を中心に、instagramの投稿写真（リンク含む）が配置されている。フォローを直接的に呼びかけるのではなく、ブランドの世界観を伝えながら自然とinstagramへの導線を確保している。webサイト内に違和感なくSNSでの発信内容が組み込まれているのが驚き。写真の選定は（おそらく）サイト作成時に設定したもので自動ではないため定期的なアップデートは必要になるかもしれない。
遊びごろのあるスライダー部分のアニメーション
基本的にはシンプルなのだが、上記のような動きの部分に遊び心とこだわりを感じる。こういう細かな動きの部分はデザイナー側で最初からデザインの一部として指定するのかそれとも実装の段階で話し合いながら決めていくものなのか個人的に気になる。
コメント
もともとは土曜夜にサイトを決めて日曜夜にみんなで発表しあおうという企画のはずなんですが、わたしのペースが遅く間に合わせられませんでした…（すみません）。まだまだ足りない知識や視点が多いからこそ時間がかかってしまっていると感じるので、ゆっくりだとしても積み上げていく方向で頑張りたいと思います。
今回のサイトはぱっと見た感じとてもシンプル！なんですが細かいところにやはりデザイナーさんのこだわりがあってシンプルこそ一番難しいデザインなんだろうなと感じました。いちばんすごい！となったのはinstagramへの導線がサイトにすっと溶け込むかたちであること。SNSを含めてデザインすることは今後かなり重要になってくると思うので参考にさせていただきます…！
読んでくださってありがとうございました～！
コメント