見出し画像

2月。冷え込む季節に気になるサイト、12選。(2024.2)

iDID Magazine

春分の日は大嵐でしたね。雪がさーーっと角度を変えながら降り落ちてきたと思えば、30分後には雲のすきまから太陽がのぞいたりと、春の嵐とはこのことなんでしょうか。突風は春の知らせ、と誰かが言っていたような（言っていなかったような）。バレンタインデーもひなまつりも、卒業の季節も通り過ぎたらそこは桜の季節です。あたたかい春が楽しみ…！春よこーい。

そんなわけで2024年は２月。気になるサイト更新です。今回もバラエティに富んだサイトたちが並んでおります。当然ですが、クライアントが違えば伝える相手も違うわけで、持っているビジョンで見せ方も変わります。そして制作サイドの持つ能力と受け取り方によっても違う。そんなことを改めて感じながらサイトたちを眺めておりました。

２月のさまざまな出来事を思い返して、冬の整理整頓をするように、いまいちど話題のサイトを見返してみてはいかがでしょうか。

それでは、どうぞ！


1. Yuen Ye v.3

原野🌱

ニューヨークで活動するプロダクト＆ビジュアルデザイナー、Athena Tianさんのポートフォリオサイト。トップですでにただならぬ雰囲気を醸し出しています。それは分かりやすさや華やかさというより、むしろ「根源的な何か」を想起させます。そしてそこにはぼんやりと「原野」の文字。「原野／yuén yě」とは、Athenaさんの中国語名であり、未開の広大な草原という意味でもあるそうです。彼女自身「その無限の創造性を発揮してワイルドに走ることが好き」なんだとか。だからこその、このトップページの表現なのですね。Athenaさんの態度表明を感じ取れる表現です。

また、斬新なインターフェースに驚かされるのがWORKS。白線をセンターに、スクロールの挙動で左右に開いていくような見せ方が新しい。どこかフィジカルな手触りも感じます。今回はAthenaさんとGarden Eightの利倉健太さんのコラボレーション制作だったそうで、自身のサイトをクリエイターとコラボレーションして制作していくというスタイルも面白い！

Design - Athena Tian @athena_y_tian
Development - Kenta Toshikura @silkhat_7

2. monopo paris

音楽を流しながら見ると楽しい🍷

夕陽がテーマとのことで、陽が沈みかけて、夜と夕闇がまじわる「トワイライトな空間」が表現されています。こちらのサイト、Business Mode / Apéro Modeとモード切り替えができて、Apéro Mode（＝ディナー前の飲み会）ではパリ・ロンドン・日本各国のオリジナル楽曲を聴きながら、文化のミクスチャーなバイブレーションを楽しめる。「ビジネスもプライベートも、どちらも人生だよね」と言わんばかりの心地よさでした！

クリエイティブディレクターのメラニーさん曰く「この夏パリで過ごした時間、運河の夕日、テラスでのアペロ、私たちが出会ったインスピレーションを与えるクリエイティブたちからインスピレーションを受けました」とのこと。日本とパリとロンドンの文化の混合から生まれる、新しい表現を目指しているということが伝わります。また、WORKS一覧でのグリッド／リスト表示の切り替え、ホバーの挙動も斬新〜！（awwwards.でElement Of The Dayにも選出されてました）。

Dev by @bramichou
monopo team
@stella_grotti
@melaniehc_
@mattijsd
@byjoriein
@AsakoTomotani
@lunagooriah
@fw3d

3. サタケシュンスケ

イラストレーターのサイトのひとつのモデルケースだ🖊️

イラストレーター、サタケシュンスケさんのウェブサイト。パッケージイラスト３選／線画を用いた作品５線／春を感じるイラスト３選…などテーマ別のイラストをメインビジュアルに持ってきているところが特徴です。業種／使用媒体／カラーでソートできる機能や、実績のホバーでの見せ方も他の画像も一度に見せる仕組みも面白い。実績紹介ページでは印刷／ブックマークボタンが配置されており、ウェブサイト内でブックマークしたお仕事をまとめてみることができます。

よくある質問も「意外と見かけないけど、知りたいコンテンツ」だと思いました。また、プロフィールシートやポートフォリオなど、お仕事につなげやすいものがとにかく全部揃っている。まさにサタケさんの代わりに営業をしてくれるウェブサイトですね。近年、イラストレーターのウェブサイトを制作会社が担うケースが増えてきています。今回はNASUさんがクリエイティブコンセプト、ミッションステートメントやタグラインまで担当。イラストレーターのウェブサイトにおけるひとつのモデルケースとして興味深いサイトですね。

クライアント｜サタケシュンスケ @satakeshunsuke (Hitotoe Inc.)
クリエイティブディレクション｜前田 高志 (NASU Co.,Ltd.)
Webディレクション / Webデザイン｜中川 誠也 (NASU Co.,Ltd.)
ロゴデザイン｜小賀 雪陽 (NASU Co.,Ltd.)
フロントエンド｜吉永 大 @daipdaip (SETSUNA inc.) , 上田 真緒 @free__age (SETSUNA inc.)
バックエンド｜吉永 大 (SETSUNA inc.)
コピーライティング監修｜浜田綾 (NASU Co.,Ltd.)
撮影｜大崎俊典 (photo scape CORNER.)

4. CLEND

この全面泥のグレーが心地よき🐦‍⬛

「保水力にすぐれた泥ヂカラ」がコンセプトということで、パッケージも「泥たっぷりのバケツ」をイメージ。ウェブサイト全体もまた、泥たっぷりなグレートーンで世界観が統一。そこが新鮮でありながら、とても落ち着いていて心がやすらぐ。なぜでしょう。画像がぐにゃりとゆらぐアニメーションも心地いい。鮮明で鮮烈なイエローの入り方も、グレーを邪魔することなく、美しく共存していて、いつまでもここに滞在していたくなりますね。

このブランドは、コスメティックブランドのボトルワークスさん（nekopiでもおなじみですね！）とPARKさんがタッグを組んでいるのですが、拝見するたびにその商品の「らしさ」がクリエイティブに見事に落とし込まれていて、一度見たら忘れられないのです。

クリエイティブディレクション、デザイン：佐々木智也（PARK Inc.）
実装：Lucky Brothers & co. @LuckyBrothersCo

5. HARUTA 2024 SPRING&SUMMER 

ウェブ界における2024年の春一番☘️

靴のシリーズを紹介する特設サイトから「春が近づいてきている感」を受ける体験ははじめて。サイト界の春一番かもしれません。コピーにある、余白がラッキーを運んでくるような「チル感」がサイト全体に現れています。モデルさんの背景の画像がまるで雲のように動き、このアニメーションのふんわり感もまた、春一番のきもちよさ。

春空間から飛び出したモデルさんの演出や、文字の配置、プロダクトの見せ方がめちゃくちゃすてきなんです。その数々の演出からちょっと先の春を想像してしまう。隅々まで見ても飽きないつくりで心も軽やかになります。このサイトの優しいところは、ECサイトにとんだ先でも同じプロダクトのサムネイルを使っているところ。遷移するとイメージが違ってちょっと迷子になっちゃう、なんてことはないだろうと思うのです。

Creative Direction：Yoshiko Yazawa
Art direction & Design：Takuro Suzuki(Nippon Design Center)
Copy Writing：Reina Takasaki
Photography/Movie Direction/Movie Editing：Yuki Yamaguchi(W)
Styling for Girl：Emiko Akashi
Styling for Boy：Eiji Kawasaki
Hair&Make-up：Naoyuki Ohgimoto(POIL)
model：Yui Okamoto/Kazuki Kaneko
Retouch：Takashi Suzuki(Nippon Design Center)
Technical Direction/Web Development：Taro Higuchi(BERRY'Z)
Produce：Sayaka Soga(Nippon Design Center)

6. 高田紙器印刷工業所

シンプルなタグラインが目に入ってくる🎁

余計な装飾のないサイトです。最初に目に入るのは、ビジュアルではなくシンプルなタグライン。でもこの言葉がシンプルで衒いがないゆえに、まっすぐ伝わってくることに驚きます。コピーライティングの届け方とまた一味違う色を感じますね。さまざまな箱やパッケージ制作の実績が並びますが、全体がグレートーンで統一されているので、落ち着いた印象です。これも自分たちではなく、作品を見てほしい意思の表れなのかもしれません。

ただシンプルなのではなく、そこに気品が感じられる。
伝えることって、本当に不思議。

設計、デザイン、開発：Ryuji Yoshida @RyujiYoshida

7. ONE コンテナワールド

🍌🍌🍌🍌🍌🍌🍌🍌🍌🍌なサイトです

ひとつのコンテナに、バナナは50000本入る。へー！と思うのですが、このコンテナのストーリーを見ていくうちに、コンテナをめぐる世界の物語に感動している自分がいることに気づきます。ストーリーの見せ方、掴み方が驚異的ですね。ちょっぴり変でおかしなコンテンツだと思うのですが、読んでいるうちに、今まで気に留めてこなかった「コンテナというものの存在感」が感じられてくる。面白かったりグッときたりしているうちに、コンテナのことを理解してしまっている自分に驚きます。

どうしても説明くさくなりがちな内容を、ゲームっぽい3Dアニメーション、想像しながら進める一問一答、映画のような漫画のような手法が飽きない。見たくなる設計です。コンテナがどんな風に自分たちに身近なのかを学べるのです🍌。ところどころで流れるBGMは未来を感じ、知らなかった海運コンテナが強く印象に残るサイトでした！

企画、設計、ディレクション：TWOTONE

8. 大竹高等専修学校

ターゲットである中学生を想定したポップなデザインとかわいいキャラクター。モーションひとつとってもポップでファニーで、楽しさが全開に伝わってきます。驚いたのはコンテンツの充実度。調理師科・美容師科紹介では1200時間の実習時間や授業内容、時間割、求人数や就職率（100%！）まで網羅。スクールライフコンテンツでは一転、学校や生徒の雰囲気をスナップ、動画、データを切り口に紹介。この辺は雑誌を読むような感覚で楽しめます。概要だけではなく、きっとみんなが知りたいであろうディテール部分まで網羅し、伝えつくしているサイトですね。

ウェブサイトの役割としては、資料請求とオープンスクールがひとつのゴールだと思うのですが、ここには生徒たちの「楽しい学校生活の瞬間たち」が切り取られて詰め込まれており、それを体験しに、資料請求・スクール体験後はもちろん、在校生も、もしかしたら卒業生も継続的に訪れるサイトになっていくのではないか…と想像しながら拝見しました。

制作：spicato inc.
Direction / Mizuki Ito @super_itomin
ArtDirection,Illust / Masayuki Hosoo @MasayukiHosoo
ArtDirection / Yuko Inoue @yukoinooue
Design,Photo / Jin Shirataki @nichi_iro
Coding,System / Yuki Kanayama @spicato_kana
Coding / Manaka Nabetani @nabe_spicato
Coding / Mana Kasai @manaweb_
Coding / Yurara Nakamura @yurara_spicato


9. MATTER

この画がつよい🖼️

アーティストの酒井建治さんがディレクターを務めるアートスペース「MATTER」のサイト。なんと言っても最初に目を奪われるのが、サムネイルを縦にのばしきったような演出です。酒井さんご自身が、シルクスクリーンや油絵での作品制作を主としているそうで、それをヒントに「シルクスクリーン印刷のような演出」をWebGLで表現したそうです。このシンプルな表現ひとつが、MATTERのウェブサイトを強く印象付けることに成功しており、そのままサイトのアイデンティティにもなり得る表現になっているのではと感じました。

ディレクション、デザイン：NOLL @kazuma_noll
実装：itoh @___walkalone
WebGL：Ryu Utsunomiya @ryuU213

10. SLY 2024 SPRING SUMMER

流体的なロゴ、ビジュアルの先鋭さ、かっこいい💧

この「SLY」の流体的なロゴ、かっこよすぎません…？ “sporty futurism”がテーマとのことで、随所に見られるシルバーやメタリックな表現が新しく、見ているだけインスピレーションを得られそう。キャンペーンビジュアル、ウェブカタログ、イメージムービーまでIN FOCUSさんが担当されたそうで、写真ではスニーカーをアルミホイルで巻いてみたり、洋服やアクセサリーを水中に沈めてみたり…。斬新で先鋭的な表現ですね。ムービーもかっこよすぎました…。

Campaign visual
DIRECTION&STYLING : Keiko Hitotsuyama (SLITS)
PHOTOGRAPHY : Kenta Sawada
ART DIRECTION : Manami Masuda (IN FOCUS)
3DCG : saeko (W)
HAIR : Waka Adachi (eight peace)
MAKE-UP : Masayo Tsuda (mod’s hair)
SET DESIGN : Haruka Kogure
MODEL : Xinyue, Safina
PRODUCTION : Yohsuke Watanabe, Shiori Saeki (IN FOCUS)

Web Site
WEB DESIGN : Ayumi Watanabe (IN FOCUS)
PROJECT MANAGEMENT : Riona Yamamoto (IN FOCUS)
Movie FILM DIRECTION : Takafumi Tsuji (heuristyx)
EDIT : Takafumi Tsuji (heuristyx)
VFX : Takafumi Tsuji (heuristyx)
SOUND-DESIGN : Takafumi Tsuji (heuristyx)
CAMERA : Ryoma Yoshimura
GAFFER : Yasuhiro Uchino
BEST BOY : Katsumi Nakayama
COLOR GRADING : Takashi Albrecht (Nomad)
PRODUCTION : Yohsuke Watanabe (IN FOCUS)

11. 東海汽船グループ10周年記念特設サイト

この船首を見せる構図、ダイナミック🚢

ダイナミックな船首のイラストが太陽を背にぷかぷか浮かぶ。メインビジュアルがインパクト抜群です。ダイナミックであるがゆえに、イラストでありながら船の重みを感じられて気持ちよい。イラストがキャッチーでも世界観はポップにはならず、全体のトーンやフォントなどで、真摯さ、信頼感を伝える。縦書きのコピーも効いています。名物添乗員ウッディーさんが更新しているブログを活かした「船にまつわる小話」も。有益なコンテンツがしっかり活かされているのもすばらしいですね。

制作：Neri design、クックドゥードゥードゥー @cddd_design

12. UNITED ARROWS BEAUTY

タイピングの演出が好きです👩

かなり好きなサイトだったので紹介させてください。ミレニアル世代向けコスメブランド、UNITED ARROWS BEAUTYのサイトです。延々と横にスライドしていくモデルやプロダクトのビジュアルの強さ。ボディコピーの横にムービーを配置することでの飽きさせない配慮。商品特徴エリアでは、スクロールとともに切り替わるプロダクト。プロダクトの特徴がタイピング風に切り替わる演出。すべてがフックとして機能していて、素材の良さをデザインで活かし切っています。スマホで見たときのダイナミズムがまた好きなサイトでした。

制作：もしお分かりになる方いらっしゃったら教えてください！

おわりです

今月も最後まで読んでいただき、ありがとうございました！今回もどれもが素晴らしいサイトで楽しく拝見させていただきました。

・「Yuen Ye v.3」のポートフォリオを、クリエイター同士でコラボレーションしながら作っていくというスタイル。フィーチャリング的。

・「monopo paris」のBusiness ModeとApéro Mode。文化のミクスチャー感覚と、表面／裏面のミクスチャー感覚。

・「サタケシュンスケ」さんの、仕事につなげるイラストレーターのサイトのあり方や、イラストレーターのミッションステートメントやタグラインまで作ってしまうNASUさんの制作スタイル。

・「大竹高等専修学校」の、言葉で伝えられない、生徒たちの一瞬が切り取られた、その雰囲気の伝え方。

このあたりがとても印象に残りました。ウェブサイトにまだまだ感じる可能性。編集部としても、引き続き追いかけていって言葉に残していけたらと思っております。

次回は、３月のサイト。更新されるころには、ほんとの春ですね。
iDID Magazine編集部でした！


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

このデザインが好き

7,066件

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