こんなアプリ

カメラ映像に映ったコーヒーなどの料理に対して湯気を合成することであったか〜い感じにする(だけの)アプリです。有料版では映像の保存ができます。

開発の経緯

ディスコマシンでスモークを出す機能を作ってたら、これコーヒーから湯気を出すのに使えるんじゃね？と思ったのでスピンオフアプリとして作りました。

とある日曜日、20時の NHK 大河ドラマ「真田丸」視聴までに作って帰るという目標でカフェにて 17:30 からタイムアタック作業開始。ん〜、後から考えると、そもそも作業開始が遅い気がしますね。

ディスコマシンのソースをコピペして不要な機能を削ってスモークを中心から出すように変えたりして 19:00 には有料版/無料版共に機能完成、そこからアイコンとスクショを作って、iOS dev center で AppID とか登録してアプリ概要を書いて 2 種類リリースビルドして iTunesConnect で 19:33 審査提出、ぎりぎり 2 時間で間に合いました。

ヘルプは UIWebView で外部サイトを表示しているだけなので審査待ちの間にゆっくり作成。

高校生の時はセンター試験英語に出てきたゲームを 2 日で作ったりしていたので、昔からタイムアタックは好きだったようです。

技術的な解説

馬場タクシーやディスコマシンで使っている自作の煙描画ライブラリを使って、カメラ映像の上に画面中央からほのかに立ち昇る湯気を描画しています。

コーヒーや料理をどうやって認識してるの？と友達に聞かれましたが、認識はしてなくて人間がコーヒーに合わせてスマホの位置や角度を調整するようになっています。

コンピュータと人間の共同作業 であります。

ちなみに審査用にスクリーンショットを 2 枚、それを iPhone/iPad 用、日本語英語用、合わせて 4 種類ずつ合計 8 枚の画像を作ったわけですが、これまでにいくつもアプリを作っているのもあってその辺はかなり効率化されています。

具体的には、日本語/英語 2 種類の SVG ファイルを Inkscape で作っておいてスクリプトで iPhone/iPad 用のサイズで分けて画像にエクスポートするような仕組みがすでにあり、それを使ったのでスクショ作成はそこまで面倒ではなかったです。むしろアップロードが面倒。

アイコンを作るパイプラインも結構効率化されています。 iOS の場合 20 29 58 87 40 80 120 60 120 180 76 152 512 167 57 114 50 100 72 144px など実に様々な大きさのアイコン画像を用意する必要がありますが、1 コだけマスターアイコンとして SVG ファイルを作っておいて、それを 1024x1024 画像にエクスポートしてから ImageMagick とスクリプトで各サイズに縮小したり、起動画面やホムペ(死語)用に角丸の部分が透明になるように自動加工したり、さらに生成したアイコン画像を xcode の Assets ファイルに自動コピーしたりする仕組みを過去に作ったので、それを使って面倒な作業がコマンド一発で終わるようになっています。

ということで、技術的な解説というかアプリ作成効率化の話がほとんどでした。

以上、熱々の料理: 例えるならコーヒーから湯気を出そうの紹介でした。

2016/11/04
テーマ: リリース / 2016 / すべて