Icon Design | Portfolio

LIFTる。

担当：アイコンデザイン・ストア画像

ツール：Illustrator・Figma

期間：4月〜

リデザインする目的

・インストール数を増やしコンバージョンレートを上げるため

・クエリを上げ、PVを増やすことでインストールを増やすため

・検索最適化するため

現在のアイコン

4/15

既存のアイコンはロゴしか入っておらず、クレーンゲームということが連想しずらかったた

め、一目見てクレーンゲームだとわかるようにしました。

初めはどのようなロゴをクライアント様が求めているのか明確にするためにも、様々なパターンのロゴを準備しました。

ストア画面も同様に、事前にクライアント様から聞いていた訴求ポイントをテキストとして表現し、ビジュアルは実際のプレイ画面を見せることでゲーム内容が見てわかるようにしました。

実際に作ったアイコン

実際に作ったストア画面

4/24

4/15のアウトプットに対するフィードバック

・デザインは、黄色・白・黒の3色での構成を原則としたい

・スクショの基本デザインは、縦スクショでテキスト表現＋画面としたい

・アイコンはロゴ主張verのようなデザインが良い

Icon

・前回のロゴ主張verを意識しながらクレーンの見せ方や形を変えたパターンを３つ作りました景品を掴む瞬間にすることで、よりクレーンゲーム感を強めました。

実際に作ったアイコン

実際に作ったストア画面

4/30

4/24のアウトプットに対するフィードバック

・訴求ポイントの文字が小さく、見せ方をもっと工夫する

・類似アプリがどのようなストア画面なの研究する

store image

・主張したい部分のテキストの下に帯を入れたりジャンプ率を高くすることにより、訴求ポイントに視線が向くようにしました。

実際に作ったストア画面

5/08

4/30のアウトプットに対するフィードバック

・文字がただ乗っけているだけにしか見えず、立体感・奥行きが感じられない

store image

・文字にグラデーションをかけ、黒枠・白枠で囲いドロップシャドウをかけることによって立体感を生み出しました。

・背面にサーチやキラキラをつけることで華やかなイメージに仕上げました。

実際に作ったストア画面

5/10

5/08のアウトプットに対するフィードバック

・文字のグラデーションが見辛い

・背面のサーチやキラキラがバラバラで整っていない

store image

・グラデーションを統一し、下にかけてグラデーションが濃くなるようにすることで見やすくしました

・サーチの角度など整え、星の大きさを大きさなども調整しました

・アイコンの画像を入れることで、より華やかになり楽しさが伝わるようにしました

実際に作ったストア画面

5/14

4/24のアイコンアウトプットに対するフィードバック

・プレゼントのところを可愛いぬいぐるみにしてみたらどう変化するのかABテストを実行したい

store image

・イヌ、ネコ、クマの可愛らしいキャラクターをプレゼントの代わりにしました

実際に作ったアイコン

5/19

5/14のアウトプットに対するフィードバック

・ABテストを現在進行中だが、意外と可愛いぬいぐるみのアイコンの方が低い

＞ユーザーは男性が多いので、シンプルの方が受けがいい可能性が挙げられる

store image

・アイコンの中にも訴求ポイントを入れ、アイコンをからも伝わるようにしました

実際に作ったアイコン

LIFTる。

リデザインする目的

to be continued...