優れたデザインで話題となっている、国内外の最新Webデザインをまとめてご紹介。
インスピレーションやアイデアの参考になるのはもちろん、2024年のWebトレンド動向も見えてきます。
目まぐるしいスピードで新しいトレンドや技術が生まれるWebデザインだからこそ、できるだけ多くのサイトを実際に訪れ、あらゆる角度からアイデアを吸収できるかが鍵となります。
ここでは、制作の見本にしたい３１点のWebサイトを選んでいます。
Webマニアがざわついた最新Webデザインまとめ
わずかに揺れるかわいい犬のイラストからはじまる、犬の散歩代行サービスのWebサイト。ピンクと青のパステルカラー配色や、巨大サンセリフ書体、犬好きに刺さるイラスト画によって親しみやすい雰囲気に。
Colors for Branding | Unlimited Graphic Design – Draftss
エイプリルフールのネタかと思いきや、オープンキャンパスは実際に実施するそう。最高のプロモーション、参加したくなりました。
TOTETOT RECORDS – A fictional music label
架空の音楽レーベルの公式サイトは、とにかく目を引くポップで、唯一無二のオリジナリティーが爆発したクリエイティブな作品。一定時間操作がないと、クルクル回転するロゴがページ全体に出現する仕掛けも素敵。
着用したオブジェクトとジャケットの色を文字入力すると、3Dと写真をミックスしたビジュアルをAI生成。そのリアルな描写は、AIの進化を物語っています。
ヘリテージとデジタル・イノベーションが調和したVIA by LOUIS VUITTONを紹介したケーススタディ。マウスをクリックしながらドラッグすると、カバンの超リアルな質感にズームできます。
よく見ないと気づかないほどわずかな動きを加えたヒーローイラストに目を奪われた作品。シンプルですが印象に残るテクニック。
イラストとポップな配色で親近感の湧く、分かりやすい高校の公式サイト。InstagramやTikTokなどのSNSを、広報としてうまく活用している事例として。
思わず下までスクロールしたくなる心地よいアニメーションが、ページ全体に実装されています。鮮やかで楽しい気分のカラーパレットや、統一感を高める縦長のサンセリフ書体も参考に。
PAQUET MONTÉ（パケモンテ）｜フラン・パティシエ専門店
落ち着きのある灰色の背景に、高級感のあるセリフ書体の組み合わせがオシャレ。デスクトップでは、ページ全体に散らばるように展開する写真レイアウトも素敵。
５０年後の未来の世界をキーボードを使って歩き回りながらアイテムを集め、実際に購入までできてしまいます。ショッピングサイトにゲーム体験を加えた新しい試みとして。
Montblanc Legend Blue – The Run
まるでアーケードゲームのようなクオリティでプレイでき、ゴール到着までの時間を競うブラウザゲーム。
10 years of KOTA – 10 years of KOTA
あるデザインスタジオの１０年の歴史を振り返る特設ページ。3Dブロブの周りを回転するサムネイルはクリックで詳細が展開。チームの仲の良さが伝わります。
The Bang – The product design & branding studio
ホログラムテクスチャのマウスカーソルや、弁当箱にインスパイアされたBento UIレイアウト、やや横長なサンセリフ書体など、デザイントレンドを意識したつくりに。
古いブラウン管テレビに映し出したようなグリッチ感をサイト全体に採用。スプレーペイントとグラフィティアートを加えることで、ユーザーの視線を注目させたいエリアにしぜんと集めるのに効果的なテクニック。
Griflan Design | A Creative Agency in Philadelphia
タイポグラフィを中心としたシンプルなデザインに、二度見したくなるユニークな動きを加えています。セリフ書体とピクセルフォントの組み合わせも今っぽい。
アドビだからストック素材サービスも ここまでクリエイティブ。
Adobe Stockは、アドビがクリエイターのためにつくったストックサービスです。写真やイラストなど高品質な素材が約3億点。無料素材も100万点。
検索、プレビュー、ライセンスの取得をPhotoshopから直接できるので効率の良さが抜群。
たくさんのAdobe Creative Cloudユーザーに選ばれているのには理由があります。
最初のひと月は素材が10点まで無料なので、気軽に始めてみませんか。
