Webデザインのレイアウトや配色の参考になるPhotoshop用の無料素材のまとめ

Webデザインのセンスをアップさせるには、一つひとつのUIを観察し、考えてからPhotoshopを起動し、作業をすること。最近のトレンドをうまく取り入れたレイアウトや配色・タイポグラフィの参考になるPSDがダウンロードできるUI素材を紹介します。

縦長ページ用のさまざまなコンポーネント、斜めやサークルや幾何学を使ったもの、Material Design、ミニマルなど、参考になるものばかりです。

EventRay UI Kit
(PSD)

イベントやアクティビティの情報を管理するさまざまなGUIエレメントが揃ったUIキット。情報の取得や通知をはじめ、コメントやフィードバックやシェア、管理や販売などユーザーのインタラクションを容易にするようデザインされています。

Awesome UI Kit for Free
(PSD, Sketch, Axure, Omnigraffle)

ヘッダ、フッタ、ギャラリー、打ち出し、フォームなど、よく使用するコンポーネントが30種類まとめられたUIキット。ダウンロードできるのはサンプル版ですが、個人商用利用無料でクライアントワークにも使ってください、とのことです。

Freebies PSD Flat UI kit
(PSD)

Bootstrapをベースにフラットなスタイルで実装するさまざまなエレメントを備えたUIキット。

Modern Website Design
(PSD)

モダンなカラースキームと斜めのカットが特徴的なレイアウト。半透明の使い方も非常に面白いです。PSDのダウンロードは要連絡。

Free Quadruple Ferial
(PSD)

かわいい幾何学のアクセントを取り入れたミニマルなMaterial DesignのUIキット。カラースキームも非常にかわいいです。

Zet Free One Page Template PSD
(PSD)

各コンポーネントに共通のデザインテイストを使うことで統一感を出した縦長ページ用のテンプレート素材。

Unity UI Kit
(PSD)

落ち着いたパステルカラーがかわいいイラストを使ったUIキット。バナナとかう○このアイコンがかわいいｗ

55+ Elements FREE UI KIT
(PSD)

ブラック・ホワイト・グレーをベースにミニマルにデザインされたUIキット。画像やタイポグラフィが非常に映えますね。

Designer Naut UI Kit
(PSD)

かわいくデザインされた40のウィジェットと100以上のエレメントを備えたUIキット。落ち着いたカラースキームとアクセントカラーが効果的です。

Free PSD. Accessories Template
(PSD)

プロダクトをカード型レイアウトやスライダーにレイアウトしたPSDのテンプレート素材。

FREE Landing Website
(PSD, HTML)

ミニマルにデザインされたポートフォリオ用のテンプレート。レスポンシブ対応でHTMLもそのまま利用できます。

Gumballz Web UI Kit
(PSD)

ベクトルの図形とスマートオブジェクトだけを使って制作されたUIキット。春らしいパステルのカラースキームもかわいいです。