ついてつらつらとこの広告は、90日以上更新していないブログに表示しています。2016-05-29ストローク遅延レンダ久々のアップデートです。現在レイヤー関連の大幅な機能追加作業を行っていますが、仕様が大きく時間がかかっています。ビルド環境が変更されていてバグ修正部分だけを公開するのも難しく、ストロークやイメージ処理のエンジンの深いところから変わっていて非常に不安定なので公開したくてもできなかったというのが実情です。最近ようやくエンジンを変えた事で発生していた不安定さが解消されてきたので、レイヤー関連の処理を切り離し、公開できる部分をまとめて今回のアップデート内容としました。いうわけでメジャーアップデートではなくバグ修正と細かい機能追加なのですが、主な変更点を備忘録として以下にまとめておきます。ストローク遅延レンダの実装ブラシをキャンバスのイメージデータに描き込む前に、ダミーとしてスプライトを表示しておく機能です。ペイントソフトの多くは基本的に、ペンストロークに沿ってブラシ形状のデータを書き込むことで画像を描いていくわけですが、太いブラシや複雑な計算が必要な混合ブラシ等ではどうしても書き込みに遅延が発生します。そこで実際の書き込みの前段階、ブラシ形状をどこに書き込むかのデータだけを先に計算してそこにダミーのスプライトを表示しておくことで、見た目の遅延を少なくしようという考え方です。表示できるのは単色の単純なスプライトを回転させる程度のものなので、テクスチャを貼っていたり混合など複雑なブラシでは一時的に全く違ったイメージが表示されることになりますが、あたりがつくので心理的には無いより良いと思われます。ストローク遅延レンダは、以下のオプションでその機能を調整できます。スプライト色の固定/スプライト表示色スプライト色の固定をOFFにすると、現在のブラシ色でスプライトを表示します。ONにした場合はスプライト表示色で設定した色が常にスプライトの色として使用されます。ストローク予測これまでのストロークポイントの動きから、その先のポイントを予測してスプライトを表示します。(この機能はCloverSC寄付版を購入・インストールしている場合のみ有効になります)これまでワンショットUndoとして実装していた機能は予測したポイント部分のストロークもキャンバスイメージへの描き込みで実現していましたが、余分なストロークを毎回描いては消す処理が発生して極端に重くなるため、かなり細くて軽いブラシでしか満足な動作が得られませんでした。そのため今回ストローク遅延レンダ実装と同時に過去の機能を削除し、こちらのストローク遅延レンダによるダミースプライト表示によるストローク予測表示に変更しました。個々のブラシのパラメータは有効なので、ブラシ側のワンショットUndoに関する設定をしておかなければこちらのスイッチは無効です。こちらはワンショットUndoをまとめてON/OFFするマスタースイッチだと考えてください。ストローク遅延カーソル現在キャンバスイメージに実際に描画されているストロークの最新部分と、ダミーのスプライトによるストロークの境界部分にカーソルを表示する機能のON/OFFスイッチです。ストローク遅延レンダ進行バーストローク遅延レンダーが動いてる間、その進行度合いを示すバーのON/OFFスイッチです。前回のストロークのレンダリングが終わってない状態で、次のストロークを描ける機能のON/OFFスイッチです。ストローク遅延レンダーが動いている間、レイヤー操作等ストロークの描画に影響を与える機能は一時的に使えなくなります。レンダリングが終わるまでお待ち下さい。Paintは半透明ピクセルを含むアイコンの編集や、モバイル端末でのラフスケッチなどの用途を想定してデザインされています。「4000pixelを超えるような大きな画像を全画面表示しながら複数レイヤーで着色する」といった用途は当初想定してない利用シーンなのですが、多数のレイヤーでメモリ効率良く動作するよう考えて設計したために、そのように利用するユーザーが一定数存在するようです。そのため当初50%に設定していた縮小制限を画像サイズに合わせて緩和する措置を入れるなどして対応していましたが、表示する画像が大きくなると描画処理が重くなりフレームレートが下がってカクカクする(特にナビ表示など画面全体が入るウインドウを複数表示した場合に顕著)という問題が発生していました。今回キャンバスの表示データ構成と描画エンジンを修正することでこの問題を解決したため、大きな画像で重くなる現象はなくなりました。同時にこれまで50%が下限だった縮小制限のオプションを10%に緩和しました。細かい部分ではレイヤーのクリップオプション項目が増えています。修正されたバグも多いのですが、エンジンを変えたために見た目機能は変わらなくても様々な部分で修正が入っています。そのため新たにバグが発生している部分もあるかもしれません。v1.24をアップしました。Lollipopで起動しない問題の修正と、新しい機能として定規ツールを実装しています。基本的にはごく普通の定規ツールですが、多少特殊な操作もありますので、以下簡単に説明しておきます。以下のように「ツール選択」から「定規」を選択します。以下のように、画面中央に定規ツールのCloverアイコンが作成されます。このアイコンを選択していると、画面上に定規ツールが表示され、利用することができます。非選択にすれば定規の現在のパラメータを保存したまま、一時的に無効にすることができます。定規は上の画面で水色の部分にストロークを当てた時にのみ、機能します。他の部分では定規を出したまま、普通にフリーハンドの描画ができます。四角のボタンは並行移動(原点)、丸いボタンは方向指定(取手)となります。種類がありますが、直線の場合のみ、黄色い帯が表示されます。この部分を使って一本指で並行移動、二本指(ピンチ)で回転操作を行うこともできます。画面左側に現在フォーカスのある定規(Cloverアイコン)のパラメータを操作することができます。・パラメータ数値これらの設定ができます。シェイプの種類設定から、定規(Cloverアイコン)の複製を行うこともできます。定規Cloverアイコンは複数同時に選択することができます。左上が点灯しているアイコンが選択された状態です。アイコンが明るいものはフォーカスを持っていて、上述のパラメータ操作ウインドウや操作つまみが表示されます。選択状態ではフォーカスがなくても水色の部分が有効です。「操作設定」内の「吸着」を有効にすると、他の定規ツールのライン上や制御点に現在操作中の制御点がくっつくようになります。選択した場合は、同時に範囲を「全体」に指定して、画面全体でストロークが影響を受けるようにして利用してください。(集中線だけは例外的に範囲指定がなんであっても画面全体が影響範囲になります)デジタイザーを利用されている場合、これまではスタイラス設定内の「指でのUI操作を禁止」や「一本指でのキャンバス操作」の指定により、自動的にキャンバス内のボタン操作(定規のボタン・帯・変形ツールのボタン等)も同時に無効になっていましたが、このバージョンから「指でのキャンバス上のUI操作を禁止」として別のスイッチになりました。通常は禁止になっていませんので、禁止したい場合はONにしておいてください。定規ツール用のショートカット操作も追加されています。左手デバイス等を利用されている場合は、こちらもご確認ください。v1.23では、新しい機能「ポストストローク編集」が実装されました。これはラスター系ツールに一部ベクタ系ツールの考え方を採り入れたものです。いうものかというと、ペンで線を引いた後に、その線を少し移動させたり、太さや色を変えたり、さらには制御点を細かく移動し自由に曲げる事もできます。Paintに限定した機能となっています。「ここだけ線がブレてる他は完璧なのに」などということはありませんか?私はしょっちゅうです。その度にUndoしたり、消しゴムで細かく消したりするのは、とても面倒です。そのせいで私は綺麗な線でペン入れするのは諦め、これまでラフくらいしか描いていませんでした。「ポストストローク編集」はUndo、消しゴムの出番をペン入れに関しては完全に無くす威力を持ったツールになっています。ポストストローク編集は線を描いた後に「ツール選択→ペン→線の編集」で起動します。内部的には「簡易モード」と「詳細モード」の2つに分かれています。移動・回転・スケールの設定と、パースを伴った自由変形が行えます。色やブラシの設定もここで行えます。重要なのは、左下ウインドウにある「補正」ボタンです。これをONにすると、右下に出ている縦長のウインドウが出てきます。ここでリアルタイムに線の調子を確認しながら、「手ぶれ補正」のパラメータを変更できます。ここでカスタムを選択し、Knot遅延生成タイプを「一定時間間隔」または「一定距離間隔」を選ぶことでKnotの間隔を調整できます。簡易モードで調整したKnotやパラメータはその後詳細モードに引き継がれます。詳細モードでは遅延パラメータを変更することはできませんので、ここでKnotをその後編集しやすい数に調整しておくことをお勧めします。(というか、元々そのために実装したパラメータです)「初期化」ボタンを押すと、「簡易モード」で行った編集は破棄され、元のストロークの状態に戻ります。ポストストローク編集では、このモードにローカルなUndo情報を持っていますが、それもリセットされるのでご注意ください。下の「モード選択」を選ぶと詳細モードに移行できます。詳細モードではKnot(制御点)単位での移動や筆圧・経過時間の調整ができます。不要なKnotを消してストロークを短くしたり、一部にKnotを追加して、きめ細かな曲線の制御を行う事もできます。「詳細モード」は「簡易モード」の変更を引き継ぎます。編集したあとで「初期化」ボタンを押すと「簡易モード」の状態に初期化されますのでご注意ください。ペイントモードでの初期ストローク状態まで戻したい場合は、一度「簡易モード」に戻って初期化ボタンを押す必要があります。ついでに説明しておくと、ポストストローク編集はUndoスタックに積まれた、「やり直し」用のストローク情報の内容を読み取り、書き換えることで実現しています。そのため、このツールでの編集結果はメインのUndo履歴としては残りません。(残そうと思えば残せますが・・・まあ、仕様です)また、Undoスタック内のストローク情報を利用するため、Undoスタックのトップがペンストロークの場合ならば起動できます。3つのストロークを描いた後に、最初のストロークを編集したいと気づいた時にはUndoで戻って編集できます。(編集するとその後描いた2つのストロークは消えてしまいますが)さて、「詳細モード」は以下7つのサブツールで成り立っています。Knotを削除します「Kt選択」ボタンを押すと、頂点範囲選択モードになり、どのツールを選んでいる時でもキャンバス上のKnotをなぞり、その選択範囲を指定できます。範囲選択に意味があるツールでは、下のシーケンサー画面の上にあるルーラー部分をなぞる事でも範囲選択を行えます。ルーラーに表示されているのは、ストローク開始からの経過時間(ミリ秒単位)です。シーケンサー画面上で上下にドラッグすると、タイムスケールを変える事ができます。ブラシ「ブラシ」サブツールを選択すると、ブラシの太さや種類のパラメータを設定するウインドウが出ます。「つまむ」はブラシのタッチ位置に一番近い、ストローク上の点を引っ張るイメージでKnotを移動します。「移動」はブラシの範囲内のKnotをタッチ位置から相対移動させます。「スマッジ」はブラシ移動中に範囲内に触れたKnotをブラシ移動量だけ移動させます。「滑らかに」はブラシ移動量だけ、前後のKnotとのガウスぼかしを通し、滑らかなカーブにします。通常は「つまむ」と「滑らかに」の2つしか使わないと思われます。太さで影響範囲を決め、「つまむ」の場合は、「ぼかし硬さ」により、ストロークの曲げ具合が調整できます。硬くするとタッチした部分だけを引っ張る感じになり、柔らかくすると範囲境界あたりでグニャリと曲がる感じになります。「滑らかに」は「つまむ」でちょっと凸凹になった時に、仕上げとして使うといいでしょう。ブラシツールでは、選択範囲は影響するKnotのマスクとして扱われます。サブツールは選択したKnot範囲にのみ、移動・回転・スケールをかけることができます。「フリー」サブツールは選択したKnot範囲にのみ、自由変形をかけることができます。「筆圧」サブツールはKnot単位での筆圧を設定できます。このモードではキャンバス上のKnot操作は常に範囲選択モードになります。範囲選択領域があるときには、シーケンサの横にパラメータをまとめて操作するためのレンジバーがあらわれます。すべてのKnotの筆圧に一定数を乗算します。前後の筆圧にガウスぼかしをかけて滑らかにしますなお、選択範囲に関係なく、シーケンサ上に表示されているKnotを上下すれば1Knot毎の筆圧を設定できます。※テクニック備考まず、全体を選択してオフセットを上げ、すべて1にします。フェードを1.0、次にフェードを-1.0かけます。乗算2.0を二度かけます。これで中央が膨らんだカーブを作ることができます。あとは硬さを好みに調整すれば、綺麗な入り抜きになります。時間シーケンサ上で左右にKnotを動かすとKnotの時間を移動させることが出来ます。速度による動的効果のついたブラシ(組み込みブラシではCloverSC)で影響が出ますが、あまり利用することはないでしょう。他のKnotの中間位置に、Knotを追加できます。カーブを細かく曲げたい時、太さを細かく指定したい時、いまあるKnotでは表現しきれない場合に利用してください。キャンバス上のストロークを指定、あるいはシーケンサのルーラーからも追加できます。余計なKnotがあった場合、それを削除できます。キャンバス上のストローク範囲、あるいはシーケンサのルーラーの範囲指定で削除するKnotを指定できます。「None/BSpline/C-R」ボタンKnotを補間するときのカーブのアルゴリズムを指定します。Noneを選ぶと単純な直線になります。BSplineはKnotの付近を通る滑らかな曲線を描きます。C-RはKnot上を必ず通る曲線を描きます。Knotが密な場合はあまり違いはありませんが、補正パラメータを調整するなどしてKnotを少なくすると、かなりの違いが出てきます。通常はBSplineかC-Rのどちらか扱い易い方を使うと良いでしょう。「更新」ボタンこのボタンのチェックを外すと、常にストロークを簡易ポリゴン表示するようになります。チェックしている場合はパラメータ変更中のみ簡易表示され、変更が終わると正式なラスタライズが行われます。「ライン」ボタンKnot間をつなぐラインの表示ON/OFFですその他追加機能ポストストローク編集では「簡易・詳細」モードの表示ボタンの中に、Cloverアイコン作成ボタンがあります。ツールに関してもCloverアイコンを作成できるようになりました。移動・変形ツールを、「範囲選択→コピーor切り取り」後の自動遷移(キーコンフィグから動作を設定可能)により起動した場合、「適用」ボタンにドロップダウンボタンで「+統合」ボタンが表示されます。この統合ボタンを押すと、通常の移動・変形動作の後に「選択範囲のクリア」「選択中レイヤーの下との統合」「ペイントモードに戻る」の3つの動作が自動的に行われます。場合により使い分けてください。v1.22を公開しました。このバージョンでは新しく「手ぶれ補正」機能が実装されています。この手ぶれ補正機能は、非常に強力なカスタマイズ機能を備えていて、ちょっとした”ひずみ”の修正はもちろん、設定によっては品質の悪いタッチパネルでの線ヨレまで完全に除去できます。手ぶれ補正を使うには適当なブラシのメニューを開きます。「手ぶれ補正」ボタン設定画面を開きます。(現状、設定情報はグローバルに保存されます。)「+手ぶれ補正」ボタン選択中のブラシの、手ぶれ補正ON/OFFを切り替えるCloverショートカットアイコンを作成します。手ぶれ補正のON/OFFはブラシ設定内にスイッチがありますが、これをキャンバス上に作って操作した方が便利だと思われます。「手ぶれ補正」ボタンを選択すると、このような設定画面が開きます。通常は一番上にある「手ぶれ補正タイプの簡易選択」から選べば十分だと思われます。左が一番軽く弱い補正、右になるほど強い補正になると考えて間違いありません。・・・こんな感じです。ここが違う・・・という場合は「カスタム設定」で細かく指定する事もできます。カスタム設定のパラメータ詳細カスタム設定ではすべてのパラメータを細かく設定することができます。これは最も単純な処理です。したストロークの歪みを補正する効果が期待できます。前後の頂点座標を「ガウスぼかし」という少し重みをつけて平均を取る処理を通すことで、滑らかにしています。0でガウスぼかしなし、1で前後1頂点の平均、以下同様です。・ストローク変化これは実際のペン先座標から、ストロークをわざと遅延させて滑らかにすることを狙った処理です。効果を強くすると遅延も大きくなりますが、タッチパネルでの線ヨレも完全に除去できるなど、効果も絶大です。以下のパラメータを自分で調整し、自分の感覚に合った設定を探すのも面白いでしょう。遅延処理タイプは常に今のペン先に向かってストロークが進行しますが、慣性運動タイプではストローク自体に加速度運動がついています。通常は慣性運動の方が滑らかになると思われますが、操作しやすい方でどうぞ。筆圧の遅延補間の変化硬さストローク変化が有効な時、筆圧の変化もストロークに合わせて遅延します。遅延から追いつくときに、どのようなカーブを描いて筆圧が変化するかをここで設定できます。追従割合(遅延追従用)一回のポイント処理で、どの程度の割合、遅延したストロークからペン先まで移動するかをここで指定します。ここで指定した値が大きくなるほど遅延は少なくなります。(遅延追従用)追従割合により計算した移動距離が、ここで指定した最低速度より小さい場合、この最低速度に合わせます。加速度の加算量(慣性運動用)加速度の強さを指定します。ここで指定した値と、現在のストロークからペン先までの距離を乗算したものが、加速度の強度になります。空気抵抗(慣性運動用)慣性運動にかかる抵抗値のうち、現在の速度に比例して大きくなる抵抗値を指定します。摩擦抵抗(慣性運動用)慣性運動にかかる抵抗値のうち、速度に関係ない抵抗値を指定します。はらい制御用パラメータストローク変化では遅延している分のストロークを、ペンが離れた時点で自動的に生成する機能があります。これを”はらい”と呼んでいます。はらい部分ではストローク末端に向けて筆圧が0になるようなカーブを描き、さらにそれまでのストロークの回転に合わせてはらい部分も自動回転します。はらいの長さはらいの長さを指定します。1が標準で0だと完全になくなります。はらいの曲率減衰Knot自動生成毎に、この割合だけ回転を減衰させます。はらいの方向補正はらいの向いている方向を、実際のペンストロークの最後に払った方向に向かうよう補正します。Knot自動生成毎にここで指定した割合だけ補正されます。・Knot生成ストロークの制御点を指定した一定間隔で生成することで、滑らかにします。通常タッチパネルでは16ms前後間隔で頂点座標が送られてきます。Paintはこの頂点座標をそのままストロークの制御点として扱っていましたが、ここでKnot生成することができるようになりました。指定した一定時間や一定距離間隔でKnotを生成することで制御点を減らし、見かけ滑らかな線にすることができます。(ただし、特に一定距離での生成を指定した場合、細かなカーブ表現はできなくなります)以上です。相変わらず非常に調整項目の多いツールになりました。こだわる人は好みの設定になるよう調整してみてください。Paintのv1.00を公開してから、今日で(この記事公開は一日遅れましたが)ちょうど一年になります。Paintを作っていたのか、どうしてこんなツールになったのかを、ここで出来る限り思い出し、振り返ってみたいと思います。EfT版のアプリ内課金が比較的高い理由についてもその流れの中で説明します。ウザくて泥臭い自分語りになっています。Paintに連なる、Androidでのアプリ開発を始めたのは2012年4月のことです。それまでフリーのゲームプログラマーとして色々な会社を転々としていた私ですが、とあるエンタメ系ネット企業(微妙な言い回し......)の外注仕事がクライアントの組織改編の都合(?)で三ヶ月弱で打ち切られることになり、その仕事の後に始めたのがAndroidアプリ開発ということになります。それまではコンシューマ系ゲーム会社でプログラマーとして仕事をすることが多かったのですが、市場規模の推移を見れば一目瞭然、昨今そんな仕事は殆どありません。(あるとしてもパチスロ組み込み系が殆ど。それもその頃はすでに落ち目)そもそも私自身が据え置きコンシューマ系ゲームをやらなくなって久しいので、自分が楽しめない業界の仕事を無理してやってもなぁ......というのが本音でした。Vita用のアプリ制作チームでした。職歴はちょっとした事では振り払えないものです。(完全に違う業界に行けば別でしょうが)その会社の外注仕事が2012年3月末で終わり、次の仕事はどうするかと考えた時に思い出したのが、その会社の人事というかディレクター系の人に連絡を取って最初に話して痛感したことでした。新しく仕事を探すには相手にわかりやすいよう、自分の技術力を示す個人としての作品を作っておいた方がいいな、ということです。その頃の流行りと言えばDeNAやグリーです。据え置きコンシューマ系畑の人間として、iモード等携帯アプリの仕事なんかはあまりにもつまらなく思え、それまで蹴っていたのですが、昨今はスマートフォンなどというものが流行っていて、近い将来かなり本格的なゲームがスマートフォンで動くようになるだろう......という予想もありました。それならツテを辿ってiPhoneやAndroidの開発をしている会社に......と普通はなるんでしょうが、そこでさっきの「何か作品を作っておいたほうが話が早いのではないか?あらかじめ少しは環境に慣れておいた方がいいのではないか?」というような考えが浮かんできて、スマホなら自分一人で開発環境も揃えられるし、なんか軽く簡単なゲームでも作ってから、改めて仕事を探すか......ということになったわけです。Android開発当初とりあえず一人で作れるゲームでスマホ向きなもの・・・ということで色々考えた末に、比較的グラフィックパーツが少なくてもそれなりのゲーム性が確保できるストラテジ系のゲームにしてはどうだろうと考えました。最初はターン制で、その後操作に慣れたら徐々にリアルタイム性を採り入れて操作とゲーム難易度を上げていく・・・そんな感じです。当たりをつけてAndroidの開発環境を見てみると、UIまわりで環境整備されているのはJavaでの開発だけで、しかもJavaを使うと重すぎてゲームにならないということがわかってきました。C++など、いわゆるネイティブ言語と呼ばれる環境と比べると、場合によっては数百倍の速度差が出るし、JavaでOpenGL(3D表示用のAPIですが、2DでもGPUを叩くときに使う)を使うと定期的にガベージコレクションが発生してカクカクするのです。一応AndroidにもNDKといってC/C++で開発できる環境が用意されてはいるのですが、これは本当にむき出しの通常の開発環境だけで、Androidでのサポートライブラリは一切ありません。フォントを読みだして文字を表示することすら、すべて自前で用意しなければならない......そんな状態です。私は元々コンシューマ系ゲーム開発者で、そんな事はむしろあたりまえの世界でずっと生きてきたので、そこでは臆しません。いうわけで、C/C++の環境で、フォント表示や簡単なゲーム用のメニューやマップを動かせるようにしようという方針を立てました。そこから作るとなるとちょっとしたストラテジ系ゲームを作るということすら、かなり遠い目標になります。Paintを開発することになる決定的な瞬間だったと思われます。私は毎日テキストにその日やった作業を書き残すようにしています。そのテキストを検索してみると、メモ版の記述が最初に見つかったのは2012年5月11日でした。この頃にはすでにメモを作ろうという計画を持っていて、プロジェクトを作ったということはCloverMemoというアプリ名もこの辺りで決定していたものと思われます。4月頭からなので1ヶ月と11日で、OpenGLを使ってキャンバスを表示し、ピンチ操作を実装するところまで作っていたようです。その後メモ版がリリースされるのは11月29日なのですが、Paint版も作ろうという方針が決まったのはそのだいぶ前で(前述のテキストで最初にPaint版に関する言及があらわれたのが8月20日なので)8月頃のようです。これにはメモを作っていてそれが結構面白くなってきたのと、Androidで個人開発の有料ペイントアプリが結構売れていた(LayerPaintがその頃すでに1万本程度売れているのを見た)ことが大きく影響しています。(まあこれに関してはかなり見通しが甘いということが後からわかりますがそれはまた別の話)そんなわけでPaint版のプロジェクトを作り、メモ版が形になってくるにつれてそろそろ公開に向けて色々準備しようかなということでTwitterを始めたのが2012年9月15日頃だったようです。Paintが基本ポートレイト固定だったり、Androidの標準UIを完全に無視していてすべてOpenGL自前描画だったりするのは、別に移植性が~とか、そういうことを考慮したわけでは全くなく、単に最初はゲームを作るつもりだったから、ということです。ウインドウを半透明表示したり、かなり凝ったUIを自由に作れることに繋がったので結果オーライですが。アプリリリース後メモ版アプリをリリースしたのは2012年11月29日、その後Paint版をリリースしたのが一年前の2013年の1月19日なのですが、開発当初、私が使っていた端末はN-05Dという、普通の4インチサイズのスマホでした。HDを買いましたが、これももちろんデジタイザーには対応していません。N-05Dは指の触れている面積等で変化する静電容量を筆圧として渡してくれるようで、それを使って一応筆圧だけはメモ版公開当初から対応していました。10.1を使っているんだが、スタイラスのボタンに対応できないか?」というものがありました。(初代)を買ったのが、2012年の年末~2013年始頃です。