見出し画像

8月。夏の終わりに話題のサイト、11選。

こんにちは、iDID Magazine編集部です。この記事を書いているのは、9月15日、金曜の朝。関東近郊は今週いっぱい暑さがつづくみたいですが、翌週からは少し涼しく、どうやら秋らしくなっていきそうです。といっても、疲れが出やすい季節でもあるので、みなさま、お身体には、どうかご注意を(先月病院に運ばれたスタッフもいたとか…それは私です)。さて、今回は8月に話題になったサイトをまとめてみました。思いのほか、企画型サイトの紹介が多くなったような気がします。気のせいかそれとも夏のまぼろしか。

秋を迎える準備(食欲が主ですが)をはじめつつ、今回もご紹介させて頂きます、8月公開分を。それではどうぞ!

1. DRAFT Minamiaoyama

縦軸と横軸で5つのフロアを表現しているぞ

まず、設計デザイン会社が「新オフィスの案内ツアーサイト」をつくるというアイディアが面白いです。そのデザイン会社、DRAFTの新オフィスはビルの7階〜11階で、「カラフルな色を取り戻す」をコンセプトに、5つのフロアのテーマカラーから決めたそう。
Webサイトでもそのテーマ性を引き継ぎ、なんと縦軸をフロアの階層、横軸を各フロア内の説明に分けることで、Webサイト内でフロアを上下・左右移動しているような(まさにオフィス探訪をしているような)つくりが再現されています。それにしても、こちらのサイト、オフィスの隅々までのこだわりのすごさに、見ているだけで楽しく、なんだかやる気までみなぎってきます。うーむ、デザイン系の会社のWebサイトを見る醍醐味ですね。

Producer: Masaya Yamamoto (ingraft Inc.) @masayasama
Art Director / Designer: Hirofumi Nakagawa (ANDMADE Inc.) @_HN_ WebGL / Front-end Developer: Masayuki Daijima (Calmhectic inc.) @daijimachine

2. 「人間に栄養を」カロリーメイト リキッド

「私はロボットではありません」認証しないと入れません
認証に失敗したらロボット向けのメッセージが

こちらは「カロリーメイトリキッド」のキャンペーンサイトで、reCAPTCHAのbot検出システムを逆手(?)に取って「人間と認証されないとサイトに入れない仕組み」になってます。認証後のコンテンツ体験もすべてがreCAPTCHAのパロディーで、その体験を通じて商品の良い情報を知れるつくり。いつも意図せず訪れるなんだか面倒な認証フローを今度は人間として楽しく体験できる、その価値の転倒の面白さ。この体験を通じて「人間には栄養が必要」というコンセプトがはっきり伝わるところも、また気持ちいい。なお、認証に失敗すると画面右下に0101のバイナリが並び、その文字列をクリックするとロボット専用ページサイトに飛ばされる(このページ、ロボット向けに二進数で表現されており「ロボットに栄養は必要ありません。人間に教えてあげてください。」と書いてます…)。

制作:不明

3. PARTY

PARTYさんのPARTYを探せ!

PARTYさんが、12周年を迎えてリニューアル。実績の多さや魅力的な画像・映像もそうですが、PARTY=パーティの様子を切り取ったような構成のメンバーページは、モノクロなのに(モノクロだからか)まるでそこに「にぎやかな現場の雰囲気」が聞こえてくるような自然さ。そしてページのボリュームや各所演出があるにも関わらずスピード感も損なわない。そのスピードも見せる場所によって違いを感じるような…。また事例ページの、ワークフローや制作過程の実例の丁寧さに頷きつつ、制作クレジットの細かな掲載は以前から代表の伊藤さんのお考えがあるところだったかと思います。抜かりない設計に感嘆の声がもれます…12周年、おめでとうございます!

Digital Artist :SeiichiSega
WebGLdeveloper:Misaki Nakano
(わかる範囲で書いてみました…どなたかわかる方教えてくださいませ!)

4. SHUTL

写真の中に小さい写真。この見せ方が好き

伝統と現代の新たな接続方法を生み出す実験場「SHUTL」のサイト。正統的×現代的という、ともすれば相反する要素をどのように「らしさ」に昇華していくかがテーマだったのではと推察しますが、ここではグリッドレイアウトのスタティック感に対して、画像やテキスト要素の配置でバランスを外したり、バラバラなテイストのフォントを複数使用したり、トランジション、ビビッドカラー、ふきだしなどでヒップなニュアンスを出したりすることで「SHUTLらしさ」を表現しています。それにしても、Shhhのデザイナー宇都宮さんの「日本的美意識とWeb」への指向と、SHUTLの「正統的×現代的」という指向の類似性に驚きます。これはまさにShhhさんらしいお仕事だと、思いました。

Client:松竹株式会社
Creative Direction: 岩崎 達也(Magasinn, inc.)
Project Management: 武田 真彦(Magasinn, inc.)
Art Planing: 黒田 純平(http://keshik.jp)
PR Direction: 松本 花音
Logo Design: 三重野 龍
Graphic Design: 井上みなみ、古山愛子

Website:
Direction: 重松 佑(Shhh inc.)
Design: 宇都宮 勝晃(Shhh inc.)
Development: 坂田 一馬(Good rings)

5. 町の小さな百貨店 モアリブリー

ページが切り替わるときの「ジーーー」に注目

ひと目見ただけで、世界観に引き込まれるのはなぜか。「百貨店」を窓から覗き込むようなMVは、”ひらけごま”で中に入れるお宝の洞窟の入り口?いやこれは、右から左へ動くアニメーションから「幕が開く演出」だと気づきました。お店にあるのであろう商品の写真が集まったり離れたり、そして右上のOnline Shopのアイコンは、戸が開いていらっしゃいとお辞儀をしているような細やかなアクションが、上品さに加えてまるでお店に招かれているような錯覚を覚えます。ADRIATICさんのX(Twitter)の広報用の動画からもWebサイトの印象がそのままのお店なんだろうと感じる…素敵です。

Web Direction, Design, Photography, Movie: 鈴木人詩(ADRIATIC) Technical Direction, Development: 吉永大(ADRIATIC)@daipdaip Development: 上田真緒(ADRIATIC)@free__age

6. OND°

右下にビビッとな青で「音頭」。なんだろ?

左に大きく「OND°」の文字。右上には縦のハンバーガー。右下にはビビッドなブルーで「音頭」。中心には縦書きで6つの職種が並んでいます。コンテンツの主動線が、WORKSでもクリエイターでもなく「役職」からスタートしているところが新鮮ですね。これはごあいさつにある「クリエイティブ集団であること」を強調しているからでしょうか。シンプルながらも、ちょっとした工夫だけでかっこよく見せられる。しかも、このサイト、メンバーページやWORKSページなど、後ろには膨大なページが隠れているんです。それをシンプルなTOP画面に集約させているところ。全体の動線設計も秀逸です。ちなみに、「音頭」のトグルボタンをONにすると、どこからか祭囃子の音が。え、楽しい…。

Creative Direction・Direction・Design:渡辺 祐樹 (Re:design)
Art Direction:佐々木 雅美(OND°)
Develop:磯 大將 (Re:design)

7. Philosophia

ロゴマークがサイト内で分散 / 集合します

まずロゴマークがすばらしく。人、植物、魚、鳥、時間、命…あらゆるエレメントの集合体になっています。「善く生きる。」というワードがあるように「生きる、暮らし、生活」がロゴマークに集約されているのかな、と思いました。そのロゴマークのエレメントがスクロールによって四散し、サイトの最下部でまた再集合します。その間にあるのが、「善く生きる。」にフォーカスをあてたコンテンツ部分。ロゴマークの言語化部分がコンテンツなのかなと。採用コンテンツでの、スタッフの暮らしにフォーカスをあてたインタビューも視点が面白く、その節々に、まさに哲学を感じました。

Agency & Production:STARRYWORKS inc.
Creative Direction, Technical Direction, Design:Koji Kimura
VI Design:Shinsuke Kitomi
Direction:Saki Onishi
Programming:Saya Adachi
Copywriting:Chika Kozono (parks)
Photographer:Yasushi Kurihara (ICHIBIRI PICS inc.)
Assistant Photographer:Shinya Matsumoto (ICHIBIRI PICS inc)
Hair Make:Yasuharu Hino (Partner)

8. 小川ぶどう園

日本昔ばなしのような、巨峰の山です

MVが、巨峰ですね。巨峰という名前は、巨峰誕生の地から見える富士山にちなんで名づけられたらしいのですが、巨峰にとことんフォーカスすることで、ぶどうでありながら山々のような趣も感じられて、そのミクロ/マクロな世界観が素敵だと思いました。品種紹介の、アニメーションからぶどう実写へのつなぎもまた、印象的です(ここの表現、難しかったのではないでしょうか)。なお、制作は小川ぶどう園と同じ愛知のデザイナー、クックドゥードゥードゥーさんが担当しており、ロゴ、ショップカードに直売所の看板やリンゴ箱(!)までDIYで制作しているそう。小川ぶどう園さんとクックドゥードゥードゥーさんの強い結びつきがサイトのところどころから見て伺えるところも、また素敵です。

制作:クックドゥードゥードゥー

9. PARKLET

パンがどんどん作られていきます

人形町駅から歩いて10分もかからないとこにあるパン屋さん(実はこのパン屋さん、過去に訪問済なのです)。MVにうつるキャラクター=パンが、スクロールに従って(SPは真ん中にどーんと配置されている)だんだんとこねられ作られしているところに惹かれるところに「見せる」より「魅せる」な潔さを感じます。その「魅せる」は、お店自体の可愛さにも、スクロールごとに切り替わる背景色にも現れていて。お店の少しヴィンテージを感じる可愛さに「今後行ってみよう」と思わせる魅力を感じます(2回目の来店)。そんななかでも、MVにオープン時間と当日と明日の天気があるのは、お客さんファーストが故の配慮なのかなと思うのです。

制作:不明

10. ズッキュン郵便局(公開終了)

ズッキュン♡ズッキュン♡ズッキュン♡

なんて懐かしいコトバ…ズッキュン!!ネーミングとその手紙を送ったり受け取るドキドキ感を表した可愛いいいいい特設サイト。右が固定メニュー のスマホファーストなデザインでメニューごとの切り替えもスムーズ。
渋谷に突如現れたリアルなズッキュン郵便局で、手紙を書いて送れたり、プリクラが切手になったり、特別な封筒・便箋があったりする場所だった様子。イラストレーターとコラボレーションした限定商品のポストカードなどもキャンペーンならでは。特設サイトは期間限定が多いのですが、ずっとアーカイブされたらいいのにって思いませんか。短期的なのはキャンペーンサイトの宿命ではあるのですが。

限定のポスタカードたち♡

制作:不明

11. 餃子の王将×RAGEBLUE (23SS)

今晩は、王将かな

おそらく4月公開のサイトなのですが、8月に少し話題になっていたので取り上げます。「店舗に行っても思い出しそうなくらいの強烈さ」「商品が1ミリも頭に入ってこなくてただただ面白い」など、話題になったサイトと言えばこのサイトでしょう。アパレルと飲食店のコラボは、近年よく見かけるようになってきましたね。この振り切り方は、どちらのブランドの後味も、うまく(美味く)ちゃんと残りますよね。それにしても撮影のアートディレクションも、サイト内に飛び交うおなじみの餃子の箱や箸袋など、どう決めたらこうなったのか、裏側を知りたいところ、です。

制作:不明

おわりです

以上で、8月の気になったサイトまとめ、おわりです。読んで頂いているみなさま、気にかけてくれているみなさま、いつもありがとうございます!

実は今回がサイトまとめ記事、6本目です。3月スタートで8月まで、半年分のまとめを終えました。いつも楽しくやらせてもらっています。クリエイターのみなさんが責任を持って送り出されたであろうたくさんのお仕事。拝見するたびに、クリエイティブの素晴らしさに嬉しくなるとともに、その背景にあっただろう幾多のプロセスを想像し、紹介する側としても気が引き締まります。ひきつづきがんばりますので、今後も感想、いいねなどいただけるとみんなこぞって喜びます。

次は、9月サイトの更新。ささやかな目標ではありますが、年内は途切れずやっていけたらと思っております。

それでは、また。iDID Magazine編集部でした!

この記事が参加している募集

このデザインが好き

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