1. まとめトップ

【デザイン】 Androidアプリアイコンのデザイン過程晒してみた 【QR Scanner】

簡単に使える!かわいい!AndroidのQRコードリーダーアプリ「QR Scanner」のアイコンを作った時の過程を晒しました。

更新日: 2012年12月18日

chocolatinaさん

  • このまとめをはてなブックマークに追加
12 お気に入り 6019 view
お気に入り追加

アプリアイコンデザインが気になる方はこちら ↓

paperboy&co. デザイナー 小山田 @chocolatina です。先週、みんなで作ったAndroidアプリ「QR Scanner」がリリースされたので、アイコンを作った過程をつぶやきます!#PPB_design tinyurl.com/b5shq8u

今日リリースしたアプリでは、お店や街中でQRコードをすぐに簡単に読み取ることができます。ダウンロードはこちら!#PPB_design tinyurl.com/b5shq8u

【アイコン作成の目的】散らかったホーム画面でも、QRコードリーダーであるのが一瞬で分かるようにする。自分のスマホの画面に置いておきたくなるようなやつで、ユーティリティ系アプリなので、かっこいい系で。 #PPB_design tinyurl.com/b5shq8u

【アイコンに使いたいモチーフ】QRコードの画像、もしくは「QR」の文字。あとは‥虫眼鏡? #PPB_design tinyurl.com/b5shq8u

【そもそも人は何を見て「QRコード」だと認識するのか】アイコンは小さい画像なので、可能な限りQRコードをディフォルメしたい。人は何を見て「QRコード」だと認識するのか考える。#PPB_design tinyurl.com/b5shq8u

【黒いと可愛くない】色々な色を合わせてみたらどうだろう?と思ってやってみたけど、予想通り、小さい画像にすると汚くなるのでボツ。大きい画像のままならポップで可愛いのになー。 #PPB_design tinyurl.com/b5shq8u pic.twitter.com/YyMWMp5y

【立体にしてみる】大友克洋っぽくて良いけど、表面と影がごちゃごちゃしすぎて、よく分からなくなった #PPB_design tinyurl.com/b5shq8u pic.twitter.com/d3UkpwJa

【虫眼鏡を作ってみる】失敗!だめすぎる!!!しかもアイコンに組み込むと収まりが悪い。 #PPB_design tinyurl.com/b5shq8u pic.twitter.com/0i2JiEOy

【QRという文字を使ってみる】QRコードの四角形がランダムに並んでるのを、モザイクぽくして、背景に敷いたらおしゃれかも。 #PPB_design tinyurl.com/b5shq8u pic.twitter.com/kEMM7QFu

【みんなの意見を聞く】QとRをQRコードぽい感じにしてみたら、と、チームからアドバイスをもらう。やってみる。 #PPB_design tinyurl.com/b5shq8u pic.twitter.com/PC4eeUPi

【エヴァQを観に行く】観に行ったせいで、あまりのショックに精神状態が若干おかしくなった時期。 #PPB_design tinyurl.com/b5shq8u pic.twitter.com/tdcZOguo

【@daiskip先生からの助け船、来たる】 かっこいい。dribbbleぽいですね。やってみよう! #PPB_design tinyurl.com/b5shq8u pic.twitter.com/DsBvtnxe

【がんがん作る】QRコードの模様と「QR」の文字を両方目立たせたかったけど、やっぱり無理っぽいので諦める。小さくしたら何だかわからない。 #PPB_design tinyurl.com/b5shq8u pic.twitter.com/gU1vafm5

【できた?】どうやったら下から光が抜けてるように見えるのか10分ほど悩んで、結局この形にする。未来ぽくてユーティリティぽくていいんじゃないかと思う。 #PPB_design tinyurl.com/b5shq8u pic.twitter.com/eMjC9D59

【やっぱりダメ】同時進行だったアプリのUIデザインがこの頃に固まり、ポップな色のタイルぽいデザインにすることにしたので、やっぱりアイコンも変更する。また考える。 #PPB_design tinyurl.com/b5shq8u pic.twitter.com/MkEooVP2

【色をためす】ストライプかタイルぽいデザインがいいねということになったので、色の組み合わせを考える。 #PPB_design tinyurl.com/b5shq8u pic.twitter.com/yrp93aHX

【最終形態】実機で確認したり色々して、この派手な色を選ぶ。出来ました!!!!!!おいしそう!!!!!!飴にしたい!!!!!! #PPB_design tinyurl.com/b5shq8u pic.twitter.com/j1GaHX1V

【おまけ:AndroidAppを作る時に必要な画像1】アイコンの他にも、いろいろな画像が必要です。こちらはマーケット用の画像。 #PPB_design tinyurl.com/b5shq8u pic.twitter.com/DvhvtKZB

ほかにもデザイン過程晒してます

他にもデザインの作成過程を晒してますので、こちらも一緒にどうぞ! #PPB_design togetter.com/id/chocolatina

同じチームのデザイナーも晒してます

1





chocolatinaさん

このまとめに参加する



  • 話題の動画をまとめよう