2016/11/12

【アプリ紹介】馬場タクシー3D: 人手が足りません! / BabaTaxi3D このエントリーをブックマークに追加 このエントリーを含むはてなブックマーク


今日は 2013/10/7 に公開した「馬場タクシー3D」の紹介です。




こんなアプリ

東京を舞台にお客さんを乗せて目的地まで爆走する、東京エリアとしては世界初のタクシードライビングシミュレーターです。

結構本格的な 3D ゲーです。(個人の感想です。)



ゲーム実況する方も出現。





開発の経緯とこれから

リアル東京を走れるドライビングシミュレータがやりたくなったので作りました。

今後も引き続き、もっとリアルに、もっと面白くしていく予定です。
定期的なチーム戦の充実化、Android 対応とかも。

開発期間

大学生のころプロトタイプを DirectX で作り始めてそのうち飽きて放置していましたが、iPhone が普及しだして「あぁこれはスマホで作るべきだ」とまた作り始めて、途中飽きて放置してまた作り始めてを繰り返して今も改良を続けているので期間としては結構な年数やっていて、なんというかもはやライフワークみたいになっています。

人生何もしないには長いですが、巨大資本や人手が大量に必要なものはいまいち自分でコントロールした感がなく、そういう意味では自分にとって退屈しない手頃なサイズのプロジェクトだなぁと思っています。

技術的な解説

簡単に言うと、ODbL に基づいて無料で商用利用できる地図 OpenStreetMap のデータから動的に 3D ポリゴンを作って、Bullet で物理演算して OpenGL ES で描画しています。

車やキャラクター、木などのモデルは Blender で作りました。

山手線上半分にある建物をすべて収録してアプリ配布サイズを 100MB に収めるためにいろいろな部分にて独自技術を編み出して使っています。

その他ノウハウとかアルゴリズムとか 1 記事にはとても入らないほどあるのでここでは省略。

一部は以前書いた 馬場タクシー3Dと競技プログラミング にて紹介しています。


以上、「馬場タクシー3D」の紹介でした。




2016/11/11

【アプリ紹介】分身カメラ / CloneVideo このエントリーをブックマークに追加 このエントリーを含むはてなブックマーク


今日は 2012/11/18 に公開した「分身カメラ」の紹介です。




こんなアプリ

動画の中の動いている人や物を分身させる、不思議な動画作成アプリです。











みなさん面白い動画を作っているようで。


開発の経緯とこれから

あまりよく覚えていませんが、前景と背景が分離できればこんな分身動画が作れそうだなと思ったのがきっかけだった気がします。

今後としては、リアルタイム生成あたりができたらもっといいかなと思います。
作った当時は iPhone5 が最新でしたが、今はその頃と比べると性能もかなり良くなっているはずなので。

今後もこういう「おやっ?」と思うようなひとクセあるアプリを作っていきたいところです。(感じ方には個人差があります。)

開発期間

開発日誌を書いてなかったころのやつなので不明ですが、ソースコードのタイムスタンプからすると 2012/10/13 あたりから作っていたような記録があります。レビュー待ちを 1 週間として、3 週間くらい?

技術的な解説

入力動画の最初のフレームを「背景」として、「背景」を作業のための N フレームにコピーします。

次のフレームからは背景と差があるピクセル付近を「物体」とみなし、フレーム i の「物体」を i % N 番目の作業フレームに合成します。
「物体」の検出については、単純な画素の差だけだと結構ノイズが出てしまうので、いろいろごにょごにょしています。

入力をすべて処理し終わったら、作業フレームと BGM を AVAssetWriter を使ってファイルに書き出します。

改めて振り返ってみると、かなりシンプルなアルゴリズムですね。


以上、「分身カメラ」の紹介でした。










2016/11/10

【アプリ紹介】俺の過去 / MyDailyLife このエントリーをブックマークに追加 このエントリーを含むはてなブックマーク


今日は 2014/4/25 に公開した「俺の過去」の紹介です。




こんなアプリ

スマホに入っているたくさんの写真や動画を自動的にまとめて音楽付きのハイライト動画を作るアプリです。

「あなたの 2016 年を 15 秒の動画にまとめる」
「あなたの歴代クリスマスを 30 秒の動画にまとめる」
「あなたの最近 1 ヶ月を 5 秒の動画にまとめる」

といったことができちゃいます。





撮影場所を大まかにまとめた地名や、撮影時刻に近い自分のツイートも字幕として映像に合成することができます。

なので「そのとき何をしていたか」が分かって懐かしい気分に浸ることができます。

開発の経緯とこれから

スマホで写真をたくさん撮るけど、昔のやつってめったに見返さないよなぁ、なんか面白いことできないかな〜と考えてて、
ハイライト動画を作ったら過去を思い出しておもしろいかも、と思いついたのがきっかけです。

今 (iOS 10, 2016/9/13 以降) では iOS 標準アプリにも似たような自動生成機能が搭載されるようになってしまいましたが、これを作った当時はなかったので自分なりに欲しい感じのものを作ってみました。

この手のはどうせデバイス側の容量不足で写真をどこかに移さざるを得ないので、スマホでやると比較的最近のハイライトしか出せないなぁ、バックアップ先の PC なりクラウド側でやらないとつらいよなぁと思いつつ作っていましたが、その後 Google Photos のアシスタント機能で写真バックアップからまとめ動画自動生成や昔の写真紹介ができるようになって、あーもうこれでいいや、充分便利だ、となりました。

  〜完〜

悔しいのでちょっとあがくと、撮影日時付近のツイートを動画に合成する機能は上記 2 サービスにはまだ入ってないようです。
写真や動画に限らず、「そのとき何をしていたか」が分かる情報って後から見返すと結構楽しかったりするので、そのうち似たような機能が追加される、かもしれません。

あと、スマホの容量がさらにでかくなるとそれに伴ってスマホ内で完結する人も増えるはずなので、そしたら需要も増える...かもしれません。

開発期間

開発日誌を書いてなかったころのやつなので不明ですが、ソースコードのタイムスタンプからすると 2014/3/25 あたりから作っていたような記録があります。レビュー待ちを 1 週間として、3 週間くらい?

技術的な解説

ユーザがスタートボタンを押すと、まず Social framework の SLRequest.performRequestWithHandler でツイートを取得します。

並行して、ALAssetsLibrary.enumerateGroupsWithTypes と ALAssetsGroup.enumerateAssetsUsingBlock を使ってカメラロールから写真を全部リストアップします。
そのうち日付条件にマッチするものだけ取り出して、指定した長さになるように使用する画像と動画をピックアップします。

ピックアップの方法としては、過去のサマリーということで、対象となる日時範囲に対してなるべく均等に写真や動画を採用するようになっています。

例えば「俺の去年を10秒の動画にする」場合で、去年の 1 月に 100 枚, それ以降の月に 10 枚ずつ写真を撮った場合、1 月のものが他の月の 10 倍多く採用されるんではなく、なるべくどの月からも同じ枚数採用するようにする、という動作をします。ただし、そもそも写真が少なければ 1 月のやつが結果的に大量に採用されます。

具体的には、日付条件にマッチする画像や動画すべてを前から見ていって、直前に採用したものの時刻から Interval 秒以上なら採用する、を繰り返して出来上がる動画の長さを求めるルーチンを Interval について二分探索して、動画が指定した長さになったときの配置を採用するというロジックになっています。

ということで、時間でなるべく均一にサンプリングすることで、自分は平均的には何してたんだろうというのが分かる仕組みになっています。

また、写真に含まれる GPS 情報を CLGeocoder.reverseGeocodeLocation で地名に変換して、K-means 法でクラスタリングして写真や動画を何個かのクラスタに分類しておきます。

...なんというかオーバースペックな気もしますが、ある程度近いところで撮った写真はまとめて「石垣島」とか「港区」みたいなそれを代表するような名前を付けたかったものと思われます。あとは全部同じ国なら国情報は描画しないようになっていたりもします。

ピックアップしたら、あとはいい感じにじわじわズームIN/OUTしながら出力映像に貼り付けて、ツイートや GPS 情報も合成していきます。
動画と音声のフェードイン/アウトも加味して AVAssetWriter とかで出力します。

結構込み入った動画生成処理を書いたので、今後何かに使いまわせるといいな〜と思います。

例えば自分のツイートや任意のタイムラインをテンポよく次々と画像化して動画にする、とか?

写真や動画はかなりプライベートな内容を含むだろうからハイライト動画も public には共有したくないだろうけど、公開ツイートであればハイライト動画も公開できるだろうから、ありかもしれません。作りたいアプリの TODO リストに追加ということで。

このアプリを作った頃は一般ピーポーは Twitter に動画をアップロードできなかったはずで (2015年1月に Twitter Video リリース)、今ならもっと気軽にネタ動画作成→投稿できる環境にある気がします。

以上、「俺の過去」の紹介でした。





2016/11/09

【アプリ紹介】1コマまんが このエントリーをブックマークに追加 このエントリーを含むはてなブックマーク


今日は 2012/11/15 に公開した「1コマまんが」の紹介です。




こんなアプリ

吹き出しにテキストを入れるだけでちょっとした1コマまんがが瞬時に作れて、共有もできるアプリです。

キャラクターやシチュエーションはいくつか用意されている中から選べます。

吹き出しもキャラクターも自由に拡大縮小、移動できます。









開発の経緯と今後

ちょっとした出来事をまんがで気軽に表現したいなと思って作りました。

Webサービスで作っていた時期もありましたがもうスマホだろうということで乗り換え。

今後の発展としては、選べるイラストを増やすとか、流行ってるハッシュタグなど、あるテーマについてまんがが作れるようにするとかかなぁと思っています。

開発期間

開発日誌を書いてなかったころのやつなので不明ですが、ソースコードのタイムスタンプからすると 2012/10/18 あたりから作っていたような記録があります。レビュー待ちを 1 週間として、3 週間くらい?

技術的な解説

特別凝ったことはしてないです。UILabel や UIImageView を作ったり動かしたりして、共有するときには CGLayer.renderInContext で画像化して UIActivityViewController を呼び出します。

ちなみに、アプリ名は「1コマまんが」ではありますが、2 コマ以上のまんがも作れます。

なんというか、技術的にはなんでもない感じです。

以上、「1コマまんが」の紹介でした。




2016/11/08

【アプリ紹介】クロスわ〜ず このエントリーをブックマークに追加 このエントリーを含むはてなブックマーク


今日は 2014/3/15 に公開した「クロスわ〜ず」の紹介です。



こんなアプリ

全 695 問のクロスワードです。

制限時間はございませんので、すきま時間に、旅のお供に、どうぞごゆっくりお楽しみください。




開発の経緯

なんかこう、コンピュータっぽいことをして作ったなぁ、みたいなアプリを作りたいなぁと思ったのがきっかけです。

コンピュータっぽいというのは、ここではアルゴリズムを 1 回書けば大量のデータに対してほぼノーコストでそれを適用できちゃう、というあたりです。

おー、みたいな。

あとは、世の中には暇な人が相当数存在しているだろう、というファンダメンタル予想。

開発期間

開発日誌を書かなかったっぽいので明確ではないですが、ソースコードのタイムスタンプを見ると 2014/3/1〜3/9 あたりに更新されているので 9 日間くらいと思われます。

技術的な解説

Wiktionary から単語の読みと説明を抽出して、それを元にちゃちゃっとクロスワードを生成してアプリに組み込んでいます。

まずデータ取得部について。

Wiktionary から全ページの最新版のダンプ(jawiktionary-YYYYMMDD-pages-meta-current.xml) を落としてきて、SAX で parse します。
これがまた XML になっているようでなっていないので困ったものです。具体的には以下のような page 要素がだーっと並んで 250MB くらいのファイルになっています。

どういうことかと言うと...



text 要素がなかなかキてます。しかも単語ごとにいろんなバリエーションがあります。
なので、心折れそうになりながらも、ひたすら泥臭く解析します。

parser handler はこんな感じ(抜粋)。Ad hoc 楽しいめう!



こうしてなんとか (単語の読み, ヒント)[] が揃います。これを pickle にしておきます。今やるなら JSON にするところです。


そしたら今度はクロスワード生成部分です。

まず (単語の読み, ヒント)[] をシャッフルして、適当な大きさの白紙の問題ボードを作っておきます。

あとはひたすら、単語の置き方を全列挙してその中から 1 つランダムに選んで置いていきます。

単語の置き方とは、単語を置いた時ボードからはみ出なくて、置こうとしているところに既に違う文字や同じ方向に置かれた単語に含まれる同じ文字が置かれていなくて、これまで 1 個も置かれていない、または置こうとしているところに既に今回置く方向と直行する方向に置かれた単語の一部である同じ文字が置かれていてるようなものが 1 個以上あって、置こうとしている単語の周りのマスが既に置かれた同じ文字の所以外すべて空白であるような置き方 (x, y, direction) のことです。

意外とややこしいです...。

単語が 6 つ以上置けたらクロスワードが 1 問できたことになるので、実際に使われている大きさにボードをリサイズして記録します。で、ボードを空にして次の問題作成に移ります。

置き方がなくて詰んだ場合は使用単語を後ろにまわしてから再試行します。
未使用単語の残りが少なくなってくると何回やっても詰むことがあるのでそういう単語は捨てます。

よく覚えていないですが、695 問の生成に 30 秒くらいかかった気がします。この程度で終わるなら高速化は不要ですね。
問題セットが出来上がったら problems.js に出力します。

こんな感じ。



ということで、コンピュータっぽいことをして作ったなぁという実感が湧いてきます。

UI 部分については、ちとチープさが否めない感があります。これは今後の課題です。

以上、「クロスわ〜ず」の紹介でした。