EDGE touch Ver.1.05
 日本：230円 米国：1.99ドル

Ver.1.05リリースにあたって

そもそも、EDGE touchはiPhoneプログラミングの勉強用として作り始めたこともあって、
まずはアプリがちゃんと動くことが目標でした。
その結果、「機能は一通り揃っているけど・・・なんか使いづらい」アプリになってしまったかと思います。

途中でミニカラーパレットが付いたことで、多少使い勝手が良くなったと思うのですが、
その頃あたりから、もう一度インターフェースの再検討をしようと思うようになり、
今回勢い余ってアプリの作り直しを行いました。

作り直しにあたって、このホームページのデザインを作っていただいたブロックワークスさん（http://blockworks.jp/）にこの件をチラっとご相談したところ、
お忙しい中快くご協力してくださいまして、２人であーだこーだ言いながらインターフェースを決めていき（だいぶ私が無茶を言っていた気がしますが）、
最終的にブロックワークスさんに格好良いデザインに仕上げて頂きました。

メイン画面

メイン画面はこんな感じになりました。

片手でも操作出来るように、編集エリアを左上側に広く確保しています。

ツール切り替え機能

旧バージョンでは、ツール切り替えが手間だったのですが、新バージョンでは
ツール一覧も右上に出ていますので、切り替えも効率よく行えると思います。

なお、ツールは３つだけではなく、スクロールすると他の物が出てきます。
比較的よく使うツールだけ表に出しておき、あまり使わないツールは
奥にしまっておく感じです。

当然よく使うツールの数や種類は人によって違ってくると思いますので、
環境設定でカスタマイズ出来るようにしてあります。

オプション機能、ペンサイズなど

オプションボタンを押すと、現在選ばれているツールのオプションが表示されます。
例えば、ペンツールではここでペンの太さを変えることができるようになりました。

なお、選択系ツールに切り替えた場合は、自動的にオプションが表示されますので、
選択→コピー→貼り付け　と言った一覧の操作がスムーズに出来るようになりました。

スポイト機能

旧バージョンで有ったスポイトボタンは無くなりまして、長押しでスポイトを行うように仕様を変更しました。

PocketPC版のEDGEの影響で「長押し」に偏見があったのですが、EDGE touchには長押しの方が適していると判断し、仕様変更に至りました。
（ボタンも減らせますしね（＾＾；）

長押しと判定するまでの時間は、環境設定で変更する事もできます。

カラーパレット

カラーパレットボタンは一度タップすると右側がミニカラーパレットに切り替わります。
旧バージョンと同じで、フリックでスクロール（２５６色表示）、タップで描画色の変更ができます。
また、ダブルタップでの色の調節も特に変わっていません。

ミニカラーパレットが出ている状態で、もう一度カラーパレットボタンを押すと、今度はカラーパレット画面に切り替わります。
この画面内では背景色の変更などの他に、新たに「色の入れ替え」「グラデーションの作成」が出来るようになりました。

また、パレットだけを保存することが出来るようになりました。
保存しておいたものを後から読み込むことは当然できますが、
画像新規作成時に、保存してあるパレットを指定して書き始めることが出来るようになりました。

レイヤ

レイヤボタンを押すと右側にミニレイヤ（？）が表示されます。
ここでカレントレイヤの切り替えや追加がすぐに行えます。

ミニレイヤが表示されている状態でもう一度レイヤボタンを押すと、今度はレイヤ画面が表示されます。
こちらは旧バージョンと機能的な変更はありません。

トレース機能

初期のバージョンから要望の多かったトレース機能が付きました。
トレース機能を使うと、他のペイントソフトで描いた絵やカメラで撮った写真などを下絵にして
ドット絵を描くことができるようになります。
（背景色部分が透過して下絵が見えるようになります）

閲覧モード

閲覧ボタンを押すと、邪魔なバーとグリッドが消えた状態でドット絵を見ることが出来ます。
仕上がり具合などを眺めるときに使えると思います。

ちなみに、拡大表示している時のスクロール単位が細かくなりました。
（拡大時に、見た目上での１ピクセル単位でスクロールが可能になりました。）

アニメーション機能

アニメーション機能（レイヤアニメーション機能）もいろいろと変更しました。
旧バージョンでは全体でしかスピードを変えられませんでしたが、
新バージョンではフレーム毎にディレイ値を変更できるようにしました。

一括での変更や、ディレイ単位、アニメ順序の設定も行うことができます。

アニメーション用のフレームを描きやすくするために、オニオンスキン機能も用意いたしました。
オニオンスキン機能を使うと一つ下のレイヤを薄く表示させておくことが出来ますので、
連続した絵を描きやすくなると思います。

また、旧バージョンではレイヤの上限が10枚だったため、アニメーションも１０フレームしか描くことができませんでしたが、これだと短いアニメしか作れませんので、レイヤの上限を128枚まで引き上げました。

ただし、画像サイズによっては128枚までレイヤを増やすことができません。
64x64でしたら128枚まで作成が可能ですが、320x480では今まで通り10枚までとなります。

メール添付機能

メール添付機能を実装しました。
アニメーション機能で作った画像はアニメーションGIFとして添付する事もできます。

メール作成画面でアニメＧＩＦがアニメーションしたのはちょっと驚きでしたが、
オリジナルの動く絵文字なんかも作って送ることも出来てしまいますので、新たな遊び方ができそうです。

是非、新しくなったEDGE touchで遊んでみてください。

 EDGE touch Ver.1.04
 日本：230円 米国：1.99ドル

主な更新内容

• PC連携機能を実装しました。EDGE touch内のデータを（レイヤ構造を保ったまま）PCに持って行くことができます。逆にEDGファイルをEDGE touchへ送る事もできます。
  Windows用の専用ツールはこちら↓からダウンロードできます。
  http://iphone.takabosoft.com/jp/edgetouch/utility/
• 色編集時にRGB/HLSのどちらを使うかを記憶しておくようにしました。
• 画像サイズの上限を320x480に拡張しました。

次回予告

処女作という事もあり、見た目から何から田舎臭い感じになっていますので、東京に出ても恥ずかしくない感じにしようと企んでおります。

また、メール添付機能がOS 2系だとちょっと厳しいようですので、次回から対応OSを3系にしてメール添付が出来るようにしたいと思います。

そういえば、今回PC連携機能を実装したのは良いのですが、通信部分でプライベートAPIを使っていまして(NSHost)、アップルから「プライベートAPI使っちゃだめだよー、リジェクトはしないけど次のアップデートで修正してね☆」的な通達がありましたので、こちらも書き直そうと思います。
（シミュレータだと使えるのに実機だと隠されているという、意味不明なAPI・・・）

(iPhone / iPod touch側)

(PC側)

iPhone / iPod touch（あ、touchって書くの忘れてた）内の画像ファイルを、PNGまたはEDG形式で取り出せます。
パレットやレイヤ構造(EDG形式のみ)は保ったまま取り出せますので、例えば通勤・通学中の電車内で（EDGE touchを使って）描いたドット絵の続きを家に帰ってPC（EDGE）で描く、なんてことが可能になります。

もちろんEDGE1またはEDGE2で保存したEDGファイルをiPhone / iPod touchへ送ることもできます（ただし256色以下といった制限があります）。

さてさて、しばらく動作検証を行おうと思うのですが、こっそりβテスターを数名ほど募集中です。
もしこの機能のテストにご協力頂ける方がいらっしゃいましたら、メールやtwitter等でご連絡を頂ければと思います。
（日常的にEDGE1またはEDGE2でドット絵を描かれている方で、iPhoneまたはiPod touchをお持ちの方が理想ではあります）

今月下旬ぐらいには審査に出したいなぁと思っています。

また、ミニカラーパレットの色をダブルタップすると、色の調節エリアが表示されまして、絵を見ながら色を調節する事ができるようになりました。

ドットを打つ、色を変える、色を調節する、といった基本的な操作が効率よくできるようになったと思います。
カラーパレット操作の効率が上がったところで、ツール切り替えの効率ももう少し良くしたいなぁと思っているところなのですが、どうやって実現しようか悩み中です。
何か良いアイディアがありましたら教えていただけると助かりますm(_ _)m

さて、Ver.1.02において、ファイル名やレイヤ名に日本語を使うと文字化けを起こす不具合を見つけまして、先ほどこれを修正したVer.1.03を申請したところです。
ちょっと面白みのないアップデートで申し訳ないのですが、通知が来ましたら当ててみてください。
またもし他にも何か変な所がありましたら、wiki等へご報告していただけると助かります。

現在は、PCとデータを相互にやりとりできるようにしようと思いまして、EDGE touch Serverなるものをコツコツ作っております。

せっかくなのでedg形式をそのまま放り込んだり、edg形式として取り出したりできるようにしようと思いまして、EDGE touch専用形式とEDGE1/EDGE2専用形式とのコンバータ部分を書いている所です（これがなかなか大変）。
（EDGE以外のエディタを使っている人向けにPNG形式ともやりとりできるようにするつもりです。）

早速いくつか不具合が見つかりまして、お恥ずかしながら不具合修正版を申請いたしました。
（アプリのバージョンは1.01なのですが、誤って1.00aとして申請していまいました・・・何故か修正できずorz）

近いうちにアップデートが掛かると思いますので、お試しくださいませ。
（安定度が増していると思います。）

また何か不具合、ご要望等ありましたらwikiの方へお願いいたします。

要望の方も早速頂きまして、PCとのデータのやりとりは必須だと思っています。
今のところWin専用のサーバアプリを作って立ち上げておき、iPhone/iPod touchと通信してデータをやりとりする方法が一番現実的かなと思っているところですが、他に何か良い手法をご存じの方がいらっしゃいましたら、メール・wiki・twitter等でご教授をお願いいたします。

そのサーバアプリではEDGE touch形式 と EDGE1形式のコンバータ機能も内蔵しようとは思っていますが、最終的にはEDGE2でEDGE touchファイルをそのまま読み書きできるようにしたいと考えています。

 EDGE touch Ver.1.00
 日本：230円 米国：1.99ドル

EDGE touch（エッジタッチ）はiPhone/iPod touchでドット絵を描くために開発された256色専用のドット絵エディタです。
タッチすることでダイレクトにドットが打て、いつでもどこでも手軽にドット絵を楽しむことができるようになります。

[主な機能や特徴]

• 最大256x256までの画像編集が可能
• 自由曲線、直線、四角や丸と言った基本的な描画機能
• 人差し指で描画している最中に中指でタップするとすぐにキャンセルできる機能
• アンドゥ・リドゥ機能（回数制限有り）
• グリッド機能（間隔も設定可能）
• カラーパレットではRGB色空間だけでなくHLS色空間での調節が可能
• レイヤ機能（上限有り）
• 複数レイヤの選択範囲同時移動やコピペなどが可能なレイヤ・グループ機能
• 同時に等倍表示が可能
• レイヤを使ったアニメーション機能
• フォトライブラリへ書き出す機能

※ アプリ内のメニューより、取扱説明書が見られます。

[動作環境]
iPhone / iPod touch
OS:2.2.1以降

[スクリーンショット]

　
他のアプリ同様に、要望対応などを行っていこうと思っています。
興味のある方は遊んでみてください。

ちょっと困ったのが、登録するときにアプリのカテゴリーを選ばなきゃいけないんですが、とりあえずユーティリティとエンターテイメントを希望として出しておきました。

早くストアに並ばないかな～。

アプリ公開後にこのアイコンに呆れたユーザーさんが良いデザインを送ってくれる事をこっそり期待（なんという他力本願）

なんて事を書きましたが日記を公開してしばらくしたら、デザイナーさん（このホームページのデザインもやってもらいました）から突然電話が掛かってきまして、あのアイコンはやっぱり酷かったみたいです(笑)

こちらの希望を伝えて、さっくりとアイコンを作ってもらっちゃいました。

一気に商品っぽくなって嬉しい限りです。
というかこいういう絵をさくっと作れてしまうってのは羨ましいです。

早く審査に出したいですorz

一部をかいつまんでご紹介。

ホーム画面（？）

（EDGE2で５分で作った。）

我ながらこのアイコンは酷いですが（笑）
でも、ドット絵エディタという性質を表すにはこんなデザインが良いかなと思うのですが。

アプリ公開後にこのアイコンに呆れたユーザーさんが良いデザインを送ってくれる事をこっそり期待（なんという他力本願）

ちなみに起動直後のスプラッシュ画面はこんな感じ。

（EDGE2で５分で作った。）

メイン画面

これと言った変更はありませんが、右上の等倍ウィンドウが動くようになりました。
タップで1,2,4倍と切り替わります。

メニュー画面

ドリルダウン形式のメニューです。

ファイルメニューはよく使うかもしれませんね。

ちなみに自動保存機能がありますので、やめたくなったらブチッと終了しても、次に起動したときは前回の続きからすぐに描き始められます。
とっておきたい画像は保存して別途とっておく事ができます。

ただ、現状ではiPhone内のデータファイルをPC等へ持っていく公式手段が無い（もしかしてもうあるのかな？）ので、今後の課題と言えます。
（今後のバージョンアップでこの辺りの問題を解決できると良いのですが。どこかのアップローダにアップするとか。）

イメージ加工系の機能も最低限入れてあります。

フォトライブラリへ書き出す

作ったドット絵はフォトライブラリへ書き出す事ができます。
書き出した後は当然ながらiTunesで同期させてPCへ持っていったり、iPhoneの壁紙にしたり、連絡先の絵にしたりできます。

書き出すときに、オプションを設定できるようにしておいたのですが、オリジナルのサイズで書き出した画像をiPhone上で見てみると、

こんな感じでかなりガッガリな結果になります。

そこで書き出し時の「拡大／縮小」オプションを「画面に合わせる」にしておくと、

こうしてドットが奇麗になります。
（見た感じjpg形式のようですので、劣化していると思われます。）

なので、初期状態ではキャンバスの大きさを32x48にしてあります。
これでフォトライブラリへ書き出すと320x480と画面にピッタリ合うようになります。

アニメーションプレイヤ

レイヤをフレームとして扱い、アニメーションを行う機能です。
２コマ程度の歩行アニメとか描くのが楽しそうです。

今後の予定

マニュアルを書きながら動作チェックを行い、アップルの審査に出そうと思います。
iPhone専用のウェブサイトを用意してそこにマニュルを乗せますので、マニュアルが書き終わる前に審査に出してしまおうと企み中。

英語のマニュアル用意するのが大変そうですが、多分に誤訳が含まれることになるかと思います（＾＾；

ちなみに価格帯につきましては、低価格にする予定です（２３０円前後）。

メモリの制約もあってレイヤの上限は適当にもうける予定です（１０ぐらい？）。
一応レイヤリンク機能（複数レイヤ上の画像を移動したりコピペしたりする機能）も付ける予定です。

この開発ペースだと今年中にギリギリ間に合うかどうかって感じですね。
もうちょっと自由な時間が有ると良いのですが、貧乏暇無。

なかなか忙しくて開発の進み具合はあまりよろしく有りませんが、直線ツールや四角形ツールと言った基本的な描画機能が動くようになりました。

PC版のEDGEは左ドラッグでペン描画中に右クリックすると描画をキャンセルできますが、iPhone版も同じことができます。
（二本のタッチを感知したらキャンセル）

タッチペン且つシングルタッチのみのWindowsMobile版ではこのキャンセル操作を仕方なく省いたわけなのですが、iPhoneが指操作かつマルチタッチに対応してくれたおかげでキャンセルを実現することができました。
iPhoneよく考えて設計されてるなぁと思いました。

二本指ドラッグでスクロール、ピンチイン・アウトで表示倍率の調節も想定通りうまく行きました。

選択系ツールももうちょっとで完成しそうです。

選択系ツールと描画系ツールとで、画面下部に表示するボタンを変えてみました。

たぶん、自由曲線ツールと矩形選択ツールは頻繁に行き来することになると思うので、すぐに切り替えられるボタンが有るといいなぁと思いつつスペースが無いですね。

色って他の色と見比べながら調節したり、既存の色から別の色を作ったりする事が多いと思いますので、そうした操作ができるようにしてみました。

しばらく他の用事で忙しくなりそうなので、またペースダウンするかもしれませんが、地道に実装を進めていきたいと思います。
（というか、iPhoneネタは４個ぐらいあるので、どんどん作っていかないと）

サイトリニューアルの作業ばかりでEDGE touchの方あんまり進んでいないのですが、多少メニューとか動くようになりました。

アイコンボタンもちょこっと小さくしました。

左下のペンアイコンをタッチすると、ペン一覧が、下からぬめっと出てきます。

んで、問題なのはカラーパレット。
最初は１６×１６の表形式でやろうかとも思いましたが、まぁこうしたデバイスでそんなに色は使わないだろう（基本８色とか１６色とかだろう）と思いまして、いつものテーブルビューで表示させてみました。

なので、デフォルトパレットとしては０〜７番は基本色かな。

ここで下のツールバーの編集ボタンを押したら、RGBバーのようなものが、画面下ににょきっと出てくるようにしようかと思っています。

結構頻繁にボタンを押すことになると思いますのでボタンサイズは気持ち大きめにしておきました。
感度良好。
ちょっとアイコンデザインに統一感がありませんが、気にしないことにします。

右上のは等倍表示エリアです。

次はメニューの実装をやってみようかな。

画面は表示倍率を32倍にしている所ですが、このぐらいならほぼ間違いなく狙った位置へドットが打てることが判りました。慣れればもっと倍率が低くても大丈夫そうです。
自分が使うならカーソル式じゃなくてタッチ式かな。

iPhoneは32bitPNG画像を使ったボタンとかも配置できますので、こうした全画面編集エリアに、各操作ボタンが浮いているようなUIが良いんじゃないかと考えています。
（ツールバーのように一行牛耳ってしまうと、その分画像が見えなくなってしまいますし）

必要そうなボタンは

• メニュー（◎）
• アンドゥ（◎）
• リドゥ（△）
• 描画色（押すとパレットが出る）（◎）
• 背景色（押すとパレットが出る）（△）
• 描画色-背景色入れ替え（「描画色」と「消す色」を即座に切り替える）（○）
• レイヤ（○）
• ペン切り替えボタン（メニュー式）（◎）
• スポイト（○）
• 編集単位オン/オフ（△）

○以上だと７個ぐらい必要っぽいので、上下になんとなく割り振って配置してみようかと思います。

• タッチでドットを打つ
• 人差し指で打った後、中指で同時にタッチすると描画をキャンセルできる
• タッチ＆ホールド（長押し）でスポイト
  （あんまり長押し好きじゃないんですが＾＾；）
• 下の方にあるスポイトボタンを押してからタッチでスポイト
• ピンチイン/アウトで表示倍率の拡大縮小（描画キャンセル後に発動する感じ）
• 二本の指でドラッグするとスクロール
• 左上の窓には等倍で表示されるが、タップすると等倍/2倍表示を切り替えられる
• カラーパレットやレイヤを選ぶ画面は１次元リスト（UITableView）から選ぶ感じ

ボタン等で切り替えなくても、打つ・拾う・スクロール・表示倍率変更が出来るので、タッチでも行けそうな気がしてきました。
あとは、正確にドットが打てるか、ですが、こればっかりは実験してみるしかなさそうですね（ここが一番重要ですね）。

そういえばＰＣとのデータのやりとりの方法も用意しなきゃいけないんだっけか。
フォトアルバムに書き出せればいいのかな。

あと、アプリ名どうしようかな。
「EDGE for iPhone」だと「EDGE Pocket 2」との統一が取れてないしなぁ。
統一を考えると「EDGE touch」（エッジタッチ）が無難かな。
でもすでに「EDGE」っていうiPhone用ゲームあるんだよね。
http://www.mobigame.net/
「EDGE touch」が駄目なら「Pixel Editor」とかかな～。
どうせEDGEって名前も海外じゃ無名だろうし（＾＾；
（国内でも無名だけど）

とりあえず行き着いたのは、カーソル式。
（SFCデザエモンとかの編集方式に近い感じ）

（この画像をiPhone/iPod touchへ転送して全画面（横持ち）で表示させると妄想できます）

以下、操作方法等をざっくりと列挙

• 左下のカーソルボタンでカーソルを操作して描画ボタンを押すことでドットを打つ
• 拾うボタンを押すとカーソル位置の色を描画色へ拾う
• 編集エリアをピンチイン/アウトで表示倍率の拡大縮小
• 編集エリアをドラッグでスクロール
• ペンボタンを押すと、自由曲線、直線、長方形、塗りつぶし、選択・・・が選べる
• 描画色ボタンを押すと、絵が出ている部分がパレット＆ＲＧＢバーに切り替わるので、
  同様にカーソルを操作して色を選んだりする
• レイヤボタンを押すと、絵が出ている部分がレイヤ一覧画面に切り変わるので、同様にカーソルを選んでカレントレイヤを切り替える
• 左上の窓には等倍で表示されるが、タップすると等倍/2倍表示を切り替えられる

最初はタップでドットを打つ方式で行けないかなぁと思ったのですが、実際にiPod touchでいろんなアプリ触ってみると、とてもじゃないですが、細かい作業は出来ません。
もちろん１ドット１６倍ぐらい拡大すれば何とかなると思いますが、見える範囲は相当狭くなってしまいますし、エリアもかなり喰います。

そこで、思い切ってカーソル式にしてみたというわけです。
これなら見渡せる範囲も広いし、ある程度正確な操作も出来るんじゃないかと思います。

ただ、結構この操作方法は好き嫌いが出ると思いますので、タップで描画できる方式ももうちょっと考えてみようとは思います。