#Webデザイン
【デザインの観察】もうすぐ春!桜モチーフのWebサイト

皆様こんにちは。段々と気温が上がってきて春の訪れを感じる今日この頃です。

そんなわけで今回は春といえば桜、という著者の連想で桜モチーフのWebサイトを3つご紹介したいと思います。

早速見ていきましょう!

さくら市公式ホームページ

https://www.city.tochigi-sakura.lg.jp/index.html

こちらは栃木県さくら市のWebサイト。

桜の名所が市内に多く存在することが市名の由来らしく、シンボルマークにも桜が使われていますね。とっても可愛いです♪
そんなわけでサイトのデザインもピンクを基調に、桜をあしらったものになっています。

トップページの背景には桜のイラストが散りばめられており、全体的にパステル調ですがピンクをフワッとグラデーションでにじませて変化をつけています。
差し色の黄緑色も、全体のメリハリ付けに一役買っていますね。桜≒植物の関連イメージとしても分かりやすいです!

また、見出しデザインもこんな感じで、個人的にかなりツボです。

桜を背景にあしらい、ピンク色でなく緑のグラデーションを使っています。私なら固定観念でピンクにしてしまいそうなので、思わず膝を叩いてしまいました!

少し逸れますが、こういった公共機関のサイトは、やはり見やすく分かりやすくというのを熟考した作りになっているなと感じます。見ていてとても勉強になります…!

BOTANIST|SPRINGシリーズ Bloom Your Memory

https://botanistofficial.com/special/limited/spring/

こちらはヘアケア・スキンケア・ボディーケア製品のブランドである「BOTANIST」の、春限定商品を紹介するLPです。

このサイトは全体的に写真を大きく使っています。写真自体が桜を連想させるようなピンク味の強いもので、桜自体が被写体となっているものもあります。イメージに直結する大事なビジュアル要素ですから、写真素材は「桜」を印象付けるのには強烈な手札ですね!

こちらも背景にピンクの繊細なグラデーションを敷いていたり、さりげなくピンクのシャドウを掛けたりしています。微妙に視差効果も付けたり、写真にはザラ加工のようなものも施されています。

サイト自体一見するとエレガントでオシャレな雰囲気でまとまっているなぁという印象ですが、上記のように繊細なテクスチャーを色々な箇所に散りばめて、決して単調にまとめただけではないことが分かります。

この商品を買ってみようかな、という気持ちにさせてくれる素敵なサイトですね♪

化粧筆専門店 京都六角館さくら堂

https://www.rokkakukan-sakurado.com/

こちらは、京都の烏丸と京都タワー内にある化粧筆専門店「六角館さくら堂」という、化粧筆を取り扱うお店のサイトです。

京都と桜…合わないわけがありませんね!

「さくら筆」という製品を取り扱っており、店名にもあるように「さくら」がキーとなっています。

明朝体が和の雰囲気を醸し出しており、ファーストビューでは花びらを散らして華やかな印象付けをしています。全体にスクロールした時の動きもスムーズで、視差効果で生まれる奥行きも、このサイトのゆったり感やはんなりとした雰囲気を漂わせているように思います。

また、同系色でまとめずに背景などに水色を差し色として使っており、爽やかな風情がプラスされています!個人的には、ここで水色をチョイスしているセンスに趣を感じました…!

まとめ

いかがでしたか?

今回ご紹介の桜モチーフのサイトは、たまたまですが全てグラデーションを使用していましたね!
桜の可愛らしいイメージとグラデーションは親和性があるのかもしれません。

また、それぞれ使用している差し色が違って、それによって同じ桜をモチーフにしていてもサイトの雰囲気や印象がガラッと変わるのがとても面白いなと思いました!

最後までお読みいただきありがとうございます♪

CONTACT

この度は当社へご興味お持ちいただき
ありがとうございます。
Webに関するお悩みございましたら、
是非一度お気軽にご相談ください。
平日10:00~19:00