新機能「アートボード」で編集サクサク!すごい無料UIコンポーネント素材まとめ

ios9-ui-kit-psd

 

今週Photoshop CCが、新しくメジャーアップデートされ、新しく機能が追加され、より使いやすくツールが強化されています。その中でも、特に目玉となっている機能が、これまでIllustratorでのみ可能だった、1つのドキュメントで複数のアウトアップを実現した「アートボード機能」です。

 

 

Artboards1

 

参考: アートボード | Photoshop ヘルプ

参考: アートボードでのデザイン | Adobe Photoshop CCチュートリアル

 

 

モバイルやタブレット、デスクトップなどデザインごとに、異なるレイアウトを配置できたり、モバイルアプリのUIコンポーネントをまとめて表示したりと、特にウェブデザイン制作を快適にしてくれるツールとなっています。

 

 

今回は、アートボード機能を利用することでより編集しやすくなった、無料ダウンロードできるUIコンポーネント素材をまとめてご紹介します。

 

 

 

詳細は以下から。

 

 

 

新機能「アートボード」で編集サクサク!すごい無料UIコンポーネント素材まとめ

 

iPhone 6 UI

iOS 8のインターフェース画面を参考にした、モバイル・アプリ向けレイアウトが揃います。レイアウトのデザイン方法を学ぶきっかけにも最適なアイテム。

iphone-6-ui-kit-psd

 

 

 

to-do App UI

パステルカラーの美しい配色を採用した、幅広いモバイルプロジェクト案件に対応してくれる、無料とは思えないほどの収録数が魅力的。Photoshop用PSDファイルと、Sketchファイルを同時に公開中。

to-do-app-psd-sketch

 

 

 

Ink

iOS 8のUIインターフェースをモチーフに、7つのカテゴリに120ページ以上のレイアウトが良いされたUIコンポーネントキット。今回は、デモバージョンを無料ダウンロードできます。

mini_signup_0-2000x1945-43668

 

 

 

Material Design Ui Kit

Googleのデザインガイドライン、マテリアル・デザインをモチーフにした、スマートフォン向けUIデザイン。本格的なドロップシャドウなど、エレガントな配色で統一されています。

Material-Design-UI-Kit-PSD

 

 

 

UI Kit for Marvel App

カテゴリごとにネオンカラーで色分けされた、カラフルなモバイル向けUIコンポーネントが揃います。Photoshop用PSDだけでなく、人気のSketchアプリ用ファイルも公開中。

UI-Kit-for-Marvel-App

 

 

 

Material-Design-mobile-UI-kit

 

 

 

Free PS Minimal Ui Kit

シンプルなフラットスタイルに、ネオンカラーの配色が印象的なUIデザインキット。

Free-Minimal-UI-Kit-PSD

 

 

 

Snug UI Kit

ブログメディアやマガジンサイトなどのレイアウトを作成するときに活用したい、オレンジ色がアクセントカラーになった、モダンでミニマルスタイルのUIキット。

SnugUI_Free_Sample-600

 

 

Azure Ui Kit

ミニマルなウェブサイト用レイアウトを、ドラッグ&ドロップで完成させることができる、編集作業をより手軽にしてくれるウィジェット、コンポーネントが揃います。

Azure-UI-Kit

 

 

 

Fashion Ave eCommerce UI Kit

女性向けファッション系オンラインショップを想定した、パステルカラーを基調としたエレガントでソフトな色使いが魅力的。

Fashion-Ave-Freebie

 

 

 

eShop UI Kit

オンラインショッピングサイトに必要なパーツ、ウィジェットをグリッド状に並べたUIコンポーネント。広告バナーやイメージスライダーなど豊富な種類にも注目です。

eShop-UI-Kit-S

 

 

 

Colorful Tiles Ui Kit

タイトル通りカラフルに表現された、タイル状デザインコンポーネントがたくさん収録されたUIキット。イメージ写真と文字の並べ方など、広告バナー作成にも活用できるアイテム。

colorful_tiles-600

 

 

 

Apple Watch UI Kit

まわりで使っているユーザーも増えはじめているApple Watchですが、採用されているインターフェース画面を、完全再現した無料UIキット。

apple-watch-ui-kit

 

 

Free Ui Kit

モバイルトデスクトップで統一されたスタイルを実現できる、余白スペースたっぷりに太字フォントが印象的なUIキット。

Nakropol

 

 

 

Free UI Kit by pillows

30種類に及ぶクリーンで、スッキリとしたレイアウトが特長のコンポーネントを揃えています。モバイルだけでなく、デスクトップデザインにも活用できるハイブリッドなアイテム。

free-bright-and-aesthetic-psd-and-ai-ui-kit

 

 

 

Everyday UI kit

どんなデザインにも合わせやすい青色を基調としたUIデザインが揃い、モバイルにも対応するレスポンシブデザイン。

Everyday-UI-Kit-PSD

 

 

 

Aves Ui Kit

グリッドレイアウトを活用して、各コンポーネントをタイル状に並べた、マテリアル・デザインやミニマルスタイルといった最近のトレンドを盛り込んだスタイルが素敵。

aves-ui

 

 

 

Hero Free UI Kit PSD

色鮮やかな注目を惹きやすい配色は、現在のミニマルスタイルを中心としたトレンドにもピッタリです。

Hero-Free-UI-Kit-PSD1

 

 

サムネイル@ : iOS 9 UI Kit – Artboards PSD by Brian Benitez – Dribbble

発表されたばかりのiOS 9のインターフェースを完全再現した素材で、なんとAdobeが公式で無料公開しています。各ページパネルは、CC 2015の新機能「アートボード」を利用して整理、カテゴリ分けされています。