7月。夏まっさかりのサイト12選。
こんにちは、iDID Magazine編集部です。ついに、夏到来ですね。これを書いている今は、8月上旬。お盆休み前には公開してみなさんに見て頂けたら…という算段でやっております。今回は、7月の話題になったWebサイトを12サイト、集めてみました。夏ということで、心なしか元気な、パワーあるサイトが多いような…?気がします。暑い夏に、元気なサイトで元気をもらいたいですね。もらいましょう!
心をゆるやかに、更新もゆるやかに。
今回もはじめさせて頂きます。7月公開分。どうぞ!
1. TORIKIZOKU 新卒採用サイト
まず、「さて、今日も世の中を明るくしていこうか。」というコピーと、じんわりタレがたれてきそうな、黒くて強いA1ゴシック。「世の中を明るくすることがルーティーンで当たり前のこと」そんな声が聞こえてきそうです。にょっきと生える翼のイラストは、にわとりのように「飛べなくても羽ばたいていこうじゃないか」ということかも。わたしのイチオシ「TORIKI TIMES」では、サイトの全コンテンツの中でポイントだと思われる箇所を抜き出してインデックス化。世の中を元気にしたい「鳥貴族の哲学」がデザインに落とし込まれているだけでなく、サイトを見ている人(就活対象者)がまず元気をもらえる(哲学のインストールができる)ところが深いと思いました。
2. センダイパルコ15th
まさにロゴが主役なサイト。色遊びと絶妙なバランスが目に入ってきたインパクトのあるロゴは、仙台生まれのAYOND/佐々木俊さんの制作。INTRODUCTION内をクリックすると本人の手書きのメッセージがどカーンと出てきます。。ロゴのビジュアルデザインを中心に、各所の動きやロ回転のバリエーションなど細かな調整が行われています。所縁のあるクリエイターさんや地元の祭りのコンテンツが盛り込まれているのも、地域キャンペーンサイトならではの面白さかも。とにもかくにも、仙台PARCOさん、15周年おめでとうございます!🎉
3. BEAMS + STARBUCKS® Find My TOGO Style
BEAMS × STARBUCKSのコラボレーションのキャンペーンサイト、8月直前に話題になりましたね。IN FOCUSさんの投稿より先にTwitter界隈で盛り上がっていました。画像の影と、切り抜きの立体感、ポイントとなる動画、縁付きの写真…。少々レトロさを感じる色味も頭に残りました。BEAMSのスタッフさんがモデルになっているようですが、Staff ProfileのFavorite Drink情報が載っているところ…細かい!ロゴ下の3つの記号がこのキャンペーンで伝えたいウラのメッセージを占めしているようにも、見えます。暑い日が続くけど外に遊びに出ちゃおっかな、ていう気持ちになったサイトでした。
4. インターオフィス
ナビゲーション、All Menu、Price List、カルーセルと、それぞれの見せ方が新鮮。にもかかわらず、それぞれが画面上でぶつからず、すっきりしているように感じます。メインビジュアルも、タイル型のマスク処理によって実績が少しずつ見えていくギミック(ランダム処理されています)により、素通りさせない。スマホだと、All Menuが上から出るのが、スクロール途中からなんと下から出てくる(!)。などなど、細かい配慮が行き届いたデザインだと思いました。なお、インターオフィスさんのコーポレートスローガンは「Good Design is Good People(良いデザインは良い人を生み出す)」なのですが、新鮮な納得感を感じられるスローガンって素敵ですよね。
5. tote inc.
こちらのサイトも話題になっていました。音楽×インタラクティブが強いイメージのtoteさんのサイトリニューアル。今回はロバの頭の上に鳥!ロバの耳はまるで鳥の羽(!?)!タイムラインに流れてきて一旦スクロールを止めた人が多いビジュアルでしょう。ビジュアルのインパクトを裏切らないtoteさんワールドの迷路に入っていくと、途中で無造作に見つかるハンバーガーやトートバックを横目に、爆音でBQMを流しながら時間を溶かしちゃう、そんなサイトでした。ハンバーガーは最後にクリックをオススメします🍔
6. トヨタバーチャル工場見学
トヨタのバーチャル工場のサイト。PCでも効率性を感じますが、SPでもスクロールなしの画面遷移で無駄なく、スムーズな動きで、シンプルなのにわかりやすさが重視されているように思います。そして、「クルマづくり」という言葉はなく、モノづくりの集結がクルマづくりと感じるこだわりがイラスト・テキスト・動画で表現されています。
7. STARRYWORKS inc.
STARRYWORKSさんのロゴ&Webサイトがリニューアルされています。アクセス時に一瞬表示されるロゴタイプがすぐ消えて、ロゴマークと実績タイトルだけが並ぶデザインで、とにかくシンプル!これだけでもかっこいいわけですが、実績テキストをホバーすると背景に現れるぼかし&モーションブラー&マウスインタラクションで、実績によってサイトの雰囲気が大きく変化していくのが本編。STARRYWORKSさんのモーションへのこだわりが伺えます。17周年おめでとうございます!
8. 視覚伝達デザイン学科 オープンキャンパス2023
武蔵野美術大学の視覚伝達デザイン学科、通称「視デ科」のサイト。カッターマットの上に、色、サイズ、配置がバラバラの「紙」を模した情報があります。何気なく見進めていくわけですが、この情報をどう見たか。わたしの場合、青の大きいもの→小さいもの→オレンジの大きいもの→小さいものへと視線が誘導されていきました。レイアウトがバラバラで情報が分散する中で、人はどう情報を読んでいくのか。 視覚デザインの「どう見えたか」「理解できたか」をユーザー自ら試せるようなつくりで、一種の体験型サイトと言えるのではないでしょうか。あとこの紙、スクロールすると画面上部にたまっていくところも面白いです!
9. Shindo Tomoka - 新道トモカ
フォトグラファー新道トモカさんのポートフォリオサイト。掲載されている作品が、すべて画面右寄せで配置されています。展示作品にいたっては額装された姿で掲載されていて、作品単体ではなく展示会場のような「作品を含めた空間性」が意識されたつくりになっているようです。
10. 野崎ひろこ
フォトグラファーさんの次は、イラストレーターさんのポートフォリオ!このサイト、よく見ると入稿データのコーナートンボのようなものが。ポートフォリオを名刺に見立てているのかも。文字が切れていたり、同じ情報が繰り返されていたり、デザイン制作中の雰囲気がそのままデザインになっているのが好きです◎。でもそんな情報の中でも、しっかり作品が目立つ、すっきりしたつくり。STUDIO制作です!
11. BNN, Inc.
BNNさんのコーポレートサイト&ECサイト。余分な情報を削ぎ落として、本のデータベース&検索性に特化。それはデザインにおいても同様で、グリッドをベースに、彩り鮮やかな本を引き立て、見やすくするためのデザインに特化しています。興味深いのは、出版物をシンプルにデータベース化することで出版社のカラーがより明確になること。このサイトへの感想で「デザイン本がまとまっている便利サイト」といったツイートがあり、それもまた言い得て妙だな、と(それほどサイトがシンプルであり、BNNさんのカラーが明快になったということかも)。また、サイトを見ていて思いましたが、「出版社ベースで本を探す」ニーズってあるかもですね。これから新しい潮流が生まれるかも。そういえば、幻冬舎さんも最近サイトリニューアルをされていて、こちらも素敵でした!
12. くりもと眼科
こちらも話題になってましたね!「まばたき」を思わせるモーションの後に、検査中の先生が何かをのぞきこむ写真。実は、検査中の人の眼を通した写真になっているのですね。各ページ遷移のトランジションも、ページ全体がぼやけ→まばたき→ページ表示という流れで、結果的にページ表示がくっきり見えて気持ちよい。このサイトは「まばたき」の擬似モーションを見ているうちに、気づけば自分の眼球を意識するようになっているところが面白いです。
おわりです
以上で、7月のサイトまとめ、おわりです。今回も最後までご覧いただき、まことにありがとうございました。いつも温かい目でご覧いただき、編集部一同感謝しております!
これからお盆で、旅行にいかれる方、実家に帰られる方などさまざまかと思います。引き続き熱中症にはお気をつけて、水分補給をして、また次回のまとめサイトにてみなさんのお目にかかれることを願っております。
次は、8月の更新です。それでは、また。iDID Magazine編集部でした!
この記事が参加している募集
この記事が気に入ったらサポートをしてみませんか?