見出し画像

12.シェフのおいしいつながり サイトレビュー

レストランのシェフの方たちが中心となって開催される予定のお祭り。
たくさんのお店が出店し、ご飯やお酒を楽しむイベントです。
こちらのサイトがたくさんの工夫が詰まっていてとても素敵なので、レビューしていきたいと思います^^

目的
・イベントのチケットを購入してもらう
・イベントに出店するお店を知ってもらう

ターゲット
・ご飯やお酒を楽しむイベントに興味がある人
・30代〜の男女

印象
かわいい、ゆるい、おしゃれ、高級感もある

特徴

余白
余白は広め。イラストと合わさって絵本のようにゆったりとした印象です。
letter-spancingは0.2emで狭め。

配色
#F4F1EC  ベースカラー ベージュ
#1a0b08   文字色    黒

ベージュの温かみのある背景に、オレンジ、深緑、黄土色、灰色、ピンク、茶など多数の色があしらいとして使われています。
ベージュ×文字黒の組み合わせはおしゃれなカフェのメニューみたいです。

フォント
YuMincho 日本語
"Markazi Text" 英語 Google Fontから使用可

游明朝
游明朝体ファミリーは「時代小説が組めるような明朝体」をキーワードに開発された明朝体ファミリー。(こちらの記事)
このサイトはイラストが豊富なので可愛らしい印象だけになってしまいそうですが、フォントが明朝体なので、レストランメニューのような高級感もあります。

Markazi Text
スラブセリフ体のフォント。セリフ体ですが、かわいらしい印象があります。


メインビジュアル

シェフのおいしいつながり

メインビジュアルが海外のおしゃれな絵本みたいでとても可愛らしいです。
メインビジュアルとロゴを囲むように、左側にヘッダーが配置されています。少し珍しい感じがしますよね。イラストを強調したいというよりも、背景として使いたい意図があるのかなと感じました。
このサイトはリロードすると料理を表すようなイラストが集まってきます。その後もぴょこぴょこと動いていて可愛いです。ヘッダーもホバーするとぴょこぴょこ動くので面白い。
イラスト<canvass>タグというHTMLとJavascriptを組み合わせることで図形が描けるタグを使用して描かれています!(canvassタグ解説サイト)


あしらい

シェフのおいしいつながり あしらい

イラストをあしらいとして使っています。可愛い。
このサイトでは、白丸がお皿、楕円が食べ物として使われています。食べ物のあしらいにはテクスチャが使われていて、それぞれの質感が違うところも面白いです。


真似したいポイント

・かわいらしい雰囲気をぴょこぴょことした動作で表す。

・ナチュラルな雰囲気をだすため、手書き文字を使用する。

・ボタンの線も手書き風に。ホバーすると鉛筆で塗りつぶしたような手書き感がある。

・写真を白黒にして、縦横混合に配置する
→モノクロ写真は、プロっぽいおしゃれな雰囲気ができる。周りにあしらいを置いてあげるとさみしい感じもしない。
 縦長横長どちらも置くと、たくさんの店舗があることが想像できる。

・左にヘッダーがあるため、フッターは左側に少し余白を残している。


感想

今回はシェフのおいしいつながりのサイトをレビューさせていただきました!世界観がとても素敵なWEBサイトでした。
現在こちらのイベントはコロナ禍で開催延期となっているようですが、開催されたらチケットを買ってぜひ行ってみたい素敵なイベントです!

この記事が気に入ったらサポートをしてみませんか?