コンピュータ・グラフィックスのための ポリゴン生成技 …itolab.is.ocha.ac.jp/~itot/paper/ItotPhD.pdf · コンピュータ・グラフィックスのための
iOS グラフィックス Tips
-
Upload
kaname-noto -
Category
Documents
-
view
920 -
download
1
Transcript of iOS グラフィックス Tips
![Page 1: iOS グラフィックス Tips](https://reader036.fdocuments.net/reader036/viewer/2022081506/558a12f3d8b42a96588b45c7/html5/thumbnails/1.jpg)
iOS グラフィックスTipsTwitter: @notoroid Twitter: @irimasu
![Page 2: iOS グラフィックス Tips](https://reader036.fdocuments.net/reader036/viewer/2022081506/558a12f3d8b42a96588b45c7/html5/thumbnails/2.jpg)
お題目
•簡単な自己紹介
•肥大化するアプリ
•まとめ
![Page 3: iOS グラフィックス Tips](https://reader036.fdocuments.net/reader036/viewer/2022081506/558a12f3d8b42a96588b45c7/html5/thumbnails/3.jpg)
自己紹介
![Page 4: iOS グラフィックス Tips](https://reader036.fdocuments.net/reader036/viewer/2022081506/558a12f3d8b42a96588b45c7/html5/thumbnails/4.jpg)
簡単な自己紹介
•個人開発者
•屋号: いります電算企画
• Twitter: irimasu
• Twitter: notoroid
![Page 5: iOS グラフィックス Tips](https://reader036.fdocuments.net/reader036/viewer/2022081506/558a12f3d8b42a96588b45c7/html5/thumbnails/5.jpg)
自己紹介• iOSアプリ以前(2001~2008)
• Windows/Flash 開発者
• iPhoneのアプリ開発者 (2009~)
•頭わるいアプリ開発(Apple申請対策)
•アプリの企画提案(サービス/フレームワークの提案)
•喫茶作業者
![Page 6: iOS グラフィックス Tips](https://reader036.fdocuments.net/reader036/viewer/2022081506/558a12f3d8b42a96588b45c7/html5/thumbnails/6.jpg)
北海道の楽しい100人 Facebook クラスタアプリ
最近リリースしたアプリ
無料
![Page 7: iOS グラフィックス Tips](https://reader036.fdocuments.net/reader036/viewer/2022081506/558a12f3d8b42a96588b45c7/html5/thumbnails/7.jpg)
肥大化するアプリ
![Page 8: iOS グラフィックス Tips](https://reader036.fdocuments.net/reader036/viewer/2022081506/558a12f3d8b42a96588b45c7/html5/thumbnails/8.jpg)
iOSアプリのサイズ増大
• iOS7から3G/LTE/4G で最大100MBのアプリをダウンロード可能に
• iOS6から2倍もの容量増加を達成(50MB)
• iOS7 のアクティブな端末数83%(5月現在)
![Page 9: iOS グラフィックス Tips](https://reader036.fdocuments.net/reader036/viewer/2022081506/558a12f3d8b42a96588b45c7/html5/thumbnails/9.jpg)
ダウンロード緩和でアプリサイズを気にしなくてもいい?
![Page 10: iOS グラフィックス Tips](https://reader036.fdocuments.net/reader036/viewer/2022081506/558a12f3d8b42a96588b45c7/html5/thumbnails/10.jpg)
アプリサイズに対する 苦悩は続く
•ユニバーサルバイナリ(プログラム本体)
• iOS7では32/64bit対応が求められる
•古いOSをサポートするほどバイナリは増加
•長すぎるダウンロード
•すぐ使いたい用途のアプリによっては命取り
![Page 11: iOS グラフィックス Tips](https://reader036.fdocuments.net/reader036/viewer/2022081506/558a12f3d8b42a96588b45c7/html5/thumbnails/11.jpg)
アプリサイズ増大の 隠れたパラメータ
![Page 12: iOS グラフィックス Tips](https://reader036.fdocuments.net/reader036/viewer/2022081506/558a12f3d8b42a96588b45c7/html5/thumbnails/12.jpg)
アプリ内画像の存在
![Page 13: iOS グラフィックス Tips](https://reader036.fdocuments.net/reader036/viewer/2022081506/558a12f3d8b42a96588b45c7/html5/thumbnails/13.jpg)
UIパーツを画像だけで作成するとアプリサイズが増大する
![Page 14: iOS グラフィックス Tips](https://reader036.fdocuments.net/reader036/viewer/2022081506/558a12f3d8b42a96588b45c7/html5/thumbnails/14.jpg)
サイズを圧迫するUIパーツ用画像使わない方法を考える
![Page 15: iOS グラフィックス Tips](https://reader036.fdocuments.net/reader036/viewer/2022081506/558a12f3d8b42a96588b45c7/html5/thumbnails/15.jpg)
画像以外の方法で UI用パーツをつくるには?
![Page 16: iOS グラフィックス Tips](https://reader036.fdocuments.net/reader036/viewer/2022081506/558a12f3d8b42a96588b45c7/html5/thumbnails/16.jpg)
自力で描画する•描画用API群(CoreGraphic) を用いる
•豊富な描画機能
•全てプログラムコードで書く必要がある
•プログラマ以外が取り付くしまがない
![Page 17: iOS グラフィックス Tips](https://reader036.fdocuments.net/reader036/viewer/2022081506/558a12f3d8b42a96588b45c7/html5/thumbnails/17.jpg)
自力で描画するデメリット
•プログラマへのデザイン上の負荷が増す
•画像を使うことでデザイナとの責任分担が実現できていたものが台無し
•複雑な描画をコードで書くのは時間を浪費する
![Page 18: iOS グラフィックス Tips](https://reader036.fdocuments.net/reader036/viewer/2022081506/558a12f3d8b42a96588b45c7/html5/thumbnails/18.jpg)
画像を使う以外の選択肢
![Page 19: iOS グラフィックス Tips](https://reader036.fdocuments.net/reader036/viewer/2022081506/558a12f3d8b42a96588b45c7/html5/thumbnails/19.jpg)
![Page 20: iOS グラフィックス Tips](https://reader036.fdocuments.net/reader036/viewer/2022081506/558a12f3d8b42a96588b45c7/html5/thumbnails/20.jpg)
PaintCode2 を使用する• MacOS 用アプリ(MacOS Lion以降)
•ベクタードローアプリ
• AppStore で販売中
Mac/iOS の描画コード(Objective-C)を 出力する
¥8,500
![Page 21: iOS グラフィックス Tips](https://reader036.fdocuments.net/reader036/viewer/2022081506/558a12f3d8b42a96588b45c7/html5/thumbnails/21.jpg)
描画機能
図形と文字列 ベジェ曲線 グラデーション
色バリエーション 領域調整
![Page 22: iOS グラフィックス Tips](https://reader036.fdocuments.net/reader036/viewer/2022081506/558a12f3d8b42a96588b45c7/html5/thumbnails/22.jpg)
ライブラリ
コード
プロパティ
![Page 23: iOS グラフィックス Tips](https://reader036.fdocuments.net/reader036/viewer/2022081506/558a12f3d8b42a96588b45c7/html5/thumbnails/23.jpg)
簡単な使い方@interface FooView
@end
@implement FooView
-(void) draw:(CGRect)rect { [ここにPaintCodeのコードをCopy&Paste] } @end
![Page 24: iOS グラフィックス Tips](https://reader036.fdocuments.net/reader036/viewer/2022081506/558a12f3d8b42a96588b45c7/html5/thumbnails/24.jpg)
ボタンの場合•一旦画像化する必要あり
• UIGraphicsGetCurrentContext() を使って描画
• UIGraphicsGetImageFromCurrentImageContext() を使ってUIImage を作成
• UIButton setImageメソッドで登録
![Page 25: iOS グラフィックス Tips](https://reader036.fdocuments.net/reader036/viewer/2022081506/558a12f3d8b42a96588b45c7/html5/thumbnails/25.jpg)
github で公開中です。
https://github.com/notoroid/FigureRenderer
![Page 26: iOS グラフィックス Tips](https://reader036.fdocuments.net/reader036/viewer/2022081506/558a12f3d8b42a96588b45c7/html5/thumbnails/26.jpg)
リファレンスとして
•描画コードの実装方法の参考にする。
• Macに入れる描画用の参考書思えばお得
![Page 27: iOS グラフィックス Tips](https://reader036.fdocuments.net/reader036/viewer/2022081506/558a12f3d8b42a96588b45c7/html5/thumbnails/27.jpg)
デザイナとの共同作業• SVGやPSDのデータを取り込み可能
• PaintCode2から画像出力可能
• Android リソースを出力できる
•デザイナさんにPaintCode2編集を使ってもらう
![Page 28: iOS グラフィックス Tips](https://reader036.fdocuments.net/reader036/viewer/2022081506/558a12f3d8b42a96588b45c7/html5/thumbnails/28.jpg)
PaintCode2新機能• StrokeKit
•描画色や描画オブジェクトをパッケージ化
• Variables & Expressions
•描画タイミングに値や式を渡すことができる
![Page 29: iOS グラフィックス Tips](https://reader036.fdocuments.net/reader036/viewer/2022081506/558a12f3d8b42a96588b45c7/html5/thumbnails/29.jpg)
何がいいのか?
•ソースコードの形でxcode(IDE) に取り込できる
• UIのアニメーションの描画に利用できる
• CADsiplayLink と併用
![Page 30: iOS グラフィックス Tips](https://reader036.fdocuments.net/reader036/viewer/2022081506/558a12f3d8b42a96588b45c7/html5/thumbnails/30.jpg)
まとめ
• UIに使っている画像サイズがアプリサイズを圧迫していないか検討しましょう
• PaintCode2 を使ってプロジェクトフォルダから画像を追放しましょう
![Page 31: iOS グラフィックス Tips](https://reader036.fdocuments.net/reader036/viewer/2022081506/558a12f3d8b42a96588b45c7/html5/thumbnails/31.jpg)
宣伝
![Page 32: iOS グラフィックス Tips](https://reader036.fdocuments.net/reader036/viewer/2022081506/558a12f3d8b42a96588b45c7/html5/thumbnails/32.jpg)
札幌iPhoneアプリ開発懇談会 DevSap(でぶさっぷ)
•札幌近郊にiOsアプリ開発者の懇談会
•奇数月ごと勉強会を開催
•開発からアプリ市場情報までざっくばらんに意見交換