春先に「コップのフチ子さん」というガチャポンのフィギュアにハマって集めているうちに、運良く「コップのフチ子さん」ファンブック という本にマンガを描く仕事が舞い込んで来ました！

» 「コップのフチ子さん」ファンブック [単行本]

それにしても日本人って、小さいマスコットフィギュアが好きですよね。古くは江戸時代の「根付」に始まって、現代では携帯ストラップやイヤホンジャックマスコットなどなど。世界中見回しても、大人向けに小さいフィギュアをガチャポン（自販機）で売っている国なんて日本くらいでしょう。

ミニチュア収集の趣味はヨーロッパにもありますが、それは特定の趣味人が集めているだけで、子供から老人までくまなく、持ち物にマスコットフィギュアを付けるという文化は日本にしか無いと思います。

小さくてかわいい物を「いとおしい」と思う心が、日本人のDNAには刷り込まれているのかもしれないですね。

こんにちは、ウェブテクノロジの遠藤美樹です。

2013年7月3日～5日に東京ビッグサイトで開催される「第1回 コンテンツ制作・配信 ソリューション展」に、出展します。

この展示会は「デジタルコンテンツを『作る』『管理する』『届ける』『見る・遊ぶ』ためのソリューション」の展示が目的なので、これまで「既存のキャラクターをコミPo! のデータにしてほしい」という引き合いが多かった、マンガ作成ソフト「コミPo!」にとってはうってつけ！ということで、出展を決めました。

その他にも、アニメキャラを自在に動かして生放送ができる「ライブアニメ」や、ライブ壁紙を、簡単・手軽・無制限に作成できるASP サービス「ライブ壁紙メーカー」も出展しますので、自社のキャラクターやコンテンツの活用をご検討の方は、是非ブースにお立ち寄りください。

そして今回、もうひとつの目玉は、スマートフォンアプリのマルチプラットフォーム向け開発ソリューションACORN（エイコーン）を初めて公開することです。

ACORN とは英語で「どんぐり」という意味でちょっとした思いを込めて名付けました。ACORN はスマートフォンアプリの開発において難航しがちな、Android・iPhone/iPad という二つのプラットフォーム用のアプリリリースを、スムーズに実現するソリューションの総称です。マルチプラットフォームに対応したスマートフォンアプリ用のUIガイドラインを規定し、それに則してワンソースで開発を行うことにより、短納期・低コストでのアプリリリースを実現することができます。

当社は今でこそ、自社製品・サービスを多くリリースしておりますが、元々は受託開発からスタートした会社であり、今でも時代の流れを感じることを意識しながら受託開発も一つの柱としています。そんな中で、スマホアプリ開発においてお客様のコマッタが、Android とiPhone/iPad というプラットフォーム間にある様々な仕様の違いにありそうだと考えました。なかでもメニュー周りのUI は二つのプラットフォームごとに変える必要はなく、重要なのはアプリ本体であることが多いと思います。そこで、アプリ本体のクオリティはそのままに、メニュー周りのUI に注目し、Android とiPhone/iPad で共通なUI を共通のソースで実現することをめざしました。「開発者・クリエイターさんの面倒だと思うところをツールでフォローして、縁の下でアプリ本体の作成のお手伝いをする」というウェブテクノロジの思想をもとにしたソリューションです。

当日は、ACORN のガイドラインに則して開発した、写真を見るためのアプリを展示します。このアプリは、AndroidとiPhone/iPad 用でまったく同じソースで、同じ動作を実現しています。是非、お立ち寄りいただき、デモンストレーションアプリをご体験下さい。

ACORN（エイコーン）の名前の秘密は、またの機会にお知らせします。

なお当日は、しっかりと打ち合わせができるように、専用スペースを確保しています。
現在、スペースでの打ち合わせスケジュールを調整しておりますので、当日ご来場の予定があり、当社のソリューションにご興味がある方は、お気軽に遠藤美樹宛にご連絡ください。優先して打合せスペースの確保に努めます。

去る5月18日、IGDA東北支部主催のゲーム制作イベント『FUSE06』が福島県郡山市で開催されました。
信じられないことに、この『FUSE』は”ほぼ”毎月行われており、なおかつ”６時間”という超タイトなスケジュールでゲーム制作をするという大変過酷なゲーム開発イベントです。

弊社では２ツ前の『FUSE04』より、2Dアニメーションツール「OPTPiX SpriteStudio」のライセンスをご提供しておりますが、今回は会場にお邪魔しまして、”OPTPiX SpriteStudio”の使い方についてかんたんなご説明のお時間を頂戴しました。

こちらが会場の国際情報工科大学校。郡山の駅から徒歩５分か１０分くらいの場所です。

参加者の皆さんは気合十分！　何しろ”ほぼ”毎月行われているゲームジャム、常連の方も沢山いらっしゃるそう。

今回、”OPTPiX SpriteStudio”をお使いいただいたチームは２チーム。

サンプルデータのコミポちゃんが新幹線の上に！　なんかハドソンのチャレンジャーの１面風？

燃え上がる町並み、ってなんかパニック大作っぽいんですが。

『FUSE』は他のゲームジャムと比較して、その制作時間が”６時間”と大変短い！　にも関わらず、ちゃんと「OPTPiX SpriteStudio」がお役に立てたことでまず一安心、また今回直接会場にお邪魔出来たのはウェブテクノロジにとっても良い経験になりました。なので是非次も・・・と思いましたらば、次回の『FUSE07』はなんと来週！

　→ 『FUSE07』

流石に毎月会場に、というのは難しいものの、『FUSE』参加者の皆様には引き続き「OPTPiX SpriteStudio」のライセンスをご提供いたしますので、ふるってご参加ください。

※『OPTPiX SpriteStudio』は各種ゲームイベント向けに積極的に協賛していきたいと考えております。イベントをご計画の折にはお問い合わせください

こんにちは、はじめまして。昨年末からOPTPiX SpriteStudioの開発チームに参加しているR&D部 黒岡です。

OPTPiX SpriteStudio は、あらゆるゲーム開発環境に適合する、超汎用2Dアニメーションデータ作成ツールですが、その真価はデータ作成ツール(本体)の使いやすさだけではありません。

ゲームエンジンであるUnity、Cocos2d-x、Corona SDKをはじめ、HTML5、iOSなど、多様なゲーム開発環境に対応した再生モジュール(プレイヤー)であるSpriteStudio Player が提供されていることも、大きな特長です。

SpriteStudioは、可読性の高いXMLデータや汎用的なバイナリデータを出力し、SDKも提供していますので、ユーザーサイドでターゲットとするプラットフォームやゲームエンジン向けのプレイヤーを開発することも比較的容易です。

しかし、より手間をかけずにターゲット上でいますぐアニメーションを表示したい！というユーザーさんの声に応えて、OPTPiX SpriteStudioでは、プレイヤーを大幅に拡充しています。

SpriteStudio Playerは、主要なゲームエンジンに対応

SpriteStudio Player は、以下のプラットフォーム(ゲームエンジン・OS)上での2Dアニメーション表示に対応しています。

• Unity
• Cocos2d-x
• Corona SDK
• HTML５ – JavaScript + Canvas / JSON + JavaScript + Canvas
• iOS Objective-C
• C言語用SDK(SpriteStudio SDK)

なお、それぞれのプラットフォーム毎に「表現できる／表現できない」機能がありますので、SpriteStudio本体で可能な表現が100%再現できるわけではありません。

そのため、各プラットフォーム向けに、SpriteStudio上で使用可能な機能の制限をかけられるようになっています。

機能制限はカスタマイズも可能ですので、アトリビュートが少ない最適化された状態のデータ出力も可能です(そのデータを読み込む場合、カスタムローダを作成する必要があります)。

エンジン側のアップデートでサポートされる機能が増えた場合は、SpriteStudioとプレイヤー側でもアップデートを行い、制限を解除する予定です。

作成した2Dアニメーションデータを複数のプラットフォームで利用する場合には、より制限の厳しいプラットフォームに準じたデータを作成しておくのが普通です。

ただ、ひとつのアニメーションデータを使って、機能が豊富な上位のプラットフォームではリッチな表現に、下位のプラットフォームではシンプルな表現をしたいという場合も考えられます。

SpriteStudio Playerでは、各プラットフォーム用にデータをコンバートする時点で非対応データを削除しますので、適用するプラットフォームの機能制限を熟知した上であれば、ひとつのアニメーションデータで済ます工夫も可能でしょう。

プレイヤーの主な特徴

SpriteStudio Playerは、順次改良を行っています。現時点での各プレイヤーの主な特徴は以下の通りです。

SpriteStudio Player は無償配布中

SpriteStudio Player と、各コンバーター、サンプルデータは下記ユーザーサポートページから無償でダウンロードできます。
» http://www.webtech.co.jp/spritestudio/ss5user/

OPTPiX SpriteStudio本体の無料トライアルも可能ですので、オーサリングから各プラットフォームに実際にプレイヤーを組み込むまで、一連の評価が無償で行えます。不明点がありましたら、お気軽にお問い合わせください。

ところで、個人的にはHTML5用コンバータのJSON出力は、JavaScript以外の環境でも使いやすいのでは、と思っていたりします。

ざっくりと各プレイヤーのご紹介をしたところで、次回はお問い合わせが最も多いUnity用 Playerの紹介をさせていただく予定です。お楽しみに！

子供のころから、ずっと不思議に思ってました。ステテコに腹巻きのオジサンファッション。寅さん、バカボンのパパ、丹下段平、じゃりン子チエのテツ、カトちゃん。揃いも揃って、みんな同じファッション。

しかも、私の世代では、結構な確率で父親があのファッションをしていました。そう、架空のキャラクターのみならず現実の、しかも身近な父親が、あんなおかしなコーディネイトだったんです。

いったい、なぜなんだ？

さてさて、私も51歳になりまして、その体も色々と経年劣化してまいりました。まず、40代後半くらいから、冬になると足（特に太もも）が異常に冷えるようになりました。そして50歳を過ぎると、ご多分に漏れず腹がせり出してきました。しかも、最近は足と同様にせり出したお腹が冷えるようになってきました。きっと若い頃に比べると体温調節がうまく出来なくなってきたんだと思います。

そんなわけで、下半身には股引（関西で言うところのパッチ）やステテコっぽいものが必要になり、お腹の冷えを押さえるために腹巻きが必要になりました。

・・ということで、気がつくと私も「バカボンのパパ」ファッションになっていました。

こうなってみて長年の謎がようやく解けたのです。あのコーディネイトは、初老の体が必要としていたからこそ、たどり着いたものなのだと。

さすがに最近のステテコっぽいものや、腹巻きっぽいものは、昔のそれとは違って見栄えが良くなっていたり、腹巻きも目立たない厚みだったりしてスーツの下に着ていてもわからないのですが、やっぱ自分もそういう年齢に、そういう体になったのだな、とため息をつきながら考える今日この頃であります。

こんにちは。ウェブテクノロジ　R＆D部の黒岡です。
前回のエントリーで予告させていただいた通り、今回はOPTPiX SpriteStudioで作成したアニメーションデータをUnityで再生するためのプレイヤーライブラリ SpriteStudio 5 Player for Unity をご紹介いたします。

Unity アセットストア公開版とWeb公開β版の違いについて

Unity アセットストアには、以前からSpriteStudio 4対応のプレイヤー(以下、SS4Player)が公開されていますが、今回ご紹介するSS5Playerは、弊社ウェブページ上でβ版として公開しているUnity アセットです。

SS5Playerは、OPTPiX SpriteStudio 5の新しいファイル形式(.sspj)に対応し、以前からご要望をいただいていた GameObjectとコライダへの対応を行っていますが、必ずしもSS4Playerを置き換えるものではありません。小さいアニメーションを数多く表示したい場合には、SS4Playerのほうがパフォーマンス面で有利です。目的に合わせてSS5PlayerとSS4Playerを選択、または併用していただくことが効果的です。

両者の差異の詳細については、今後の記事で補足解説いたします。
今回は、SS5Playerについて、アセットのインポートとアニメーションの再生までの簡単なチュートリアルをご紹介いたします。

パッケージのインポート

それでは、早速、アセットのインポートとアニメーション再生までをご説明します。

1. OPTPiX SpriteStudio ユーザーサポートページから「SpriteStudio5 Player for Unity （OPTPiX SpriteStudio専用Unityアセット β版)」をダウンロードします。
2. Unity上で、[Assets] → [Import Package] → [Custom Package] と操作し、インポートを行います。
   Windows環境では、ダウンロードしたファイルをダブルクリックしてもインポートできます。
   インポートが正しく終了するとProjectにアセットが追加されます。
3. OPTPiX SpriteStudioをインストールしていない場合は、サンプルデータ「OPTPiX SpriteStudio Sample」もダウンロードしてください。

図１　パッケージのインポート

アニメーションのインポート

Unity のProject にEditor, SpriteStudio というフォルダができているはずです。

図２　アニメーションのインポート

1. インポートするアニメーションデータを保存するフォルダを作成します。
2. フォルダを作成したら、そのフォルダを図2のように選択状態にして、[Custom] → [SpriteStudio] → [Import SS5(sspj)] を選択します(図3)。
   インポートは選択状態のフォルダの下に作成されますのでご注意ください。

図３　インポートメニュー

[Import SS5(sspj)] を選択すると、図4のようなダイアログが表示されます。

Collider-Thickness はSpriteStudio上で当たり判定を作成した場合に、その厚さを設定する項目です。
Attach Rigid-Body は、コライダを作成した際に同時にRidid-Bodyを追加するかどうかを選択します。
この設定で正しければ、[Import] を押してください。

図４　インポート設定ダイアログ

コンバート中のプログレスバーが表示されます。大きめのプロジェクトの場合はしばらくお待ちください。

図５　インポート実行中

正常に終了すると、選択したフォルダにアセットデータが変換され、格納されます。アニメーションデータの他にテクスチャとマテリアルも追加されます。

図６　アニメーションのインポートが完了

ここまでで、再生の準備が整いました。

アニメーションを配置して再生する

再生のための準備を行います。
２D表示用のカメラの配置から行います。このカメラは必ず使わなければ行けないわけではなく、サンプルとして必要最低限の設定をプリセットしたカメラアセットになります。自分で作成する場合、基本的にオルソにしておけば大丈夫です。設定値を参考にしてください。
まずは、同梱のカメラを使って再生を行ってみます。

図７　カメラを配置する

カメラをヒエラルキーへドロップして…。

そのカメラの子になるViewへインポートしたアニメーションデータをドロップしました。

今回は、animal02.sspj というデータをインポートしたため、animal02というデータをCameraのViewへドロップしました。

図８　ヒエラルキーへカメラをドロップ

これで、シーンにはインポートしたアニメーションデータが表示されています。シーンモードにしてViewへドロップしたanimal02をダブルクリックしてください。画面中央に表示が行われます。

図９　配置したアニメーションをダブルクリック

Cameraの子になっているViewについてですが、Viewは2D用のスクロールを前提としたカメラとなっていて、ViewのTransformを調整するとスクリーンの表示範囲が変更されます。ViewのTransformを調整するか、アニメーションキャラクターのTransformを調整してCameraPreviewに収まるようにしてください。

図10　アニメーションの配置

このとき、カメラをロックするとアニメーションをドラッグ操作で移動できるので便利です。

図11　カメラのロック

あとは、Unityの再生ボタンから再生を行うとアニメーションが動きます。

図12　アニメーションの再生

単純なワークフローで、インポートしたアニメーションを動作させることができました。

次回は、インスペクタの説明やパーツ制御、旧バージョンとの比較などを予定しています。

京都に出張しても「八つ橋」、大阪に出張してもやっぱり「八つ橋」。いよいよ自宅でも「八つ橋」を自作出来ないかと思っていたら家内が（樹脂粘土で）自作。セールス＆コミュニケーション部の浅井でございます。

さて今年もいよいよGTMF、皆様お待ちかねのツールとミドルウェアの祭典『GameTools & Middleware Forum』の季節！ しかも今年の弊社の大テーマには「Unity」！ 大変！

さァ大変なのは例年のことなので個人的に諦めるとして、今年のウェブテクノロジは、その Unity と小社謹製の2Dスプライトアニメーションデータ作成ツール「OPTPiX SpriteStudio」をテーマに、大阪の実力派ゲーム会社、ナウプロダクション様の学園ジュヴナイルカードバトル大作『サムライソウル』を彩る「こだわりエフェクトの裏側」をお届けいたします。

セッションタイトル

“サムライソウル” の 2D エフェクト術と、”OPTPiX SpriteStudio” 新トピック

この『サムライソウル』の裏側・・・ですが本年４月の Unity ユーザー向けイベント『Unite Japan』、大盛況だった小社セッションでご紹介したナウプロダクション様の2Dエフェクト術を更に！ 更に深堀り！！

・・・しつつ、同じく４月のリリースからコツコツとアップデートしてきた OPTPiX SpriteStudio の「今とこれから」、それに OPTPiX SpriteStudio の採用事例から、現在のゲーム開発環境トレンドをご紹介いたします。

また、セッションへご来場いただいた皆様には（アンケートと交換にはなりますが）ウェブテクノロジ名物の『謎の缶詰』を大配布ッ！ もちろんブースでは OPTPiX imesta 7、OPTPiX SpriteStudio の新機能もリリース前にいち早く大展示ッ！ もちろんGTMF2013は入場無料ッ！

ここここ、これは来ないと損！

というコトで皆様、お誘い合わせの上、是非GTMF2013へ。そしてウェブテクノロジブースへ！

大阪出張の手荷物がノートPC×２のiPad×１のスマホ×２。モバイルって何でしょうか。セールス＆コミュニケーション部の浅井でございます。

さてさていよいよ今週の金曜日！ に、皆様お待ちかねのツールとミドルウェアの祭典『GameTools & Middleware Forum』、略して「GTMF」の大阪会場が開催となります。
先日のエントリでもお伝えしましたが、小社の今年のテーマはUnity＋OPTPiX SpriteStudioと、さらに最新のユーザー事例とか今後のアップデート予定とかそーいう路線でお届け。

今年の主役は小社謹製の2Dスプライトアニメーションデータ作成ツール「OPTPiX SpriteStudio」をテーマに、ナウプロダクション様の学園ジュヴナイルカードバトル大作『サムライソウル』を彩る「こだわりエフェクトの裏側」をお届けいたします。

セッションタイトル

“サムライソウル” の 2D エフェクト術と、”OPTPiX SpriteStudio” 新トピック

セッションでは「関西を代表する老舗ゲーム会社の開発力」はもちろん、実はナウプロダクション様は、GTMFを通じて弊社と知らない間に昵懇、みたいな間柄・・・だったらしい、みたいなよもやま話をお送りする感じ。・・・なんですが、後者はともかく前者については本年４月の”Unity”ユーザー向けイベント『Unite Japan』でご紹介した内容を更に！ 更に深堀り！！ していただけるのでUnityユーザー、またはUnityで2Dゲームの制作を検討している方々には必見のセッション、でございます。

さて、このセッションでは弊社からもOPTPiX SpriteStudioのここ１年のユーザー事例をピックアップ。ゲーム開発環境のトレンドを、Unity”軸”でご紹介しながら、ゲーム開発者の皆さんのバラ色の未来を応援すべく、OPTPiX SpriteStudio開発陣がイバラ色の毎日を送っていることをポジティブにご報告致します。

ええ。もう。

また、セッションへご来場いただいた皆様には（アンケートと交換にはなりますが）ウェブテクノロジ名物、そのままじゃ食べられないけど開けると食べられる『謎の缶詰』を大配布ッ！ もちろんブースではOPTPiX imesta 7、OPTPiX SpriteStudioの新機能もリリース前にいち早く大展示ッ！ もちろんGTMF2013は入場無料ッ！

ここここ、これは来ないと損！ あと来てくれないと枕元に立ちます。

というコトで皆様、お誘い合わせの上、是非GTMF2013へ。そしてウェブテクノロジブースへ！

“軸”、といいますと独Cherry製の「黒軸」を愛してやまないセールス＆コミュニケーション部の浅井でございます。

7/19（金）のKKRホテル大阪、そして7/23（火）にはUDX秋葉原と２回に渡り開催されました、ゲーム開発ツールの祭典「Game Tools & Middleware Forum」ことGTMF、無事に開催終了しましたことをお知らせいたします。ご来場、誠にありがとうございました！

本年から開催場所が変更になったということで、ドキドキしていたのですが・・・

大阪、東京会場ともに大盛況、で一安心。弊社ブースにはセッションのタイトル通りの「Unity”軸”」なご相談の他、HTML5→WebGL対応へのご要望、アーケードゲーム用開発ツールとしてのご相談などなど。

ご来場者も例年ですと法人格のゲームパブリッシャー・デベロッパーの方々が中心だったのですが、今年は特に個人でゲーム開発をされている、いわゆるインディーズゲーム開発者も多く、ゲーム開発に携わる、つまり我々ゲームツール・ミドルウェア業界が向きあわなければ行けない・やらなくてはいけないこと沢山あるんだなぁ、と改めて鬱、奮起するキッカケになりました。

また、大阪会場で初展示した「OPTPiX imesta 7」の新機能、「多ビットインデックスカラー（仮称）」にもご注目いただきました。

こちらについては現時点では参考出展にはなりますものの、今後の製品搭載にご期待ください。

さてさて、改めてご来場者の皆様に御礼申し上げますとともに、来月の「CEDEC 2013」では更に新ネタをご用意してお待ちしております。引き続き何卒よろしくお願いいたします。

おまけ：東京懇親会の様子

こんにちは、ウェブテクノロジ R＆D部の黒岡です。

本稿では、SpriteStudio Player for Corona SDK をご紹介します。OPTPiX SpriteStudio で作成したアニメーションを、Corona SDK 上で再生するためのライブラリです。

OPTPiX SpriteStudio のアニメーション再生ライブラリとしては、for Corona SDK のほかに、for Unity、for Cocos2d-x も提供しています。現状一番多いお問い合わせはUnity 関連で世間の需要を感じますが、最近はCorona SDK、Cocos2d-x についてのお問い合わせも少しずつ増えてきています。やはり、ゲームエンジンには向き不向きがありますので、それぞれのゲームエンジンの特色がだんだんと理解されてきた結果ではないかと思います。

SpriteStudio Player for Corona SDK は、Corona SDK に標準では搭載されていない親子構造を持ったアニメーションを再生することができるので、スプライトシートの画像枚数、サイズ削減に効果があります。効果的に活用することで、1画面あたりのメモリー消費量削減、ひいてはアプリケーションサイズの削減が可能になります。

Corona SDKとは？

ここで、Corona SDK についてあまりご存知ない方のために、ざっくりと特徴をご紹介いたします。

» Corona SDK 公式ページ

スクリプトベースのマルチプラットフォームの開発環境である

• iOS、Android、Kindle、nook 向けにパブリッシュ可能なマルチプラットフォーム開発環境です。
• Windows 上、MacOS 上での開発が可能です(iOS でのパブリッシュにはMac が必要です）。
• 言語には Lua を採用しているので、C/C++ や JavaScript をはじめとしたスクリプト言語をお使いの方なら習得は容易でしょう。

２Dが得意

• 2Dのスプライトまわりの実装が充実していて内容も素直なため、2Dベースのゲームであれば迅速な開発が可能です。
• アニメーションに関してはスプライトシート形式のアニメーション再生をサポートしています。
• 物理エンジンとして Box2D を採用しており、2D環境下での物理エンジン使用が簡単に行えます。

開発環境の構築が簡単

開発環境のインストールはとても簡単でコンパクトです。

このことは、結構重要なことだと思っているのですが、開発を始めるにあたって、あれもこれもインストールしなければならないという面倒はありません。ビルドはクラウドサーバー上で行われるので、ビルド環境を作成しなくても開発可能です。また、ローカルにビルド環境が無いと困る場合（自動ビルドをしたいとか、独自の拡張をしたい場合）、ローカルでコンパイルできるライセンスがあるようです。

標準の IDE としては Corona Project Manager が用意されており、SDK の tools フォルダに含まれていますが、ちょっとクセがあるので私はテキストエディタでサクサク書くのが気持ちいいと思います。

環境構築で結構時間を使うものもあるので、アプリ開発がサクッと始められる環境というのはメリットがありますね。

ライセンスについて

昨年までは、パブリッシュを行えるライセンスには年間費用がかかっていましたが、現在は無料でパブリッシュできるライセンスがありますので、個人ユーザーにも使いやすいでしょう(ただし、無料のライセンスを使用する場合は、前会計年度の売上による制限があるのでご注意ください)。
同様の取り組みはUnityも始めていますので、インディーズ向け普及強化の動向を感じます。

SpriteStudio Player は何を拡張するのか？

なんだか Corona SDK 自体の説明になっているのでこの辺から軌道修正をして、SpriteStudio Player for Corona SDK (Corona SDK 用プレイヤーライブラリ)の説明に移りたいと思います。

小さなスプライトアニメーションならば、Corona SDKが標準で備えるスプライトシートを使ったパラパラマンガ方式のアニメーション表示でも良いと思いますが、以下の条件であれば親子構造アニメーションの採用をお勧めします。

• コマ数が多いアニメーション
• アニメのパターン、バリエーション数が多い場合

どちらもスプライトシートのみでデータを持つと、アニメーションの種類が増えるごとにデータが大きくなってしまいます。アプリのファイルサイズの増大を招きますし、メモリ容量の少ない環境では、一度にロードできるパターンに制限が出てきてしまいます。

画像パーツを組み合わせ、パーツに親子関係を持たせて、回転や移動を駆使したアニメーションを構築できると、アニメーションのデータ容量が大幅に削減できます。SpriteStudio Player は、そのような親子構造アニメーションの実装を手助けするライブラリです。

Corona SDK に組み込む方法

Corona SDK は既にインストールされているものとして解説いたします。

SpriteStudio Player for Corona SDK は、弊社の OPTPiX SpriteStudio ユーザーサポートページからzipファイル形式でダウンロードできます。本記事執筆時点では「SpriteStudio Player for Cocos2d-x/CoronaSDK/HTML5 (2013/7/30)」という名称になっています。

ダウンロードしたzipファイルには、Corona SDK の Lua ソース内で使用する「再生ライブラリ」と、OPTPiX SpriteStudio の出力データを変換して Corona SDK 用の再生ライブラリで使用できる形式に変換する「コンバーター」が格納されていて、それぞれ展開したフォルダの以下のパスに入っています（zipファイルには他にもHTML5用、Cocos2d-x 用ライブラリが含まれていますが、今回は Corona SDK のみ解説いたします）。

コンバートの準備　アニメーションの作成からデータのエクスポートまで

OPTPiX SpriteStudio をお持ちでなく、サンプルデータで検証を行う場合は、「シーンへアニメーションを追加する」までお進みください。

OPTPiX SpriteStudio で作成したアニメーションを SpriteStudio Player で再生するには、.ssax 形式でエクスポートを行う必要があります。以下、順を追って操作を説明します。

1.プロジェクトの設定

エクスポートの前に、何度か作業を繰り返すときに便利なプロジェクトの設定を行います。

図１　プロジェクトの設定

開発メンバーでもよく間違うので、念のため……。

図２　SpriteStudioの設定

「プロジェクトの設定」→「一般」→「エクスポート」で、「アニメーションデータのフォーマット」を「SSAX」に変更します(図3)。

図３　エクスポート内容の変更

基準フォルダも変更しておきましょう(図4)。これを行っておくと、都度、出力フォルダを設定する必要がなくなります。

図４　エクスポート先の変更

プロジェクトの下の ssax というフォルダへエクスポートされるように設定しました。お好みで、export や out などのフォルダ名にしても結構です。

2.エクスポートを行う

メニューの「プロジェクト」→「エクスポート」を選択します(図5)。

図５　エクスポートを選択

エクスポート画面となりますので、エクスポートするアニメーションを選択して[OK]を押します。

図６　エクスポートダイアログ

エクスポートが完了すると、出力したフォルダが開きます。.ssax ファイルが作成されているはずです。

3. コンバーターを使用して、.ssax ファイルから .lua ファイルに変換

コンバーターを使用して、.ssax ファイルから、アニメーション再生用のテーブルが記載された .lua ファイルに変換します。

ダウンロードした zip に含まれているコンバーターは、コマンド プロンプト (Windows)、またはターミナル (MacOS)上で動作します。展開したフォルダの CoronaSDK\Converter\ に mac と win のフォルダがありますので、環境に応じた実行バイナリをご使用ください。

SsToCorona(.exe) はオプションをつけて実行することができます。

SsToCorona(.exe) <入力ssaxファイル名> [-h] [-o <出力luaファイル名>] [-e UTF8|UTF8N|SJIS] [-i <入力ssaxファイル名>] [-v]

カレントフォルダ以下に AnimeData フォルダがあり、その中に ssax ファイルがある場合のコマンド記述のサンプルです。

Windows

SsToCorona.exe AnimeData¥*

MacOS

SsToCorona AnimeData/*

コンバーター (SsToCorona) を実行すると、入力ファイルと同じフォルダに.lua ファイルが作成されます。

シーンへアニメーションを追加する

前項で.ssax ファイルからコンバートを行い、アニメーション再生用のテーブルが記載された.lua が作成できました。この.lua をインポートして、目的のシーンで再生を行います。

コンバーターで作成した.luaファイルを、アニメーション再生を行うluaソース中でrequireし、SpriteStudio Playerのオブジェクトへ渡すことにより再生を行います。

図７のようなファイルがあることを前提に説明を進めます。

図７　プロジェクトのフォルダ構造

1. SsPlayer を require し、SsPlayer.new() でオブジェクトを作成します。
2. 作成した SsPlayer のオブジェクトに対して、ssplayer:addAnimation でアニメーションで使用しているイメージファイルをアニメーション管理へ登録し、
3. ssplayer:newObject() で再生用のオブジェクトを作成し、setAnimation( アニメーションデータ名) でアニメーションを割り当てます。
4. 割り当てた後の、Player オブジェクトへ play() を発行すると再生が開始されます。

サンプルソースコードとしては下記のようになります。

require('SsPlayer')

require('data.Samples.robo.robo_04')


-- SsPlayerのオブジェクトを作成します
local ssplayer = SsPlayer.new()

-- 使用するアニメーションを登録します
-- ここでイメージが読み込まれ内部に保管されます
ssplayer:addAnimation( robo_04_animation, robo_04_images, "data/Samples/robo/" )

-- アニメーションオブジェクトを作成します
-- 返されるオブジェクトは DisplayObject として扱えます
local robo = ssplayer:newObject()
robo.x = 150
robo.y = 150

-- 再生するアニメーションを設定します
robo:setAnimation( robo_04_animation )
robo.loop = 10            -- アニメーションを10回ループ再生（0で無限ループ）
robo.timeScale = 1.0    -- アニメーションの再生スピード

-- アニメーション再生開始

robo:play()

このプログラムを Corona Simulator で読み込み、実行すると、座標(150,150)にアニメーションを再生します。

図８　Corona Simulatorでの実行

また、アニメーションオブジェクトの frame プロパティに表示したいフレーム番号を直接指定したり、transition との組み合わせも可能です。

transition.to( robo, { time = 2000, x = 800, frame = robo.numFrames - 1 })

 とすると、最終フレームを表示し、２秒かけてx座標=800へ移動を行うことになります。

再生ライブラリで使用できるメソッドは、Sample\simple\main.lua と SsPlayer.lua にコメントとサンプルを記載していますので、併せてご参照ください。

Corona SDK が標準でサポートしているスプライトシート方式アニメーションでは、コマ数やサイズの大きいアニメーションの場合、テクスチャサイズが問題になりますが、SpriteStudio Player を使用すると、少ないテクスチャサイズで表現豊かでバリエーションの豊富なアニメーションを表示することができます。

Corona SDK 上でリッチなアニメーション表示を行いたい方は、ぜひサンプルを動かしてその良さを体験してみてください。

Twitterなんかでさんざん言っているのでご存じの方も多いかと思いますが、生まれて初めて「同人誌」なるものを作りました。宇宙戦艦○マト2199を松本○士先生タッチで描くという無謀な企画です。まぁ、同人誌ということで関係各者様には広い心で見ていただければ、とひたすら祈るばかりです。

・・・んなワケで、昨日までは松本タッチの習得・修練に全力を注いでいたのですが、ようやく入稿の運びとなり、なんとか一段落つきました。

ところがなんと、今日からは、ちば○つや先生のタッチの習得というあらたなミッションが待っています。・・というのも、秋くらいに「あし○のジョー」関連の本にマンガを描くことになりまして、ジョーや丹下○平を短期間でマスターしなければならないのです。

それにしても、松本タッチとちばタッチ、真逆と言ってもいいくらいベクトルの違う絵柄を両方とも習得できるのでしょうか？

いや、やらねばなりません！マンガ界の清水ミチコを目指すからには、やらねばならんのです！

夏、と言えばここ数年、毎年のようにノートPC用クーラーを購入しているのがウェブテクノロジ・コムの浅井です。如何にノートPCが軽量化されても、ノートPCクーラー持ち歩いてたら無意味だなぁ、とか思いながらつい、買っちゃうんですけれども。

さて夏。ゲーム業界人の夏、と言えば左様『CEDEC』！　ということで昨年に続きまして今年も弊社、ウェブテクノロジはブース出展だけでなく、スポンサーシップセッションを！　そしてなんと公募セッションの２本立てで今年のCEDECに大参加、いたします。

まず、昨年にひき続いてのスポンサーシップセッションでは・・・

スポンサーシップセッション　8月22日(木) 13:30～14:30

『ゲーム開発手法の転ばぬ先の杖
～ “OPTPiX SpriteStudio” で作る、無駄にならない2D資産の作り方』

・・・転ばぬ先の杖？ 無駄にならない2D資産？
ゲーム開発だけに限った話ではないですが、物事を進める上で無駄が出るのは当然。トラブルも当然。しかしながら、無駄とトラブルを減らす・避けるのに、他社はどうやってるんだろう？ というのはゲーム業界の関心事。
本セッションでは、『OPTPiX SpriteStudio』のユーザーヒアリングの中で得た「大量の聞きかじり」をサマリー。そのサマリーをTipsに纏めつつ、スペシャルゲストとして株式会社ドリコム様にお越しいただきながら、実開発現場のナレッジとワークフローをご紹介いたします。

続いて、弊社エンジニアによる公募セッションでは・・・

公募セッション　8月23日(金) 13:30～14:30

『工程の手戻りを最小限に 圧縮テクスチャ(PVRTC・DXTC・ETC)における傾向と対策』

「工程の手戻り」という単語にピン！ と来る方もいらっしゃるのではないでしょうか。本セッションでは、かつてのコンソールと同じくらいのスペックになりながらも、通信インフラや Store の制限などで「より気にしなくてはならなくなった」テクスチャの圧縮にスコープ。

『テクスチャの圧縮の常識』を噛み砕きながら、それぞれの形式のメリットとデメリット、傾向と対策を。アーティスト必見の数々のTipsをご紹介します。

スポンサーシップセッション・公募セッションともに、『CEDEC』らしく！
そしてもちろん弊社のブースでは、

OPTPiX SpriteStudio

• アップデートVer.5.x.0
• ついに『あれ』をコンバートしてインポート
• 超汎用が更に超汎用に。XXX公開

OPTPiX imesta 7 for Mobile & Social

• PVRTCの圧縮ノイズが消えた！ 『ClearPVRTC』

OPTPiX imesta 7 for Amusement & Embedded 新製品

• インデックスカラー進化系！ 『多ビットインデックスカラー』

などの最新機能・製品をご覧いただきます。

さて色々なネタを詰め込んだ「CEDEC」ですが会場・事前登録情報は、以下！

• CEDEC2013公式サイト
• CEDEC2013受講申し込み
• CEDEC2013会場アクセス

ということでふるってご参加、お待ちしております！

ウェブテクノロジ代表の小高です。
CEDEC2013の2日目(8月22日)に行われたセッション「工程の手戻りを最小限に　圧縮テクスチャ(PVRTC・DXTC・ETC)における傾向と対策」の発表資料を公開いたします。

この発表資料は、登壇した二人(黒岡、上田)はもちろん、社内のデザイナー(ゲーム業界出身者)と小高の4人で、かなり時間をかけて準備しました。開発現場での経験知と理論を融合させながら、わかりやすく解説してみたつもりです。また、なるべく実際的なサンプル画像を用意するよう努力しましたが、一部時間切れで抽象的なサンプルを用いたところもあります。ご了承ください。

この内容を理解していただくことで、試行錯誤を減らし、より美しい画像表現を実現することのお役に立てるとすれば、頑張って準備した苦労が報われます。

アジェンダ

• 圧縮テクスチャの必要性
• 圧縮テクスチャの注意点
• DXTCの傾向と対策
• PVRTCの傾向と対策
• ETCの傾向と対策
• 16bitカラーの検討
• 最後に〜⼿戻りを最⼩限に

セッションの内容

「何故この画像はこんなに汚くなっちゃったの?」と聞かれて返答に窮したことはありませんか？　本セッションでは、代表的なテクスチャ圧縮のアルゴリズム概説とともに、「実務上失敗しやすいポイントとその回避⽅法」「許容できないノイズが発覚したときに⼿戻りを最⼩限に抑えるテクニック」をご紹介します。 

受講スキル

• いざ圧縮してみたらぼろぼろの画像になってしまった経験者
• 圧縮テクスチャの作成指⽰、詰め込みの指⽰で困っている⽅

受講者が得られる知⾒

• 変質の原因を突き⽌め、他のスタッフへの説明や修正ができるようになります
• 効率的に圧縮テクスチャの最終出⼒をコントロールすることができるようになります

対象プラットフォーム

コンシューマゲーム機全般、スマートフォン、タブレット、PC

　毎度お世話になっておりますし、まだお世話になっていない方には引き続きお世話になって行きたい。セールス＆コミュニケーション部の浅井(腰痛)でございます。

　さぁ今年もCEDECの季節がやってきたんですが無事に終わりましたことをご報告いたします。ご来場の皆様、暑い中にありがとうございました。（Ustreamで御覧頂いた方もありがとうございました）

　さて今年の弊社は昨年につづいてのスポンサーセッションの他、公募セッションも。スポンサーセッションでは、我々が『OPTPiX SpriteStudio』のマーケティングをする上で肌で感じてきたゲーム業界の現状、それに開発者の皆さんが陥りがちな「右往左往」な事例を匿名でご紹介いたしました。

スポンサーセッションと言うわりには「らしくない」前半だったのですが、中盤からは本セッションの主役である株式会社ドリコム様から「Cocos2d-x」と「OPTPiX SpriteStudio」、それにドリコム様謹製の内製ツールを使ったワークフローご紹介いただき、「右往左往しないための工夫」を、聴講者の皆さんにお持ち帰りいただけたのではないかな、と自画自賛する次第です。

　※自画自賛、しつつ相変わらずの機材トラブルに右往左往する姿は近々、動画で公開いたします・・・

　また、肝心の『OPTPiX SpriteStudio』の新バージョン、Ver.5.1.0についても情報を公開。社内でも対応したかった TexturePacker の他、 Adobe Flash との連携も（機能的に限界がありますが）できるように。加えて、これまた近日のアップデートで搭載予定の「インスタンス機能」も好評でして、まだまだ『OPTPiX SpriteStudio』を発展させていきますよーという決意表明もした次第です。

　また、小社エンジニア陣による「公募セッション」では、そのテーマを『圧縮テクスチャ』としたことからか、セッション後、弊社ブースでも大分マニアックなご相談を沢山頂戴しました。（公募セッションの資料はこちらのエントリーで公開しております。）圧縮テクスチャについては、『OPTPiX imesta 7 for Mobile & Social』の「Clear PVRTC」を更に改良、加えて新しいテクスチャ形式などにも力を入れていきますので、どしどしご要望いただけますと幸いです。

　ということで改めてご来場、ありがとうございました！

私は耳が遠い。・・といっても年齢のせいではなく、昔から普通の人より耳が遠いようだ。

もっとも、健康診断で引っかかるほどではなく正常範囲内でギリギリセーフってくらいの遠さだと思う。なぜ、それがわかったかというと、大勢で会話するような機会に、私にだけ聞こえない会話があるのだ。

具体的に言うと、中にひとりだけ滑舌が悪かったり、声が小さくて聞き取れない人がいた場合、それが周囲のみんなにも聞こえていないんじゃなく、私にだけ聞こえていない、というケースが多いのだ。

仮に聞き取りにくいしゃべり方の人をAさんだとしよう。私以外の全員にAさんの言葉は聞き取れているようで、みんなは普通にAさんと会話している。でも、私にはAさんが何を言っているのかちっとも聞き取れない。

だからといって「Aさん、聞き取れません。もっとはっきりしゃべってください。」と何度も言うと場の空気を壊すので、しかたなく周囲に合わせて「そうだよね。」って言っていることが多い。

視力と違って、聴力って数値で表されることがない。（本当はあるのかもしれないけれど、日常で使うことは皆無である。）なので、自分がどのくらい耳が悪いのか、測るモノサシがないのであまり迂闊なことは言えないが、とにかく耳が遠いことは確かなようだ。

だから、音楽を聴く場合も、きっと私以外の人にはこの音楽は何倍もクリアに、奥深く聞こえているんだろうな・・と思うと悔しくなることがある。一度補聴器を付けてみればいいのだろうか？

こんにちは、開発の小野知之です。

Android アプリを開発するときに必要となる Android SDK には、AVD (Android Virtual Device) という、Android 端末のエミュレータが含まれています。スマホやタブレットの実機が無くても、PCの大画面上で簡単に動作確認やデバッグができるし画面キャプチャも撮れて、とっても便利！

・・・な、はずなのですが。

使ったことのある方ならご存知と思いますが、これが非常に「重い」のです。モッサリしていて反応も悪く、長時間の開発ではストレスが溜まります。そんなわけで結局、エミュレータを使わず、実機をPCに接続してUSB デバッグで開発している方も多いのではないでしょうか。

ところが実は、サクサク軽快に動作する高速な Androidエミュレータが存在します。しかも Android SDK で誰でも簡単に入手して使えるのです。意外と知らない方も多いようなので、ここでご紹介することにしました。

高速エミュレータとは

現在販売されている Android 端末のほとんどが ARM アーキテクチャの CPU を採用しています。一方、開発に使う PC や Mac の CPU は Intel x86(以下、x86 と表記。x64 含む)アーキテクチャです。従って、標準の Android エミュレータは、x86 CPU が ARM CPU をエミュレートした環境上で、ARM版Android OS が動作しているわけです。

これが、SDK 標準の Android エミュレータが重い原因です。

ところで最近の Android SDK では、Intel x86 CPU 搭載端末をエミュレートする Android エミュレータが用意されています。このエミュレータでは、開発 PC(x86)の仮想化機能を利用した環境上で、x86版Android OS が動作します。これなら、ほぼ実CPUの速度で処理が行えるので、無駄なく高速に動作しそうですね。

これが今回紹介する、Intel Atom (x86) Androidエミュレータです。

Intel Atom (x86) Android エミュレータの入手とインストール

それでは早速、その高速な Intel Atom (x86) Android エミュレータ (以下、「Intel エミュレータ」) をダウンロードしてインストールしてみましょう。

ここでは、開発に Windows 7 の PC で Eclipse を使用している場合を想定して手順を解説しますが、Mac など他の開発環境でも設定の参考になると思います。

1.「Android SDK Manager」を起動します。

Eclipse のメニューバーの「ウィンドウ」メニューにあります。

2.必要なパッケージをダウンロードします。

ダウンロードするのは、下記のファイルです。

クリックで拡大

• Intel x86 Atom System Image
  • Android の各 SDK バージョンのツリー下にあります。2013年8月現在、「2.3.3」「4.0.3」「4.1.2」「4.2.2」「4.3」用が用意されているので、必要なバージョンをダウンロードします。ダウンロードすれば自動的にインストールされます。
• Intel x86 Emulator Accelerator (HAXM)
  • Extras のツリー下にあるのでダウンロードします。こちらは、ダウンロードしただけではインストールされないので、このあと手動でインストールします。

3.「Intel HAXM (Hardware Accelerated Execution Manager)」をインストール

ダウンロードした「Intel HAXM (Hardware Accelerated Execution Manager)」を PC にインストールします。

まず、Android SDK のインストール先フォルダ下にある、下記のフォルダをエクスプローラなどで開いてください。

android-sdkextrasintelHardware_Accelerated_Execution_Manager

ここに「IntelHaxm.exe」というファイルがあるので実行します。インストールウィザードが実行されますが、特に設定の変更は必要なく、そのまま進めて大丈夫です。

これで、Intel エミュレータを使うための準備は完了です。

Intelエミュレータの使い方

では早速、Intel エミュレータを使ってみましょう。

使用するには、Intel x86 CPU をエミュレートする AVD を下記の手順で作成します。

1.「Android Virtual Device Manager」を起動します。

Eclipse のメニューバーの「ウィンドウ」メニューにあります。

2.AVD を作成します。

AVD Manager の右上にある「新規」ボタンを押し、新しい AVD の設定ウィンドウを開きます。もちろん、既存の AVD を「編集」ボタンを押して変更しても構いません。

3.必要な設定をします。

「Create new Android Virtual Device (AVD)」ウィンドウで、下記の箇所を変更してください。その他の設定は任意で構いません。

• Target
  • 「Intel x86 Atom System Image」をインストールしてあるAndroid バージョンを選びます。インストールされていないバージョンを選んだ場合、次の「CPU/ABI」で「Intel Atom (x86)」が選択できません。
• CPU/ABI
  • Targetを正しく選択していれば、ここの選択肢に「Intel Atom (x86)」が追加されるので、選択します。
• Memory Options
  • この「RAM」の値ですが、Intel エミュレータの場合は必ず 768 以下の値にする必要があります。1024 などを指定すると、AVD 起動時にエラーになってしまいます。
• Use Host GPU
  • これを ON にすると画面描画が更に高速化されます。
  • ただし、Target が Android 2.3.3 のときは、ON にすると画面が表示されません(2013年8月現在)ので、OFFにしてください。
  •  

あとは、いままでの AVD と同じように起動し、開発中のアプリをこの AVD 上で実行するだけです。

エミュレータ上で「システム設定」の「端末情報」を見れば、右の画像のようにこれが Intel x86 のエミュレータであることが確認できます。

この AVD なら、非常に軽快にサクサクと動作します。
また起動時間も非常に短く、ほとんど待たされません。
これならストレスなく使えて、開発効率もアップすることでしょう。

補足: ネイティブコードを使用する場合

ところで最後に一つ、注意点があります。

この Intel エミュレータは、通常の Java のみで記述したアプリを実行するだけなら、ARM 環境用のエミュレータと何も変わりがありません。
ところが、C/C++ で書いて NDK でコンパイルしたネイティブ・バイナリを含んでいるアプリは、そうはいきません。Intel CPU のエミュレータなので、ARM 用にコンパイルしたネイティブ・バイナリは動作しないのです。

とはいえ、これは単に Intel CPU 対応にコンパイルするだけで解決します。下記のように、android.mk の APP_ABI の指定を編集(ない場合は追加)してからコンパイルしてみてください。

• intel x86 専用
  • APP_ABI := x86
• ARM(v7-A) 及び Intel x86 両対応
  • APP_ABI := armeabi-v7a x86
• ARM(v7-A)、ARM(v5TE)、Intel x86 、MIPS 全対応
  • APP_ABI := all

開発中は、上記のいずれかを指定してコンパイルしておけば良いでしょう。
ただし、複数 CPU 対応 (fat binary) にすると、その分アプリのパッケージ(apk)サイズが大きくなります。アプリの公開時には、サポートする CPU だけを定義してコンパイルするよう、注意してください。

また、ARM CPU と Intel CPU は、動作が完全に同じというわけではありません。特にネイティブバイナリを含むアプリの場合は、Intelエミュレータは「開発途中の効率アップ手段の一つ」として用い、最終的には ARM CPU 搭載の実機でしっかりデバッグするようにしてください。