製作者情報

ハンドルネーム
白玉, siratama

mail:
webmaster★dango-itimi.com(★を@に変更してください)

website: 団子一味の野望
http://www.dango-itimi.com

blog: X-LABO
http://www.dango-itimi.com/blog/

Google+
https://plus.google.com/113487256962584234772/posts

Twitter
https://twitter.com/dango_itimi

IT関連会社・キャラクターデザイン会社を経て、現在 Web コンテンツ制作会社に所属中。

得意分野1 クライアントサイドの開発

クライアントサイドの開発を専門としており、Flash 開発並びに、javascript を利用したサイトやゲーム制作を得意としています。「フロントエンドエンジニア」と大分される職種に就いていると言えるでしょうか。Adobe AIR を用いた Android アプリや iPhone アプリの制作も可能です。

サイトやゲーム制作の他、必要最小限の手間で Web サイト更新作業を行えるようなアプリケーションの開発(Adobe AIR を利用)を行い、2013年現在 某社の二つのサイトで運用中です。このアプリケーションに合わせ、バージョン管理ツールを用い、チーム内複数の更新者が滞り無く更新作業を行えるような体制を考えたりもします。元システムエンジニアとしての本分を発揮している次第です。

大卒後初めて就職した IT関連会社では、主に Unix と Java を用いてサーバサイドの開発を行なっていました。Oracle のデータベース操作なども行なっていましたが、現在はほとんど覚えていません。Unix での vi 操作習得は現在でも大変役に立っています。

現在はサーバサイド開発は専門とはしていませんが、Perl を用いての簡易的な CGI 制作は業務や個人的なゲーム制作で行なっています。また、Google App Engine/python を少々研究しており、個人的 あるいは会社でもいくつかサンプルデモを制作しています。

サーバサイドは内部的な力持ち、対してクライアントサイドは人の目にダイレクトに触れる顔部分とも言えます。団子一味の野望というサイトを運営しているという事もあり、もっと人の目に触れる部分の開発を行いたい、そういう希望も有り現在の職に就きました。

とはいえ、クライアントサイドだけでは行えることが限られてきます。Web サイトやゲームに何らかの面白い仕組みを導入するためには CGI の利用が必要となります。よって、Perl に関してのある程度の知識を持ち、更に個人でも行えることを拡張するために Google App Engine の研究を行なっています。

得意分野2 キャラクターデザイン・ドット絵アニメーション

子供の頃より絵を描くことが好きで、特に小さいキャラクターの絵を頻繁に描いていました。よって、頭身の低いデフォルメキャラクターデザインを得意としています。更に、イラストのドット絵化と、ドット絵のアニメーション制作を行うことを得意としています。

過去勤めたキャラクターデザイン会社では、サンリオキャラクターの Flash ムービー制作を主な仕事としていました。Illustrator で一コマ一コマ キャラクターを描いていくという、ドット絵ではなくベジェ曲線と戦う毎日でしたが、元アニメーターの方に動画のイロハを教えて頂き、アニメーション制作能力が飛躍的に向上しました。

向上したアニメーション制作能力、並びにドット絵をふんだんに取り入れ誕生したのが「OH! DANGO! JAM」(2006年完成)という団子一味代表作となったゲームとなります。

http://www.dango-itimi.com/jam/

デフォルメのキャラクターデザインは得意とはいえ、一枚画といったイラスト制作能力自体は低いです。どういったドット絵やイラストを描いているかは、blog GRAPHIC カテゴリーを参考にしていただけたらと思います。

http://www.dango-itimi.com/blog/archives/graphic/

おまけ技能 BGM制作

高校生の時、友人の影響でピアノを弾き始めました。ゲーム BGM(FF, DQ, MOTHER2等) の楽譜を購入し練習しました。

現在はピアノ(MIDIキーボード)に触れる機会は減っており、何かの曲を弾ける、という事はありません。しかし長らく続けていたという事もあり、耳コピ(コード進行探知とメロディーを弾く)の技術は身につきました。そのおかげもあって、簡単な作曲を行うことができます。

本職の方が作られる BGM には到底かなうものではありませんが、ミニゲームといった簡単な BGM 程度であれば制作可能です。過去一番のお気に入りの曲は、上記で挙げた OH! DANGO! JAM のキャラクター選択画面 or HELP 画面での BGM となります。VOCALOID(MEIKO)を利用しています。

http://www.youtube.com/watch?v=-NGV94rP6BI

研究内容まとめ

2005年より始めた blog に記述している 調査・研究内容のピックアップです。新しいものから 2009年頃までを記述していきます。

Haxe & CreateJS の利用による html5, Flash 並行開発(2013)

あらゆる言語に変換可能なプログラミング言語 Haxe と、Flash の素材データを html5 用に出力する Toolkit for CreateJS を利用し、より少ない手間で、同じ内容の html5 canvas と Flash コンテンツを並行開発する方法を研究しました。

実例デモはこちら

http://www.dango-itimi.com/blog/swf/185/

Adobe AIR を用いることで、Flash は Android や iPhone アプリにそのまま変換可能であり、PC、スマートフォン、あらゆる環境に対応したコンテンツ制作が可能となります。

関連エントリー

Flash CS のステージ上に配置したシンボルを Flash or html5 canvas Box2D オブジェクトに変換する ライブラリ制作(2013)

スクリプトを記述せず Box2D オブジェクトを生成する事が可能となり、開発効率の向上が図れます。オーサリングツールである Flash CS の特性をふんだんに活かした技となります。

詳しくは以下をご覧ください。

Flash CS のステージ上に配置したシンボルを html5 canvas Box2D オブジェクトに変換する Haxe/js ライブラリ公開

関連エントリー

Flash C++ Compiler(FlasCC) Box2D の動作パフォーマンス検証(2012)

Flash 用 Box2D を利用した Adobe AIR Android アプリに対し、FlasCC Box2D swcファイルを利用した Adobe AIR Android アプリは、どれくらい速度が向上するのか検証を行いました。

結論としては、ほとんど速くなりませんでした。使い方を誤っている?可能性もあり。

Android での FlasCC box2d(v2.2.1) と box2dFlash(v2.1a) の動作パフォーマンスの比較

関連エントリー

英文&タイピング学習サービス TYPENG 作成(2012)

2012年は、半月に一つのペースでゲーム制作に挑戦してみた年となりました。ゲーム以外には「TYPENG」というタイピング英語学習 Web アプリケーションを javascript で作成しました。

http://www.dango-itimi.com/typeng/

英語学習とタイピング習得をいかに両立させるかを考えた設計となっています。繰り返し同じ問題を練習するメニュー等があれば、もっと良い物になるかもしれません。

設計の性質上、スマートフォンの音声入力からもある程度入力可能です。

関連

Google App Engine <--> Flash 間通信における暗号化調査(2011)

暗号化通信と、swf 暗号化(難読化)の二点について調査を行いました。

例えば Flash ゲームを制作したとして、ゲームの得点をサーバに送信する際 不正なリクエストにより、ありえない高得点に改変されてしまう恐れがあります。その改変をいかにして防ぐかの研究となります。

最終的には、Google App Engine 上でユーザ毎に得点管理を行う Web アプリケーションサンプル制作へと繋がりました。

GAE : Google アカウントによる Flash(swf) 内データ保存から ユーザ独自の URL 発行

いつか実用化したい所ですが、個人的には中々時間がとれず、調査したまま眠った技術となっています。

最近では html5 canvas ゲーム制作の研究を行なっていますが、javascript の暗号化は正直厳しいという事もあり、どうしたものかと困っております。

Flash による HTML サイト開発(2011)

得意分野でも挙げた、必要最小限の手間で Web サイト更新作業を行えるようなアプリケーションの開発を行いました。簡易 Movable Type のようなもの、となります。

http://www.dango-itimi.com/blog/archives/2011/001086.html

Action Script 3.0 での開発となりましたが、今後は Haxe に移植するかもしれません。

Box2D 調査(2011)

物理演算ライブラリ Box2D の研究を行いました。過去、物理演算ライブラリ制作に挑戦した事がありますが、あまりの難解さに調査継続を断念しました。物理演算処理制作はプログラミングの中では最高難度ではないかと思います。

主にゲームで利用するための調査を行なっています。

Google App Engine + SWFバイナリ解析(2011)

当時ソーシャルゲーム界では賑わっていた技術 SWF バイナリ解析に挑戦し、Google App Engine 上にて以下の Web サービスを作成しました。

ゲーム・待受 Flash かんたん作成 FLA.PRINTER フラプリ

SWF の仕様書を見てバイナリを解読していく作業となり、いわゆる暗号解読を行うような作業となりました。頭の痛くなるような作業でもあり、今ではどのような解読を行ったかほとんど内容を覚えていません。

Google App Engine + python の習得並びに、png や gif の画像形式の仕様に関して大変勉強になりました。

関連エントリー

Mobage(モバゲータウン)にて 団子一味の野望 mobile が OPEN(2011)

これは研究内容ではなく、ニュースとなります。 なんとも嬉しいことに、OH! DANGO! JAM をベースとしたソーシャルゲームを制作していただきました。現在はサービス終了しています。

http://www.dango-itimi.com/blog/archives/2011/001048.html

メタセコイア解析 + ドット絵3D表現(2010)

3Dモデリングソフト メタセコイアファイルの解析処理を行い、Flash 上に 3D として表現するライブラリの制作を行いました。加えて、3D 表現をドット絵風に表現する研究を行いました。

メタセコイア → Flash その3 : 個々のオブジェクト操作

これはいずれ何とか活用したい技術ではありますが、2013年現在 html5 canvas では drawTriangle API が用意されておらず、まだしばらく眠る事となりそうです。

この 3D 表現をそのままゲームにしてみたのが以下のサンプルとなります。

ドット絵ベルトスクロールアクション3D

Fキーで斬る、Aキーで矢を放つ、Dキーで防御、スペースキーでジャンプ、その他詳しい操作方法は、以下の記事をご参考ください。

http://www.dango-itimi.com/blog/archives/2011/001038.html

関連エントリー

GridCutter 制作(2009)

Web 上で画像加工を行うツールの作成を行いました。UI 部分など シンプルながら結構凝った作りになっています。

GRIDCUTTER

簡単な操作手順は以下の記事を参考ください。

http://www.dango-itimi.com/blog/archives/2009/001004.html

関連エントリー

BoxScroller 制作(2009)

Flash 表示領域内に擬似スクロールバーを実装したサンプルです。

http://www.dango-itimi.com/blog/archives/2009/001002.html

この技術は スマートフォンアプリ制作や、html5 canvas コンテンツでの UI 設計にいかせそうです。

JSFL 作成(2009~2013)

JSFL は主に、Flash のオーサリング作業を自動化したい場合に利用します。手動で繰り返し行なわなくてはならない作業を自動化できるため、作業効率化を図れます。

JSFL は javascript で記述する、という事から 最近では Haxe を用いて JSFL を作成しています。

Flash CS から Haxe用 extern クラスを出力する JSFL 公開

jsfl からのリンケージクラス設定解除が効かない場合は fla ファイルを保存して起動し直す

原点座標(0, 0)にシンボルを再配置する jsfl

シンボル配置位置の小数点以下を四捨五入して再配置する jsfl

選択された一つのレイヤー内全てのキーフレームに指定数フレームを挿入or削除するjsfl

「プロファイラ内容変更」+「フレームへのスクリプト記述」 jsfl サンプル