HTML5を利用して、ブラウザ上で簡単3Dマンガが作れるWebアプリ |
||
|
|
概要 | |
● HTML5利用の簡単マンガ作成Webアプリ 作成したマンガはサイトに貼り付け自由
ソフトウェア開発を行う、クロノス・クラウン合同会社(本社・横浜市)の代表社員 柳井政和は、2013年5月21日に、HTML5とWebGLを利用して、簡単に3Dマンガを作成できるWebアプリ「箱人形マンガ(Box Comic)」を正式公開しました。 作成したマンガはPNG画像として保存でき、商用サイト非商用サイト問わずに、Webサイトに自由に貼り付けることが可能です。 また現在「マンガPG」というサイト上にて、「箱人形マンガ(Box Comic)」を利用したプログラミング解説マンガ「マンガで分かる Java入門講座」を連載中です。どういったマンガを作成できるかは、こちらから確認できます。 □ 箱人形マンガ(Box Comic)http://manga.crocro.com/apps/box_comic/ □ 動画による操作方法説明 http://manga.crocro.com/apps/box_comic/how_to.html □ マンガで分かる Java入門講座 http://manga.crocro.com/?cat=java&pg=index □ マンガPG http://manga.crocro.com/ □ クロノス・クラウン合同会社 http://crocro.com/ |
開発の背景 |
弊社では、これまでプログラムやITをマンガで解説してきました。 □ マンガで分かる JavaScriptプログラミング講座(秀和システムにて書籍化)http://crocro.com/write/manga_javascript/wiki.cgi □ マンガで分かるプログラミング用語辞典(翔泳社「CodeZine」にて連載) http://manga.crocro.com/?cat=pg&pg=index □ めも理と窓太のパソコン講座(インプレス「窓の杜」にて連載) http://www.forest.impress.co.jp/article/madota.html しかし、マンガの作成には、かなりの時間が掛かるのが実情です。そこで、プログラムを使い、絵を描かずに、簡単な操作でマンガ・コンテンツを作成するためのWebアプリを開発することにしました。そして、アプリケーションの開発を始めました。 現在は、「マンガで分かる Java入門講座」を実際に連載しながら、プログラムのバージョンアップを続けています。 |
技術的背景 |
HTML5のCanvasと、WebGLを利用して、3D空間にオブジェクトを配置することで、マンガを手軽に作成できるようにしています。 キャラクターは、ドット絵を基本にした「箱人形」にして、手軽に作成できるようにしています。また、キャラのテンプレートをダウンロードして、自作のキャラクターを作り、ZIPファイルで読み込ませることも可能にしています。 画像の読み込みやペイント機能もあるため、デジカメで撮影した写真を背景として読み込ませたり、書き文字をその場で描いて取り込んだりすることも可能です。 作成したマンガは、PNGファイルとして保存する以外にも、専用のtumblrのページに投稿することもできます。 また、ソースコードは、ブラウザ上から閲覧することが可能です。 □ 箱人形マンガ(Box Comic) - ソースコードhttp://manga.crocro.com/apps/box_comic/souce_code.html |
「箱人形マンガ(Box Comic)」の活用 |
「箱人形マンガ(Box Comic)」は、紹介マンガや、ちょっとしたアイキャッチ的なマンガを作成するのに適しています。 解説記事にマンガを添えたり、1コママンガの挿絵を作ったりといった用途を想定しています。 また、アフィリエイトページなどでの利用が可能なため、Webサイト上で気軽な利用が行えます。 |
「箱人形マンガ(Box Comic)」まとめ |
「箱人形マンガ(Box Comic)」は、絵を描けない人でも簡単にマンガを作成できるWebアプリです。 また、短時間でマンガ・コンテンツを作成することを目的として作成していますので、紹介マンガや、アイキャッチ的な1コママンガでの利用に適しています。 クロノス・クラウンでは、今後も、楽しさと実用を兼ね備えたコンテンツや技術を提供していきます。 |
関連リンク |
□ 箱人形マンガ(Box Comic) http://manga.crocro.com/apps/box_comic/ □ 動画による操作方法説明 http://manga.crocro.com/apps/box_comic/how_to.html □ マンガで分かる Java入門講座 http://manga.crocro.com/?cat=java&pg=index □ マンガPG http://manga.crocro.com/ □ クロノス・クラウン合同会社 http://crocro.com/ |