Web制作の参考になるデザインや技術のアイデアがいっぱい!クリエイターの素晴らしいポートフォリオのまとめ

最近のポートフォリオは、デザイン的にも技術的にもどんどん進化しています。JavaScriptのアプリ、WordPress、スタティックなど、さまざまなプラットフォームでデザイン・構築されたポートフォリオサイトを紹介します。

サイトのキャプチャ

20 BEST NEW PORTFOLIOS, JUNE 2018

下記は各ポイントを意訳したものです。
※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。

サイトのキャプチャ

Bruno Ferdinand
プラットフォーム: JS app

フランスのアートディレクターのポートフォリオで、シンプルで美しいデザインです。ページ遷移も非常に面白く、水平の遷移と垂直スクロールが他には見かけない工夫がされています。動画やアニメーション、スティッキーコンテンツ、そして文字通りの無限スクロールなど、面白いアイデアがいっぱいです。

サイトのキャプチャ

Yumpic
プラットフォーム: WordPress

食べ物の写真や動画を紹介しているポートフォリオで、Sempliceのテーマファイルが使用されています。ブルーとイエローのカラースキームが特徴的ですが、写真と動画の合間にあるイラストも非常に魅力的にデザインされています。

サイトのキャプチャ

Duane Dalton
プラットフォーム: Static Site

一見、左右均等に分割されたレイアウトのように見えますが、左右非対称にレイアウトされた面白いデザインです。視線を大きく移動させることなく、作品を楽しめるので、こういったレイアウトも有りですね。

サイトのキャプチャ

Kenta Toshikura
プラットフォーム: Static Site

日本人のフロントエンド制作者のポートフォリオ。ミニマルなプレゼンテーションスタイルのデザインで、使いやすさよりも、ビジュアルとスタイルに重点が置かれているように見えます。右上の「All」には、かっこいい3Dのメニューが隠されています。

サイトのキャプチャ

Ellen Mandemaker
プラットフォーム: Static Site

アート系のポートフォリオで、その見せ方に大きな特徴があります。クリエイティブなコラージュから、シンプルなポートフォリオまで、その作品をさまざまな角度から見ることができます。何を見ているのか完全には分からないけど、それが好きだと思わせるポートフォリオの一つです。

サイトのキャプチャ

No Plans
プラットフォーム: WordPress

WordPressで構築された縦長ページのポートフォリオで、クリーンなデザインと美しいタイポグラフィが特徴で、かなりシンプルです。

サイトのキャプチャ

Lab101
プラットフォーム: WordPress

カーソルを変えるサイトは好きではありませんが、このサイトは別です。ミニマルでモダンなデザインにあったカーソルは、サイトの雰囲気を演出しています。カーソルを見失うこともないでしょう。contactの3Dアニメーションも記憶に残るデザインです。

サイトのキャプチャ

Studio Bjørk
プラットフォーム: Static Site

ストックホルムのデザイン会社のポートフォリオで、モノクロのカラーパレット、対角線、水平スクロールがうまく機能しているデザインです。ダイナミックなインタラクションと繊細なディテールのバランスが素晴らしいサイトです。

サイトのキャプチャ

Juul Hondius
プラットフォーム: Static Site

雑誌スタイルのサイトはいくつもありますが、このポートフォリオは最近見た興味深いサイトの1つです。美しい印象的な写真と一緒に文字がわずかなスペースにレイアウトされており、古い雑誌のように見えます。技術的には問題かもしれませんが、全体としてのデザインは良い印象を与えます。写真家のサイトで、テキストも読ませたい場合、あなたはどうしますか?

サイトのキャプチャ

Thu-Van Tran
プラットフォーム: Static Site

このポートフォリオは、視覚的に非常に興味深いデザインになっています。すべてのページは1枚の紙が重なるように遷移し、レイアウトのシンプルさとタイポグラフィのパワフルさと相まって、際立っています。

サイトのキャプチャ

Aristide Benoist
プラットフォーム: Static Site

ワーピングアニメーションを使った非常に面白いデザインで、大きく使われたタイポグラフィと視覚的な効果を演出しています。ワーピングは画像や背景にも使用されており、不思議な世界観を楽しめます。

サイトのキャプチャ

Datagif
プラットフォーム: Static Site (おそらく)

サンセリフの書体が使用されたデザインで、一見平凡なレイアウトに見えますが、アニメーションが楽しませてくれます。遊び心を少し加えたい時の参考になるかもしれません。

サイトのキャプチャ

Handsome
プラットフォーム: Static Site

大きなセリフの書体、背景としての暗い写真、ほとんど目に見えない繊細な直線、フラットなデザインの初期によく見かけたスタイルです。ノスタルジックなものが完全に再現されており、閲覧していると楽しくなります。

サイトのキャプチャ

Sister
プラットフォーム: WordPress

ミニマリズムとアシンメトリーのデザインスタイルは、こういった代理店のポートフォリオにも適しています。無限スクロールが採用されており、通常のいつ次に遷移するのか分からない方法ではなく、この方法は分かりやすく遷移します。時々表示されるモーダルのポップアップは好きではありません。

サイトのキャプチャ

Makers and Allies
プラットフォーム: WordPress

デザイン会社のポートフォリオで、多くのモーションデザインがミックスされて楽しませてくれるサイトです。デザイン的な美しさと最新のテクニックが絶妙なバランスで採用されています。テキストと背景のコントラストはぎりぎりにデザインされており、もっとコントラストをつけてもうまく機能するでしょう。

サイトのキャプチャ

Bipolar Studio
プラットフォーム: Static Site and/or JS App

モダンで美しいモーショングラフィックと昔ながらの大きいタイポグラフィを組み合わせたデザインです。動画がメインですが、注目すべきデザイン要素もたくさんあります。各プロジェクトページの一番下にあるデータは、そのプロジェクトを完了するのに必要なことが詳しく説明されています。ロゴには細字が使用されているので、もっと大きくてもよいかもしれません。

サイトのキャプチャ

Akins Parker
プラットフォーム: Static Site

代理店のポートフォリオで、Powerpointで作成されたものではありませんが、純粋な形のプレゼンテーションデザインです。グラフィックを見せるためのデザインで、使いやすさのためではありません。

サイトのキャプチャ

Ian Jones
プラットフォーム: Static Site

背景に視覚的なグリッドが使用された、シンプルなデザインのポートフォリオです。他の多くのサイトとは異なり、グリッドのビジュアル表現は、作品がページ上にあるときにのみ見えます。シンプルなアプローチですが、クールでプロフェッショナルなように見えます。

サイトのキャプチャ

Michael Uloth
プラットフォーム: Static Site and/or JS App

オペラ歌手兼、Web制作者の本当にまれな才能をもった人物のポートフォリオです。芸術的な人々のためのミニマルで美しいサイトがデザインされています。

サイトのキャプチャ

Lasse Fløde
プラットフォーム: Static Site

最後は、1ページの驚くべきポートフォリオを持つ写真スタジオです。写真を使ったポートフォリオの最近のトレンドは、非対称のコラージュスタイルを採用しているので、スペースを大切にしている人たちは間違いなくこのデザインを楽しむはずです。非常にシンプルで、効果的です。。

sponsors

top of page

©2018 coliss