【シリーズ】新サービスリリースまでにやったことの記録 - [第4回] アプリケーションの配色に関して -
はじめに
先日は、第3回の記事を読んでいただきありがとうございました！
今回は、アプリケーションの配色に関して直近動いていたので、その件に関して書きたいと思います！
よろしくお願いします！
今回配色を決めるにあたって大事にすること
まず、今回配色を決めるにあたって大事にすることというのを少し明確にしようと考えました
私が大事にしたいと思ったことは、他のサービスと極力配色が被らないような色合いにしたいと考えました
例えば、メルカリ：赤色＋水色、食べログ：オレンジ + 白 など（※敬称略にさせて頂きました。すみません。。。）
理由としては、既にある配色と被せてしまうと、どうしても印象が薄くなりやすかったり、覚えづらくなったりする可能性も多少なり出てくると思いますので、できればあまり見かけた事の無い配色にして、あの色といえば、○○サービスだよねと認知してもらいたいと考えました
※反対に、あのサービスと似た色のあのサービスという形で認知して頂ける可能性もあると思いますが、今回はその選択はしない方針としました
配色の意思決定をするまでに調べた事
そもそも配色の決め方というのが分かっていないので、まずは基本的な考え方を調べるところからはじめました
いくつかサイトを見比べましたが、私はこちらのサイトが良くまとまっていてわかりやすかったので、参考にさせて頂きました
メイン・サブの2色で、サイトのベースの色を考えるという概念は理解をしておりましたが、配色ルールとして「ダイアード配色」、「アナロガス配色」、「トライアド配色」などのルールがあることを初めて知り、このあたりの考え方がとても参考となりました。
※上記に挙げた3つ以外でも配色のルールはいくつかあるようなので、気になる方は、他にも色々と調べてみてください
配色の決定
ここからは実際に配色をどのように決めたかという方法に関して軽く触れていきます
配色決定の流れですが、以下の通りです
①上記の配色サイトに掲載されていた配色ツール「カラーピッカー」を利用させて頂き、色の組み合わせをランダムで抽出
②①で良いと思った組み合わせを、私がUIの検討をしているツールの方に実際に反映をさせてみる
③良し悪しを判断し、ピンとこなかった場合は、①から再度実施
愚直に何パターンも試しては変え、試しては変えという流れで、私のサービスでの配色を決定しました
おわりに
今回は配色に関して、考えた事・実際にやったことをまとめてみました
正直あまり慣れていないこともあって、決めるのに時間がかかってしまったのですが、普段やらないことに触れることができて個人的には非常に楽しかったです！
今回の記事に関して、デザインのプロの方からは、まだ考える事は沢山あるよというご意見などもあると思いますが、私は素人なので、その辺りはご容赦頂けると有難いです！
最後に、今回ご紹介させて頂いたサイトの運用者様に向けてですが、分かりやすい記事を作成頂きありがとうございました！
大変参考になりました！
次回の記事で書くことはまだ決まっていないので、来週木曜日楽しみにお待ちください！
ではでは！
この記事が気に入ったらサポートをしてみませんか？