Open Comic Creator Document | 株式会社クレイジーワークス | ケータイマンガ作成ツール
Open Comic Creator (Version 1.0)

フリーでオープンでユルいケータイマンガ作成ツール

  • 履歴

  • はじめに
    • これは、クズ人間が作ったフリーの携帯電話向けマンガ作成ツールOpen Comic Creatorのドキュメントです。誰も使わないと思うけど。
    • サポート掲示板：感想とか文句とかはこちら。
    • メールでのお問い合わせ:info_toiawase＠crazyworks.jp(＠を半角にしてください)まで。
    • 適当なメモ書きっぽいマニュアルなので語尾などが統一されてないけど、まあ、いいや。

  • ダウンロード
    • ここからダウンロードできます。
    • iアプリを使うときは、下記iアプリ版の項よりアプリをダウンロードすること。

  • サンプルサイト
    • ほぼ同じ技術をベースにした弊社総裁による個人製作のマンガ投稿サイト(http://lolo.jp)がありますので、サンプルサイト代わりにみて ください。100近い投稿されたマンガが置いてあり、下図のQRコードより、アクセスできます。

  • 対応機種など:
    • Flash Lite 1.0以降:
      • Flash Lite 1.0以降に対応。ドコモ FOMA/AU/SoftBank(3G)で動作する。設置が容易。 おそらくほとんどのユーザはこれしか使わないだろう。
    • iアプリ:
      • FOMA全機種。設置が面倒くさい。ドコモしか動かない。ただし速い。他社製の4〜7倍速い。

    最近は他社製品も高速化したかも。

  • その他:
    • 海外のケータイは現在、対応調整中。社内のテストではNokia E61動くバージョンもある(作りかけのため、非公開)。

  • 作成用マシン
    • Microsoft Windows Xp/2000対応。VISTAは試したことがない。Macは未対応だ。

  • チュートリアル(Flash)

    • ぐだぐだ言うよりも、サンプル素材で実際作ってみた方が理解は速いです。このチュートリアルでは、おおよそ５分で使用法を理解できます。

    1. zipを解凍し、OpenComic.exeを起動しよう。なんかショボいダイアログが出てくる。

    2. [Sample]フォルダを開こう。サンプルのマンガ画像が入ってるのを確認しよう。

    3. Sampleフォルダの中身の画像をすべて、OpenComicのウインドウにドロップしてみよう。まちがったファイルをドロップしたときは[ｸﾘｱ]を押すべし。対応している画像は、JPEG/GIF/PNGのみだ。ビットマップやPICTは対応していない。

    4. [編集]→[名前の順に整列]をクリック。ファイル名順にソートされる。

    5. [プレビュー]ボタンを押し、しばらくするとブラウザが起動し、Flashでプレビューができる。Nextボタンを押すと次のコマに進める。画像サイズは自動的に縮小処理が施される。

    6. 実はデフォルトではモノクロ変換する仕様になっている。ゲフンゲフン。 まあ、普通の日本のマンガはほとんどモノクロなのでそういう仕様だ。

    7. とりあえず、ブラウザを閉じて、カラーに挑戦してみよう。
    8. [編集]→[色数]→[256色]をクリック。

    9. [編集]→[グレイスケール変換]のチェックを消す。256色設定だけだと、256色モノクロになるだけだ。自分でもよく間違える。

    10. 再度[プレビュー]を押すと、今度はカラーのマンガが表示される。よかったな。ただ、カラーのマンガは容量を食うのでケータイにはあまり向かない。

    11. ちゃんと動くことに満足したら、[パブリッシュ]ボタンを押すと、出力先のフォルダを選ぶダイアログが出るので適当に選ぶ。ここではデスクトップを選んでいる。関係ないが、「とりあえずファイルをデスクトップに置く」人は出世しないような気がする。

    12. 出力先の[flash]フォルダを開くとFlashとHTMLが生成されていることを確認する。ちなみにこのhtmlはIEではローカルでは動作しない。また、生成されるswfのファイル名は、その都度ランダムで変わる。何度も同じフォルダにパブリッシュするとファイルが山盛りできるので、たまには消そう。ファイル名がランダムなのは、セキュリティ対策で、予測可能なファイル名にするとダウンロードソフトでぶっこ抜くやつが居るからだ。

    13. flashフォルダの中身(html,swfなど)をFTPなどでアップロードする。

      必ず、同じディレクトリにindex.htmlかindex.phpかindex.cgiかindex.plなどを置くこと。最後のコマの次に飛ぶページになるからだ。(IISの場合はdefault.htm?)

    14. 携帯電話から、index.htmlにアクセスするとマンガを読むことが出来る。スクロールエフェクトなどが携帯電話上で動作する。

  • iアプリ版(DoCoMoだけ)

    • 前述のチュートリアルでパブリッシュしたとき、docomoフォルダができているので、htmlを読んで見よう。 ケータイサイトを作ったことがある人は、だいたい分かるとおもう。分からないときは以下の手順を参考にしてください。

    • 手順が面倒くさいので、コンテンツが大量にあるときは、システムなどで対応しないと作業量が多くて大変になると思う。

    • アプリダウンロードサイトの設置
      • アプリダウンロードサイトを作成する必要がある。これのzipアーカイブの中のbinフォルダの中の3つのファイルを、 あなたのサイトのどこかにFTPでアップロードすること。
      • index.htmlは適当に加工してくれてかまわないです。ファイル名も変えてもらってもかまわないです。
      • ただし、神(ドコモ)のオキテのため、マンガのコンテンツサイトとアプリが置いてあるサイトはドメイン名が同じでないといけない．
      • このアプリを通常起動してもアプリは起動と同時に終了する仕様になっている。

    • コンテンツの設置
      1. 前述のチュートリアルで、パブリッシュすると、docomoフォルダを作ってくれるので、開く。
      2. data?.ctcというファイルとdocomo.htmlというファイルがあることを確認する。data?.ctcは複数あることが多い。
      3. docomo.htmlをエディタか何かでひらく
      4. ソースの中にhttp://APPLI_URL/OpenComic.jamを前項でアップロードしたURLに変更。 これが使用するビューアのURLを示す。
      5. ソースの中のhttp://DATA_URL/をこのコンテンツをアップするURLのディレクトリに変更。末尾にスラッシュを必ず つけること。(例: http://manga.com/comic_data/)
      6. ソース中、ERROR.HTMLをアプリ起動失敗時のページへのURLを記述。 だいたいは、ビューワアプリのダウンロードページに飛ばす。要するに前項アプリダウンロードサイトの設置で作ったページに飛ばす。
      7. あとは、data?.ctcとdocomo.htmlをまとめてFTPで同じディレクトリにアップすること。
      8. ケータイから、docomo.htmlにアクセスし、動作を確認。
  • カット技術：

    1. カット職人の重要性
      • ケータイマンガにおいて、ほとんどの作業時間は他の画像ツールで、各コマの画像をくり抜いて いる時間だと思う。この作業を「カット」と呼ぶ。このカット作業のクオリティでケータイマンガの クオリティはかなり変わる。特に公式サイトなどには、神のようなカット職人もいるので、実際、公式サイトで見てみるといいと思う。原作の 味の残したまま、ケータイの狭い画面に閉じ込めるセンスとコツが必要とされる。 ここでは、カット技術の初歩的なものを記します。

    2. あればいいツール(参考)

      • ペイントブラシ(Windows標準添付・かんたんな切り抜き作業)
      • irfanview(フリーウェア・スキャンや縮小作業)
      • なんか画像ソフト。pixia(フリーウェア)とかJTrim(フリーウェア)とか。スキャン・文字入れ用。
      • お金があればPhotoshop CS(ほぼすべての作業が出来る。)
      • 文字入れ作業は、PowerPointでもできるよ。がんばれば。

    3. スキャニング
      • 300〜600dpiで行い、縮小する。
      • スキャニング時、裏に真っ黒な紙を置くと裏写りを防ぐことが出来る。
      • 真っ黒な紙は、コピー機になにも紙を入れずにコピーをすると作成できる。
      • スキャニングを極めたいときは、自炊wikiまたは漫画の電子化の方法を参照すればいいかも。

    4. サイズ

      • 基本的にこのツールは自動で縮小するが、読みやすいマンガを作成するには、以下の３種類の サイズより小さく、切り抜き&縮小すればいいと思う。このソフトはこのサイズになると自動縮小で補正しない。

        • タテ240xヨコ240ピクセル(スクロールしない)=ケータイの画面サイズ
        • タテ240xヨコ480ピクセル(ヨコスクロールを１ステップ)
        • タテ480xヨコ240ピクセル(タテスクロールを１ステップ)

      • これは推奨サイズであって、上記サイズより、大きくても、変換時に勝手に縮小をかけるので気にしなくても良い。

      • 公式サイトなどを見ると、できるだけスクロールは1ステップ以内におさまるようにカットしている。 つまり、(ケータイの画面)×2以内に収まるサイズでカットする必要がある。もちろん技術的には 何ステップでもスクロールできるのだが、スクロールのステップ回数が増えれば増えるほど、 読者にとって読みにくいマンガになる。

    5. どこを捨てるか?どこを生かすか?
      • 実際、コマをくり抜くと、入りきらないケースもかなり多い。ケータイマンガにおいて、どこを捨てて、 どこを生かすかはセンスを問われる。ひどいカットは完全に原作を殺す。基準としては、コマの中の 中心人物と、そのフキダシを生かせば、ほぼ違和感はない...と思う。その際、原作者に申し訳ないが、 苦労していただいた背景をバッサリ切ることもある。


        ↑赤い線がケータイ画面サイズ=240x240ピクセル

    6. フキダシの文字の打ち直し
      • ケータイ用にコマを縮小すると噴出しの中の文字が、小さすぎて読めないときがあるので、 そのときは、Photshop、JTrim(フリーウェア)などで打ち直す。ペイントブラシでも可能だが、文字がきたなくなる。
      • マンガ用のフォントの入手方法はここを読もう。
      • 文字の打ち直し技術は、デスノートコラの作り方を見ると参考になると思う。

    7. フキダシの移動
      • コマ内の人物とフキダシを入れても、規定サイズにならないときは、Photshopなどでフキダシそのものを移動する。
      • 背景が白いコマだとかなり容易。その場合はペイントブラシでも移動できる。

        • 図 フキダシ移動

        フキダシ移動の例。画面に収めるため、フキダシを移動させ、
        人物に寄せ、さらに、人物とフキダシを中心に赤線のようにカットする。
        こうすることで、むりやり携帯の画面に治めてしまう。

    8. フキダシ分け
      • あまりカッコよくはないが、フキダシの中身が長すぎて、ケータイサイズに縮小すると 読めないときは、同じ絵で２コマに分けることがある。あまりやらない。

        • 図 フキダシ分けする例
  • 改善すべき点
    • スクロールが固定だ(右→左、上→下):
      • 今のところの仕様だ。これは直したい。
    • 並べなおし:
      • ドラッグアンドドロップによる並べなおしはできない。時間があれば。
    • フキダシの拡大
      • 他社ではやっているが、特許を取られている可能性が有る。機能として実装すること には慎重に対応したい。ただし、画像として作成し、同じ動作をさせることは可能である。
    • Flashの著作権保護の対応
      • 技術的には可能だが、設置が個別対応になる可能性が有る。 以前、弊社総裁が受託として受けた案件でFlashのケータイマンガにfootprintを埋め込む 技術を開発し、運用実績もあるが、今回のOpen Comicには実装していない。
    • 一部だけカラー
      • 世間のケータイマンガは表紙だけカラーというパターンが多いので、後日、サポートしたい。
  • 法人サポート
    • 法人向けの有償サポートはご相談に応じます。
    • オープンソースなので、サポート契約無しで運用されてもかまいませんし、商用運用にしようが何しようが、かまいません。
    • 大きな会社の場合、サポートがないと導入できないことがあるので、その際はご相談ください。また、ソースコードのカスタマイズ・機能追加(広告表示機能etc)なども受け付けます。
  • その他
    • 3年くらい前(2004年)に開発し、ハードディスクの肥やしになっていたものなので、コアモジュールはコンパイルして、通るのかどうかもよくわからない。
    • 変に歴史だけは古いツールなので、結構、昔の携帯電話でも動作する。サンヨーやカシオのFlashの「まれに、画面が真っ赤になるバグ」などにも対応している。(Flash Lite職人はよく知ってるよな。)
    • クズ人間の作ったものだ。気にするな。
    • 自己責任です。
(C) 2007 CrazyWorks Co.,Ltd.