UIデザイナーとして、参考になるデザインサイト10選

在宅ワークが注目されWEBやデザイン業界を目指している方が増えてきているかと思います。WEBサイトデザインやLPサイトに掲載するための素材の加工など、さまざまな商品やサービスのデザインする際に、参考資料を探して困っているのではないでしょうか。例えば・・・。

★現在デザインの勉強をしている初心者デザイナー

・レイアウトをどうしたら見やすくなるのか。
・色の組み合わせはどうしたらいいのか。
・デザインの勉強するのにいいサイトを探しています。

★現役デザイナーでスキルアップをしたい現役デザイナー

・時代に合わせたデザインを研究したい。
・今まで取り扱ったことがないジャンプルに挑戦したい。
・よりデザイン性の優れたサイトを見つけたい。
・コンテンツとして効果的な手法を身につけたい。

★グローバルデザインの研究

・ローカル情報ばかりので、海外のデザイン情報も知りたい。
・より革新的なデザインの情報を見つけたい
　
等。今回は、日本や海外の優れたデザイン構想・参考となる記事やコンテンツを網羅したおススメサイトを、UX/UIデザイナーとして日々業務を行っている上で参考になったサイトを厳選して紹介していきます。

<

div id=”デザインサイト10選”>

＜URL＞

Canva

＜おすすめポイント＞

Canvaは主に画像エディタであり、パレット生成器、フォント選択ツール、写真コラージュ、メッセージチャート作成ツールとして利用できます。プロジェクトごとに数百のデザイン要素を提供していますCanvaはオンライン教育カリキュラムも提供しているためデザインの学習として非常におススメです。
初心者デザイナー向け：★★★★☆
経験デザイナー向け：★★★☆☆

＜特に参考になった記事＞

Free Online Photography Courses You Can Take During the COVID-19 Quarantine
デザイン分野においても、撮影は不可欠な重要なカリキュラムであり、撮影過程における撮影角度の分析は、デザイン分野におけるレイアウトの手配に役立てます。この記事には様々な食べ物を撮影するためのレッスンがありますが、興味のあるデザイナーにとっては良い機会です。

＜URL＞

vector-creator

＜おすすめポイント＞

イラストを好みで組み合わせて、オリジナルベクターイラストを作成できるオンラインツールです。完成したイラストのダウンロードも可能で、ジャンル別に探すこともできます。サイト内には写真やイラスト、著作権のある音楽などのダウンロードできる素材もたくさんあります。サイト内に掲載するコンテンツツールとしても開発者向けのアイコン、写真、音楽などのAPIも提供されています。
初心者デザイナー向け：★★★★☆
経験デザイナー向け：★★☆☆☆

＜特に参考になった記事＞

UI Inspiration: Web and Mobile Design Concepts with Moose Photos
文字解釈の代わりに多くの優れたデザイン作品を取り扱うことで、デザイナーがより直観的に学習と参考を行うことができます。文章の中で多くのUIデザイナーの優秀な作品を展示して、大量のインスピレーションを提供することができます。

＜URL＞

Photoshop Vip

＜おすすめポイント＞

参考デザインの内容も豊富で、基本的なデザイン知識から様々な色標の推薦やフォントデザインまで含んでいます。さらに無料のデザイン素材が含まれているため、WEBページ制作関連の情報やリソースシェア(htmlテンプレート、wordpressテーマとしてのおススメ等)、Photoshopやデザインツール関連のチュートリアルなどの情報が多数提供されています。また、ユーザーにインスピレーションを与えることができる優秀な作品も展示されているため、初心者から現役の方まで非常に参考になるサイトです。
初心者デザイナー向け：★★★★★
経験デザイナー向け：★★★★☆

＜特に参考になった記事＞

Photoshop文字加工を極める！テキストエフェクト用チュートリアル186個まとめ【保存版】
様々な優れた書体デザインが網羅されており、デザイナーに大胆なアイディアを提供しています。テキストデザインはコンテンツにおいて非常に大事なファクターです。

＜URL＞

Design-milk

＜おすすめポイント＞

デザイン業界に焦点をあてた最新デザインを学ぶことができます。「アート・建築・インテリア家具やデザイン・ファッション」等、様々な技術に精通した豊富なコンテンツを取りそろえています。「デザインミルクショップ」は世界のデザイナーとブランドが創造した一連の驚くべき新製品を展示しています。日々デザインとして新しい情報を収集したいスキルアップ思考のデザイナーの方にお勧めです。

初心者デザイナー向け：★★☆☆☆
経験デザイナー向け：★★★★☆

＜特に参考になった記事＞

Where I Work: Stéphanie Marin of smarin
デザイナーが自分の仕事環境を紹介することで、より多くの人にデザイナーの背景を理解させることができます。

＜URL＞

Goodpatch

＜おすすめポイント＞

設計に関するレポートや記事を豊富に取り扱っています。その中には、「UXデザイン・UIデザイン・情報設計」等UIデザイナー向けだけでなく、エンジニア向けの情報もカバーできているのが特徴的です。UIだけではなく、情報設計やできるデザイナーとして学習する方にお勧めできます。

初心者デザイナー向け：★★★★☆
経験デザイナー向け：★★★★☆

＜特に参考になった記事＞

UIデザイナーに聞いた！Appをいつもの100倍面白くみる観点
UIデザイナーとしてアプリケーションのUI設計を様々な立場の方からみた考え方を発見することができます。デザイナーの経験や考え方は様々な為、多角的にUIデザインを考える参考になります。

＜URL＞

Responsive-jp

＜おすすめポイント＞

日本国内の優秀なWEBのレスポンシブデザインを集めたサイトです。そこにWEBページサイズからタブレットサイズ、携帯電話サイズまでを明確にわかりやすくされています。また、WEBサイトのレスポンシブに関するデザイン書が推薦されており、特に設計者にとっては非常に参考になる記事や情報が公開されています。
初心者デザイナー向け：★★★★★
経験デザイナー向け：★★★★☆

＜特に参考になった記事＞

米国帰りのWEBデザイナーが不安になる日本と米国の違い
国際的な視点から、米国と日本のデザインの相違点の分析。デザイナーにとって、グローバルデザインとローカルデザインで異なる考え方のプロセスが非常に勉強になる記事です。

＜URL＞

Awwwards

＜おすすめポイント＞

世界中からより最高の品質のデザインコンテンツを集めています。彼らはアートとWEBデザインの境界を絶えず推し進めています。専門家によるレビュー体制も設けられているので、すべての作品は厳格な審査を経て、作品の質が確保されています。知見や刺激を受けたいデザイナー様にはお勧めです。

初心者デザイナー向け：★★★☆☆
経験デザイナー向け：★★★★★

＜特に参考になった記事＞

A Round-up of The Best Loading Animations
本記事では、優れたLoding画面を収集し、どのようにLoading画面を作成したらよいか困っているデザイナーへの活路を提案している記事となります。現役のWEBデザイナーの方には必見です。

＜URL＞

Abduzeedo

＜おすすめポイント＞

幅広い設計デザイン領域をカバーし、「平面・ブランド・建築」までコンテンツ幅が非常に豊富で、ユーザーにとって豊富な設計に関する知識やインスピレーションを提供してくれます。
初心者デザイナー向け：★★★☆☆☆
経験デザイナー向け：★★★★★

＜特に参考になった記事＞

Ki Colorful Branding and Visual Identity
Abduzeedoの創業者でありプロダクトデザイナーが提案するデザインは、キーワードと商品をよりカラフルなデザインとして提案するビジュアルデザインを紹介しています。この記事では彼の優れた作品を展示しています。

＜URL＞

Human Interface Guidelines

＜おすすめポイント＞

「Human Interface Guidelines」は,アプリケーション開発者にアドバイスのツールを提供するソフト開発ドキュメントです。彼らの目標は、アプリUIをより直感的に、学びやすく、一致させることによって、ユーザーの体験を改善することです。使用するアプリケーションや他のツールを含む環境(通常は操作システムやデスクトップ環境)にわたる一貫した体験を作成することです。簡単なボタンとアイコンから、ダイアログボックスのようなより複雑な構造に至るまで。ガイドラインは具体的な政策を列挙しています。
初心者デザイナー向け：★★★☆☆
経験デザイナー向け：★★★★★

＜特に参考になった記事＞

Designed for iPad
タブレットの発展に伴い、日常においてタブレットpcは重要なツールの一つとなります。デザイナーがページデザインを行う際には、タブレットサイズのデザインを見落とすことが多いです。このビデオでは、iPadを用いたデザインの詳細について、タブレットにデザインを与える際に注意すべき事項と基本的なデザイン知識を紹介しました。

＜URL＞

Material design

＜おすすめポイント＞

Googleが開発したデザインシステムで、「Android・iOS・Flutter・web」の高品質なデジタル体験を支援します。サイトには、基礎的な設計資料、「環境・レイアウト・ナビゲーション・色・フォント・アイコン・インタラクション」などの様々な知識が含まれている。webページのUIデザインに関する「アップバー・ボタン・リスト・メニュー」等の詳細についても解説されています。
初心者デザイナー向け：★★★★☆
経験デザイナー向け：★★★★★

＜特に参考になった記事＞

Understanding the Material Design color system | Google Design Video Tutorials
この文章は色に困っているデザイナーに向いており、ブランドデザインで配色をどう使うかを学ぶことができます。

今回のおすすめサイト国内だけでなく海外サイトも含まれております。どのサイトもデザイン知識が豊富で、優れた作品や文章を数多くのデザイナーが提供しています。また、これらのサイトには大量の素材やリソース、あるいはオンラインデザインツールがあり、デザイナーにとって便利なツールを提供しています。一部のサイトでは質の高い教育や講座活働を提供しているため非常に参考になります。

私もUIデザイナーとして、クライアントとの打ち合わせや依頼があった場合に多くのデザインテンプレートや記事からインスピレーションを取得するために利用しています。特にデザインには数字のような正解がなく最適なデザインを導くためには情報収集は欠かせない要素となります。

特に初心者のデザイナーにとっては、身近なすべてがインスピレーションの源になります。参考となるデザインを探す場合には既存の専門分野だけでなく、さまざまな角度からデザイン手法を学ぶことをおすすめします。また、優れたデザイナーは単にデザインの美しさだけではなく、ユーザーのニーズを満たすことができるシステムデザインを意識することが必要です。デザイナーとして、美感の追求ばかりではなくユーザのニーズを発見することも非常に重要です。