みかづきブログ その3

3ヶ月つづけてみました。

iPhoneアプリのアイコンにつくバッジの大きさと位置を目視で調べました

chibadge.kimizuka.fm

かつてchibadge(チバッジ)のアプリアイコンをつくったとき、

  1. デザイン
  2. 実機に移してバッジをつけて確認
  3. 調整
  4. 2に戻る

という感じでデザインを調整していました。

f:id:kimizuka:20160127100957p:plain



それがとてもめんどうなので、バッジのついた状態をプレビューするツールをつくりました。

codepen.io
http://codepen.io/kimmy/full/bEvYLX/

アイコン画像をドラッグ&ドロップすると通知数が1桁のときのバッジを付けて表示してくれます。
目視で確認してつくったためちょっと誤差があるかもしれません


目視で確認したiOS9のバッジのあれこれ

  • バッジの大きさ = アイコンサイズ * 0.4
  • バッジの位置は角丸じゃないときの右上からx, y 共に アイコンサイズ / 30 ずつ内側にはいったところ
  • バッジの背景色 #ff0000

今回は以上です。