エキサイト公式　エンジニアブログ

こんにちは！デザイナーのにーのです。
先日翻訳のアプリアイコンを作り直す機会があったので、そちらの紹介も交えて、普段デザイナーが、どんなフローでデザインしているかをご紹介します。

アイディアの手法

ビジュアルのアイディア出しには、様々な手法があります。
普段、私が参考にしているものがこちら。

1. デザインパーソナリティ
   詳細のペルソナを決め、使用シーンや感情から発想を広げていく
2. ワードインプレッション
   水平連想したものを垂直連想に切替、そのなかからランダムにキーワードをとっていく。円を書くように並べその中心をイメージしてデザインを考える
3. イメージスクラップ
   イメージしているものの材料を集める。写真やイラストレーション。できるだけ全体でみること。キーワードや手書きのラフなんかも加えてボードに貼っていくとイメージしやすい
4. カラーイマジネーション
   言葉を一度色に置き換えて、それから形に置き換える（一色ずつやること）
5. エブリシングトライ
   意味が離れているものを切り口に。周りにあるものから強引に表現しようとしてみる。

私はだいたい、２→３→1の順番でやっていることが多いです。
どんな風に実践しているのか下記に記します。

問題提起と解決法の検討

例えば今回の案件についてのオーダーは「競合が増えてきたことで、似たようなイメージになりやすく差別化を図りたい」とのことでした。
特に差別化で意識した要素は下記2点です。

• 文字の分割方法
• 力強いイメージのものが多いので、そこを少し和らげる

その１　ワードインプレッション

まずは「翻訳」というワードを中心に、そこから連想していきます。
翻訳と言ったら英語…英語といったら世界…みたいな。マジカルバナナですね
そんな感じでいくつかのワードを取り出していきます。
このワードがビジュアルのキーになったりします。

今回は「翻訳」から以下のようなワードが導き出されました。

• 地球
• つながり
• 対になるもの
• 裏表のもの
• 通じる
• ことば
• 変化
• 同じもの
• 架け橋

上記の言葉からビジュアルに落とし込んでいきます。

その２　イメージスクラップ

この段階でイメージスクラップを作ります。
作るといっても、Pinterestでピンを立てたり画像イメージをアートボードに貼り付けていくといった簡単な作業です。
例えばつながりの場合は、握手しているイメージとか、何かがくっついている状態とかそんなイメージのものが集まっていきます。
あとはそのアイディアをひたすら書く…。
書く…！
一番はじめのラフなのでだいぶ汚いですね、いい感じのものは何度も書き直していきます。

その３　デザインパーソナリティと検証

もうネタ切れじゃというところまで書いた段階で、検証に入っていきます。
このロゴはどんな印象を与えるか？どんなフォントで表せれるか？…などなど。
取捨選択するときに重要になっていくものが、先ほどの問題を解決しているのか？ということ。
そしてもう一つ、「デザインパーソナリティ」です。

ここでペルソナがあると物差しができるのでわかりやすいですね。

今回の場合、リニューアルではなくあくまでも“今のイメージのままのアップデート”という要望でしたので、あまり大きな変化はつけられません。
特に文字ベースのロゴを、イラストベースのものにするのはイメージが変わり過ぎてしまう。
ということで明朝体の文字ベースでデザインをしているものを選択していきます。

そんなわけで上記を繰り返し３案作ってみました。キーカラーは一色決まっているのでその色をベースにしています。
プロデューサーに確認をしてもらったところ、グラデーションのパターンがもっと見たいと言われました。
さらにブラッシュアップしていきます。

その４　ブラッシュアップ

この3つの案をグラデーションにした際に、平面が多い方が綺麗に見えるので一度案を考えなおします。
円の中に文字のパターンだと、小さくなったときに読みずらい、というダメ出しもあり…。
それぞれのデザインでのメリットとデメリットを比較していきます。
やはり既存の斜めカットからあまり離れない方が良いとのことだったので、真横・縦・斜め…いろいろなカットを検証しました。

結果、「A」の右側のラインに沿って分割するのが、一番文字が見やすく、わかりやすいという結論に辿り着きました。
この分割方法だと「A」と「あ」の接地面も綺麗に分けることができますね。
最後にカラーバリエーションのパターンを作って再度検討。ペルソナユーザーの好みなどを考慮し、右上のロゴでfixすることができました！

まとめ

• 出来上がったデザインは問題を解決しているか？
• デザインのメリットとデメリットは何か？
• このデザインはユーザーが好むか？またそれはなぜか？

この辺りをうまく説明することができて、要件を満たしていれば良いデザインと言えるのではないでしょうか。
デザイン発注時は、プロデューサー自体が仕上がりを明確にイメージしていないことも多いので、はじめの案出しではだいたい3案くらい違うベクトルのものを作って、どの方向性に行きたいのか様子を見てたりします。
そこから要件定義を再度お伺いして、調整して仕上げていきます。
こうすると割と出戻りがなくスムーズに作れるんじゃあないかと。
でもやはり形にすることってすごく難しいですね…。できたところからがスタートです。

結構いろいろなことを考えながら作っているので、デザイナーがあげてきたものについては、「なぜ？」を聞いてもらえると嬉しかったりします。
色々な人から意見をもらうことで、より良いものが出来ていきます。
是非つっこんで聞いてみてください！

デザイナー＆エンジニア募集中！

エキサイトでは新卒・中途問わず一緒に働いていただけるデザイナー＆エンジニアを募集しています。
こちらの採用情報ページから是非ご応募ください！