読者です 読者をやめる 読者になる 読者になる

not simple

デザインと言葉の実験です

Sunnychatの色について色々

f:id:ottiee:20160808103811p:plain

Sunnychatというアプリを2016/8/1にリリースしました。

このサービスにはデザイナーとして関わっていますので、少し色の話をしたいと思います。

Sunnychatは冒頭の画像のような色相が多めな微妙なグラデーションをキービジュアルとしているのですが、この配色に至るまで思考の可視化をするという遊びです。3軸ほどあって、

  • 他のSNSとの差別化を考える
  • Sunnyという語感から考える
  • 多色相のグラデーションきてるんじゃ無いか説

です。

他のSNSとの差別化を考える

f:id:ottiee:20160808104958p:plain

僕はモノの色を決める時には、まず使わない色を決めてしまうことが多いのですが、その時のそれです。(AmigoというのはSunnychatの前身にあたるサービスです)

FacebookTwitterで使われている青系、LINEやApple純正のメッセージアプリのような緑系、また特定の性別を感じさせる色を避けたいという気持ちが伺えます。気持ちの問題です。

ただ、そういうアプリのメンタルモデル(一般の人がこういうアプリってこういう色だよね、みたいに思ってる前提みたいなもの)を利用するというのも手なので、この段階ではまだざっくりこんな感じ、というあたりをつけていたくらいです。

Sunnyという語感から考える

Sunnyという言葉は「日のよくさす、日が照る、日当たりのよい、太陽の(ような)、雲ひとつない、晴れ渡った、陽気な、快活な」という意味があるそうです。

Sunnychatはコンセプトとして「ハッピーなコミュニケーション」というものがあるので、カラーもそこに寄り添い、明るく陽が照っているようなビジュアルにしようと考えました。考えていたと思う。

多色相のグラデーションきてるんじゃ無いか説

ちょうどビジュアルを考えていた前後、Instagramがリニューアルしました。

Instagramのデザインがリニューアルされて使いやすくなった! - ソーシャルメディアでの集客発信をサポートする 下澤美香

かなり印象的なアイコンでファーストリリースからほとんどデザインを変更してきていなかったので、大胆なリニューアルでかなり驚きました。

「そういえばApple純正のアイコンのような単調ですこし暗めのグラデーションではなく、高い彩度を保ちながら色相を変化させてくるビジュアルスマートフォンアプリデザインではちらほら見るようになったなー」と思っていた頃でした。

と、思っていたらPokemon Goも印象的なグラデーションを採用してきましたよ。

ibn-shahr.hatenablog.com

Sunnychatとの類似を指摘されていた方がいらっしゃったので引用させていただきました。

こういう流行りはだいたいなぜか同時期に各所で発生するもの(別に真似してるわけではなく)なので、初めてPokemon Go見たときは、「かぶった!」というより「やっぱりな...」という感覚を覚えました。

僕は世界中のUIデザイナーがフラットデザインの流れによる単調な色使いに飽きてきたんじゃないかと勝手に推測しています。

思考を統合する

以上を統合して、結果「他のSNSとかぶらないようにしつつ、緑系と青系のメンタルモデルを借用しつつ、陽が差しているように明るく、彩度の高いグラデーションで作る」というわけのわからない方向性が自分の中で定まりました(定まってない)。

f:id:ottiee:20160808112257p:plain

緑と水色の中間ぐらいの色をベースに、黄緑や濃いめの青へのグラデーションを重ね、最後に陽が差しているような表現として、黄色系のグラデーションを入れます。あとはスタンプなどで印象を補強して、

f:id:ottiee:20160808112544p:plain

完成です。最高にハッピー。

まとめとおまけ

と、まあ色々と書きましたが、作ってるときはけっこう感覚でやっちゃってる部分も多いので、ロジックで語れる部分は後付けといえば後付けなんですが、多分なんか考えながら作ってたんだと思います。たぶん。

デザイナー向けおまけ

グラデーションって言葉がゲシュタルト崩壊するくらいグラーデーショングラデーション言ってますが、グラデーションの機能は一切使わずに作ってたりします。

f:id:ottiee:20160808114528p:plain

ぼかし+オーバーレイでなんかごにょごにょしています。デザイナーならわかりますね。