「ウェブサイトのアイデアが浮かばない」
「刺激的なインスピレーションが欲しい」
「打ち合わせでイメージをすり合わせたい」
そんなときに目を通したい、世界で話題の最新Webデザインをまとめてご紹介します。
2023年のデザイントレンドを意識した作品から、時代に関係なく愛されるシンプルなスタイルまで、幅広いセレクションを取り揃えています。
レイアウトや配色などの参考にできるのはもちろん、魅力的な動きのアニメーション探しにもおすすめです。
最新ウェブデザインまとめ
カラフルなグラデーションで埋め尽くされた空間を移動しながら、制作実績を見つけ出す超ポップなポートフォリオサイト。ハンバーガーメニューは、まさにハンバーガーそのまま。
ノスタルジックで幻想的な色使いのイラストが特長のランディングページ。モバイルでの閲覧に最適化されており、想定ユーザーに刺さる、読みたくなるコンテンツも素敵なサイト。
「あなたのバスタイムを一新するシャワーヘッド」をコンセプトにした商品のランディングページでは、高級感のある美しさと、汚れを落とす実用性もうまく表現。
安倍晋三元総理銃撃事件。あの日、あの場所で、何が起きたのか。安倍晋三元総理や山上徹也被告は、どんな光景を目にしていたのか。このサイトは事件当時の空間を3つの異なる視点で再現した、「75秒の記憶」です。
「仕事のよろこび」を求めて、リーダーが自分自身と部下を幸せにし、精神的に健康に保つのに役立つ逸話をまとめた面白サイト。
マウスでページ中を移動しながら、ためになるアドバイスを見つけだそう。
サイト全体に広がるグラデーションの図形シェイプやイラスト、目に優しい配色など、親しみやすさを感じる不動産向けページ。
店内の様子を撮影した動画を、画面いっぱいに表示したヒーローデザインで、メニューを表示すると、思わずクリックしたくなるホバーアニメーションが実装され、さまざまな動物たちが隠れています。
カーソルを合わせるたびにグリッチ風に切り替わるヒーローイメージや、ピクセルドットのページ遷移アニメーション、バツ印に展開するナビメニューなど、こだわり満載のポートフォリオサイト。
一瞬で目を奪うおしゃれなヒーロー画像が、高級感あふれる壁紙を販売するブランドイメージにも合ったショップサイト。
マウススクロールに合わせたアニメーション付きのコンテンツ表示や遷移が魅力的なウェブサイト。
グリッドを無視したような、ジグザグに画像を配置したり、迫ってくるような没入感を追加するなど、最後までユーザーを飽きさせません。
カリフォルニアにある民泊施設の紹介ページは、無駄を省いたミニマルスタイルで、オシャレ度満点。
シンプルですが、伝えたい内容はきっちりまとめられており、情報量の少ないコンテンツでの制作の参考に。
ずっと見ていたくなるようなストーリー性あふれるコンテンツは、どれも遊び心たっぷりに表現されており、思わず訪れてみたくなるベルギーにあるスパゲティレストラン。
画面全体に表示されるマップを移動させながら、Web3の知識をついて知る学習型コンテンツ。気になるイラストをクリックすると、各詳細が表示されます。
かわいい動物キャラクターイラストが印象的なサイトで、レトロな日本語フォントや配色ともうまくマッチしています。
矢印キーで操作して最高タイムに挑戦する、中毒性たっぷりな車のミニゲーム。光るラインをたどると、スピードアップで加速します。
「気の新しい使い道を発明する地域共創プロジェクト」公式ウェブサイトで、メッセージから活動内容、商品の販売まで行います。
個人的に背景色として使われていた、「薄みどり色(#E3EAE0)」を参考メモとして。
サイト全体を通して利用されているイラストが統一感だけでなく、コンテンツの理解度を深めるのにも大きく貢献。ちょうどよい余白スペースや文字の大きさなども、実践的に参考にしたいところ。
フルスクリーンで写真が展開するポートフォリオは、余計なUIなどを一切省いたミニマルスタイルで、制作実績をメインに据えたデザインで、心地よいコンテンツ遷移アニメーションつき。
クロアチアにあるホテルの宿泊サイトで、落ち着いたおしゃれな配色に、高級感のあるセリフ書体を用いることで、統一感のあるデザインに仕上げています。
香港を拠点としたゲームクリエイティブ制作会社のホームページで、オレンジ色をアクセントカラーに、デジタル感のある太字フォントが印象的。
マウススクロールに合わせて、3Dパーツの周りを移動しながら、コンテンツの内容を表示する、ダイナミックな見せ方。
万が一、火事になってしまった時の脱出ルートを確認しておくことの重要さを伝えるサイトで、5分以内に建物のなかからの避難を体験するゲームによるコンテンツ構成。
アーケードゲームさながらの高詳細な動きを表現したミニゲームを楽しむことができるサイトで、キャラクターの動きに合わせてコンテンツとストーリーが展開していきます。
アスパラガスや玉ねぎなどの栽培を行うカナダの会社で、ビジョンや行っている内容を分かりやすいイラストで紹介、スクロールしたくなる仕掛けが随所に。
スクロールに合わせて字幕風に字が表示されるエフェクト、いろいろなサイトで増えてます。
ビルに向かって吸い込まれるような没入感のあるアニメーションで幕をあける、アムステルダムにある貸しオフィスの紹介ランディングページ。
鮮やかでコントラスト比の高い、黄緑色(#E5F77D)のアクセントカラーも印象的。
スマホアプリやPCゲームを中心としたゲーム開発を行う、鹿児島に拠点を構えるゲーム開発会社のウェブサイト。
立体的な3Dイラストを回転させると、行っている事業や採用情報、お問い合わせなどを表示することができます。
クリックでショールームの扉をくぐり、海外旅行などの豪華プレゼント企画の会場へと進む、体験型オンラインサイト。
賞品をえらぶ際に利用する画像カルーセルには、浮遊感たっぷりな3Dイラストにアニメーションが追加され、マウスの動きが光源となり、インテリアを照らします。
自分のお気に入りの楽曲データをもとに、複雑な動きで踊るミュージカルアバターを作成できるサイト。各アバターのスライダーによる遷移アニメーションが斬新。
2023年の母の日を記念した特設サイトでは、特別なギフトをタロットカード占いのように探すことができる、ゲーム要素を取り込んだショッピングサイトの好例サンプル。
まるでビデオテープを再生しているようなノイズ感を画面全体で表現、さらにざらつきの強弱もカスタマイズできるなど、クリエイティブな個性がひかるポートフォリオサイト。
花に関係するアート、ファッション、ライフスタイル、メディア…それぞれの領域を繋げながら、スペースデザイン、インスタレーションアート、テキスタイルデザイン、プロダクトデザイン、アートディレクションまで手がけています。
太めフォントやイラスト、レトロっぽい配色カラーパレットなどトレンド要素を詰め込んだウェブサイトで、ポップでフレンドリーな雰囲気づくりにぴったり。
文字を主体としながら、ブランドのポップさを配色とフォントの配置や大きさをつかい、見事に表現したポートフォリオサイト。シンプルですが効果的に、かつ確実にユーザーの視線を誘導できるテクニック。
超リアルなりんごがマウススクロールに合わせて、くるくると回転したり、八つ切りや真っ二つになったりしながら、コンテンツが進行していく体験型ウェブサイト。
きらりと輝く本物そっくりなダイヤモンドが、マウススクロールに合わせて形を変えながら、コンテンツ展開する、ストーリーテリング手法を用いたランディングページ。
立体的なアイソメトリック・イラストをサイト全体に利用した、親しみやすいデザインが素敵なサイト。
コンテンツの端など、「必要ではないけど、あったらうれしい」、そんなイラストが随所にちりばめられているので、探してみましょう。