Webデザインで困ったら見たい最新ホームページ事例40選 (original) (raw)

毎日新しいWebデザインを手掛けていれば、レイアウトや構成が思い浮かばないことがあっても当然です。

そんなときは新しく公開された、話題になっている国内外のホームページを覗いて、次のデザインアイデアやヒントを手に入れましょう。

この記事では、ここ2か月くらいで公開されたデザインが際立つ最新ホームページ事例40個をまとめてご紹介します。

どのようにUIデザインテクニックを活用するのか分かる、目からウロコの事例を中心に集めています。

Webデザイン見本リスト

こがしバターケーキ

スクロールで袋に入ったこがしバターケーキが下へと移動するようなエフェクトは、その手があったかと思わせるユニークさ。使用されているキアロフォントもブランドイメージにぴったり。

デニム祭 | 45R

わっしょい、わっしょい! 45Rのデニム祭があなたの街にやってきます!この夏一新した45Rのデニムを従え、祭り野郎たちが瓦版を配りながら全国行脚します。

モスの月見|モスバーガー公式サイト

スマホ閲覧に特化したレイアウトで、デスクトップ版ではメニューを配置し、アンカーリンクとして利用できる工夫が。お月見の背景画像の使い方も秀悦です。

Dole(ドールジャパン)

ブランドカラーで統一された縦型ナビメニューを採用。Bentoグリッドや水平スクロール型コンテンツなど、トレンドもしっかり押さえたつくりに。

【公式】那須別邸 回

スクロール追従による心地よいコンテンツ展開に加え、日本語と英語の配置バランスが絶妙。日本らしいおもてなしを感じるホテルサイトで、海外でも話題となっていました。

UNOXUNO

カーソルを動かすと、まるで万華鏡のように左右対称の動画がループ再生されるギミックは圧巻。コロンビア、メデジンにあるエージェント会社。

Webisoft

コンテンツがレイヤー状に重なって見える固定テクニックを活用した、心地よいスクロール体験を味わうことができます。

前回からおよそ2か月ぶりとなった今回のまとめ。

このリストをつかって、最新のホームページデザインやWeb技術に触れてみましょう。「イメージやアイデアはあるけど、何をどのように作ればいいか分からない」といったときにもきっと役立ちます。

Adobe Stock

アドビだからストック素材サービスも ここまでクリエイティブ。

Adobe Stockは、アドビがクリエイターのためにつくったストックサービスです。写真やイラストなど高品質な素材が約3億点。無料素材も100万点。
検索、プレビュー、ライセンスの取得をPhotoshopから直接できるので効率の良さが抜群。
たくさんのAdobe Creative Cloudユーザーに選ばれているのには理由があります。

最初のひと月は素材が10点まで無料なので、気軽に始めてみませんか。

Adobe Stockをもっと詳しく

Adobe Stockを無料で始める