tangrobe

このページは現在、ソフトを作るためのメモです。

コンセプト

タングラムのようなシルエットパズルのピースを無心に動かして、新しい問題を作ったり管理できる。

考え中メモ (2014.9)

Webアプリの見た目
ちょっと殺風景だと思う…。シンプルな方が見やすいとはいえ、もう少し何とか。
形の並べ替え
マップは新しいシルエットがいくらか追加されるたびに一から再計算していて、そのたびに起点がかなり変わってしまう。これ自体はOnline-Learning SOM(OLSOM)一般の課題で、改善としてBatch-Learning SOM(BLSOM)がある。 BLSOMでは、主成分分析で求めた主軸で初期マップを張り、ノードを近傍ノードに含まれるリファレンスの代表点に近づけるように修正していく。最初からリファレンスが分かっているのだからBLSOMにする方がよいけれど、今のところは初期マップを複雑度で張るくらいしかできてない。それ以前の問題で、特徴量を全て等価として、Euclid距離で評価しているのがそもそもよいのかどうか。面積率は0～1しかとらないのに、複雑度は∞にもなれる。シルエットパズルだと複雑度はせいぜい5くらいにしかならないけど、それでも複雑度に支配され過ぎるので、面積率を9分割のブロックで求めて3ブロックを足し合わせ、無理やり値閾を0～3に広げてバランスをとったりしている…。学習が進んだマップでは、Euclid空間上ではノードの疎密や曲率が出てくるので、それに応じたJacobianを考えるべきなのか。

マップの例。赤いラインがマップで、左はノード‐複雑度、右は複雑度‐ぼかし複雑度の断面図。

もう一つ、パラドクスのシルエット同士が離れてしまうことがけっこうある。面積率を計算するブロックが外接矩形の均等分割なので、はみ出したピースのせいで面積の分布がかなり変わってしまう。形順に隣り合うシルエット間のAffine変換に対する最小Hausdorff距離の総和を最小にするように、局所的に並び順を修正していくことは考えてみたものの現実的でなかった。重心の位置によって、ブロック境界をずらすことで改善できないか。
Osmoについて
タングラムのようなシルエットパズルに見立て遊びの要素があることは、いつもまことしやかに言われる。つまり問題を作ることだけど、問題を解くのに比べて、作って遊んでいる光景はなかなか見ない。それは、作った形をとっておくことが単に物凄く面倒だから、活動として残っていないだけなのかも知れない。というわけで、目指していたのはとにかく問題を作りやすいツールで、特にピースを自在に動かせる感じを出したい（解いて遊ぶときには、わりとどうでも良かったりする）とずっと思っていたところに、Osmoが出てきた。 Osmoのタングラムは、本物のピースを動かして、画面の中と同じ配置になると教えてくれるのだから、解いて遊ぶためのものだけど、動かすピースは目の前にあって、配置は認識してくれるのだから、問題を作るにも十分だと思う。インターフェースが本物というのは、なかなか究極な感じで、カメラの向きを鏡で変えるだけで可能性が生まれているのは個人的に好きかも知れない。ともあれ、ソフトの中で閉じてしまうと、どうしても遠隔操作の不自由さがつきまとって、真ん中に置くとか、抽象的だけど明確なことをさせるのには、恐ろしく非効率だったりするから、本物のピースをインターフェースにするのは、思ったより現実的かもしれない。一方で、記憶したり整理したりといった、ソフトの得意なことはソフトに割り当たる。やり直しの恩恵が薄れるとしても、それを上回る魅力があると思う。
シルエットの編集
先の話はそれとして、現状は辺同士の集約ができるようにしたい。ピースの角度の調整は、ピース間の角度を見て、15°単位を基準に丸めるので、 15°で割り切れない傾きの辺があると、ぴったり合ってくれない。
web storage
html5のweb storageの使い所を考える。ローカルとの同期をとる形にすれば、サーバの負荷を減らせるかも知れない。

Webアプリプロト (2014.8)

データベースサーバ＋Webアプリケーションで構成
PC/iPadのブラウザで動作できる
jte(javade tangram editor)ファイルのアップロード・ダウンロードができる
（タングラムに限らず、jteファイルさえあればどんなパズルでも追加できる）
シルエットの追加・修正・削除ができる
シルエットにタグを設定できる
シルエットの検索ができる
辺や頂点をきっちり合わせたシルエットが作れる
タッチパネルで操作できる（タップ＆ドラッグのみの操作）
- 複数ピースの選択ができる（背景タップで全ピース選択、背景ドラッグで矩形領域選択）
- 平行移動ができる（重心付近をタッチしてドラッグ）
- 引き回せる（重心から離れた箇所をタッチしてドラッグ）
- 反転できる（水平方向にある程度ドラッグ後、元の位置付近までドラッグ）
- 頂点を近くの頂点や辺上に集約できる（自動）
- 切りの良い角度に合わせられる（タップ）
- ピースの色を変えることができる（色セット名をタッチして選択）
- Undo/Redo/Rewinedができる（アイコンをタッチ）
- 拡大率を変えられる（アイコンをタッチ）
印刷用の問題集・解答集が出力できる
背景などを少しは変えられる
形での並べ替えが一応できる

操作感と問題集のサンプルページ

シルエット操作感（実際は配置や形状をDBから流し込むものの、大体オフラインのjavascript/paperscriptで動きます）
問題集の出力例

スクリーンショット

頼っているもの

見た目のデモ （昔のメモ、結局リアルタイム3Dは活かしきれなかった…）

ここまでのまとめ。
Java OpenGLでそこそこピースの細かいペントミノのピースを描く。

ピースの上に影が落ちないのは、何かの際に気になるかもしれない…。
ちなみに、フェード、文字、音は動画上の編集です。

巷のタングラム

iPadのアプリがどんどん増えている。
錚々たるラインナップから、目指すところを整理。

ピースを気軽に動かしたい
見た目はできるだけシンプルにしたい
用意された以外のピースも扱いたい、曲線ピースも使いたい
正解判定は要らないが、お手本は表示できるようにしたい
膨大なシルエットを感覚的に管理したい
作ったシルエットを簡単に共有したい
他の人と協調してピースを動かしてみたい
見た目にささやかな変化が欲しい

思いつきフレーズ

携帯型アプリ

タッチパネル/加速度センサ
UI/利き手

3D

面取り/曲線ピース
頂点アジャスト/辺アジャスト
質感/ライティング
地域/時間/天気/季節

通信

連携/割り込み

管理

形状自動ソート
jte拡張管理
共有/交換

3D(1)‐面取り

JOGLでOpenGLを少しずつ触り始める。後で組み込み版OpenGLに移植することも少しは考えておく。 JOGLがC関数のインターフェースに徹していることもあって、Javaを意識することも少ないので、当分これで進められると思う。それにしても、基本的に三角形しか使わないで、jteのデータから面取りしたり厚みのあるモデルを計算するのは、思ったより大変かも知れない。

ソースコード… 左：テクスチャを貼る右：立方体と二重の影

ソースコード… jteファイルからピースの形を展開

質感はどんなものだろうか。やっぱり角くらい削るべきかな。必要な計算としては、下のように角を削って一回り小さくなった形の頂点を求めること。

ところが、実際に角を削ったピースの組み合わせを描画してみると、絵的にはイマイチ…。ピースがぴったりくっついている方が綺麗に見える。（ソースコード）

3D(2)‐曲線ピース・凹ピース

曲線といっても短い線分を連ねて表現するので、多角形を三角形に分割できればOK。 OpenGLのテセレータを使って、表面を構成することに。これでどんな形のピースでも安心、魔法の卵なんかもきちんと読み込めるようになった。ついでに、jteファイルで逆回りに頂点を定義してしまったピースもフォロー。（ソースコード）

3D(3)‐ライティング

朝と夜。ただテクスチャが選べるというよりも、照明をうまく使って雰囲気を変えられると良いかなあと思う。（ソースコード）

日本の色にも再挑戦したい気がする。 jteの色目はいまいちだったけど、グラデーションやテクスチャが使えるなら、もう少し良く見せられるのではないかと思う。

外面の構想

メニューはα合成、画面遷移は最小限に。

新規ピース操作アイデア出し。1ピース操作は少し実験が必要。リモートはもっと後。

タイトル案

tangrams'box：ちょっとくどいかも
tangram box：無難
tans'box：判りにくい？
tanglobe：気負いすぎ
tangroove：意味不明
tangramode：響きが不穏