せろりのセオリー | Webサイト100選

Webデザイン未経験の私が、魅力的で優れたWebサイトを見て考察力、表現力を学ぶ学習サイトです。

No.26 CITADELLE

■概要

フランス生産のアルコールジンの商品サイト。

 

 

■ターゲット

・お酒が好きな人

 

 

■FV

中央に大きく文字が現れ、pionnierという黄色い文字と、下にボトルとレモンが少し見えていてレモン系の飲み物かなと予測がつく。英語、フランス語が分かる人だと、ginという単語を見てレモンテイストの爽やか系ジンだと一目で分かる。
下の方に少し写真が見えているのでスクロールすると、レモンピールの入っている柑橘系のお酒ということで、レモンを背景に商品が配置されていて、透明感のあるボトルと周りで飛んでいる水しぶきが爽やかさを演出して、爽快な喉越しを感じさせられる。私自身お酒は飲めないが、この写真を見てさっぱりとして美味しそうだなと感じた。

 

 

 

■特徴

ノングリッドデザインのため、見出しのジャンプ率を高くしセクションの区切りをはっきりしている。フォントや写真の大きさで強弱をつけ、縦文字を使ったり、イラストの配置を工夫することで、ノングリッドだが全体のバランスを上手く取るように設計されている。

テキストは必要最低限のシンプルな内容で、他のページへ誘導するようにすることで、離脱することなくサクサクと次の項目を見ることが出来る。

せろりのセオリー/ Webサイト100選 No.26 CITADELLE

せろりのセオリー/ Webサイト100選 No.26 CITADELLE

 

 

 

 

テキストに明度が低めの濃い青色を使うことで、ボトルの透明感とレモン色がマッチしボトルの爽やかさがより際立ち、レモンの風味や爽快感を視覚的に感じることが出来る。

せろりのセオリー/ Webサイト100選 No.26 CITADELLE

せろりのセオリー/ Webサイト100選 No.26 CITADELLE

 

 

 

丸い図形に沿って文字がぐるぐる回っている画像が、ページの所々に配置されており単調にならないよう動きが作られている。お酒を飲む陽気さポップさを感じる。
原材料のジュニパーベリーを掌に乗せている画像が大きく配置されているが、きれいな手ではなく、土?がついているような手に乗せられているのが、採れたてで新鮮な雰囲気を出している。どのジンにも必ずジュニパーベリーは入っており、ジンの個性を出すのに一番重要と言われているため、原材料へのこだわりを感じる1枚である。

せろりのセオリー/ Webサイト100選 No.26 CITADELLE

せろりのセオリー/ Webサイト100選 No.26 CITADELLE

 

 

 

 

イラストを入れることで、ただただオシャレな雰囲気だけではなく、ポップさがプラスされ、ジンを気軽に楽しんでもらいたいという雰囲気を感じることが出来る。

せろりのセオリー/ Webサイト100選 No.26 CITADELLE

せろりのセオリー/ Webサイト100選 No.26 CITADELLE

 

 

 

 

料理と一緒にグラスにジンを注ぐ写真はユーザーの購買欲を刺激する。この写真を見て、家族や友人とパーティ、食事をしたいなという気持ちに駆られる。写真からボトルだけ飛び出しているのも、ダイナミック感が出てインパクトが出る。

せろりのセオリー/ Webサイト100選 No.26 CITADELLE

せろりのセオリー/ Webサイト100選 No.26 CITADELLE

 

 

 

■フォント

・ 見出し:Catacumba Pro
・テキスト: Din OT

 

 

 

■配色

・テキスト, ベースカラー:#282864,  #ffd732
・ベースカラー:#F8F7F3(グラデーション)

せろりのセオリー/ Webサイト100選 No.26 CITADELLE

せろりのセオリー/ Webサイト100選 No.26 CITADELLE

 

 

 

 

Webサイト:CITADELLE

せろりのセオリー/ Webサイト100選 No.26 CITADELLE

せろりのセオリー/ Webサイト100選 No.26 CITADELLE

次へ 投稿

前へ 投稿

返信する

© 2025 せろりのセオリー | Webサイト100選

テーマの著者 Anders Norén