Help us understand the problem. What is going on with this article?

アプリのUIデザインと配色パターンまとめ(非デザイナー向け)

More than 3 years have passed since last update.

はじめに

私は主にiOSアプリのプログラマーなのですが、デザインまで一緒に頼まれる事があります。
デザイナーじゃないので1からデザインをしていくなんて到底無理です。
そんな時にノンデザイナーの方でも良い物を作るために
UIデザインのギャラリーサイトと配色パターンを決める便利なサイトをご紹介致します。
基本他のアプリを真似参考にするといい感じにできちゃうかもしれません。
Web系開発の方も配色パターン等は参考になると思います。

デザインをする前に

デザインをする前に呼んでおいたほうがいい物
- ITエンジニアに易しいUI/UXデザイン
- デザイナーに言われた「非デザイナーが気をつけるべきデザインの4原則」
- ノンデザイナーのための配色理論

アプリデザイン

CAPPTIVATE.co

動きのあるカッコいいUIばっかり載っています。
種類別で見ることもできるので便利ですね。

Mobile Design Inspiration

こちらも動きのある超カッコいいUIが揃っています。

APP DESIGN

様々なアプリデザインが載っています。
アプリによってUIアニメーションを確認できます。

MOBILE MOZAIC

左のメニューから種類別でUIを検索できるので
ピンポイントのこの機能のデザインを見たいって時に便利です。

Inspired UI

こちらもカテゴリから種類別でUIを検索できます。
iPhone、iPad、Androidで分けて見ることができます。

pttrns

こちらも種類別にUIを検索できます。
iOS、Android共に豊富でAppleWatchのUIも載っています。

MOBILE PATTERNS

こちらも種類別にUIを検索できます。
種類も豊富です。

AppreciateUI

こちらも種類別にUIを検索できます。
アイコンのデザインを見る事ができます。
少し古いUIが多い?

配色パターン

Adobe Color CC

カラーコード等から配色パターンを自動生成してくれます。
配色パターンも6種類ぐらいから選べて便利です。

写真をアップしてその写真から配色パターンを生成する事もできます。

ColorHexa

カラーコードから関係する様々な色を表示してくれます。

Paletton

色を選択すると、配色パターンを自動生成してくれます。
配色の数も1色、2色、3色、4色と設定でき、
生成した配色パターンで実際にWebページのサンプルを表示する事ができます。

Paletta

色を選択すると、調和の取れた色がカラーパレットとして表示されます。

NIPPON COLORS

日本の伝統色が250種類も載っています。
和テイストのアプリ作成時に参考になると思います。

参考にしたサイト

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした