HTML5でギャルゲーを作れるか?

19,404 views

Published on

第2回Hakodate.* LT1本目。

補足:シナリオファイル案 http://gist.github.com/429601

0 Comments
6 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
19,404
On SlideShare
0
From Embeds
0
Number of Embeds
10,360
Actions
Shares
0
Downloads
34
Comments
0
Likes
6
Embeds 0
No embeds

No notes for slide

HTML5でギャルゲーを作れるか?

  1. 1. HTML5でギャルゲーを作れる か?
  2. 2. HTML5でできること  いままでのAjax/JavaScriptでできること全部  XmlHttpRequest  DOM  JSON  CSS  DynamicHTML  Canvasタグ  Audioタグ  Videoタグ これだけあればギャルゲーつくれんじゃね?
  3. 3. 目標はとりあえずこんな感じ
  4. 4. 先駆者  Ajaxとギャルゲーやエロゲでぐぐれば出てくる。  HTML5が出てくる前からあるアイデア。
  5. 5. ゲーム画面  旧来のDOM・CSSを用いる方法  Idを割り振り、それに背景画像をつける。  DOMでガリガリいじる。  IEでも動く!  けどIE6は透過PNG対応してないので爆発しろ!  Canvasを用いる方法  Canvasに画像を貼り付ける。  HTML5対応ブラウザじゃないと無理。
  6. 6. レイヤーの考え方  CSSで重ねて透過PNGを置けばいい。  JavaScriptで管理しやすいのでコッチのほうが楽?
  7. 7. 音楽(BGM・ボイス)  Audioタグを使う  ブラウザによって対応がまちまち  MP3はFirefoxではつかえない。  OggはSafariではつかえない。  いったいどっちを使えばいいの!!  両方用意する。  ついでにIE非対応だし。  iPhoneでは、Audioタグもまともに使えない。
  8. 8. オープニング・エンディング  Movieタグ  ぐだぐだの対応。  音楽と同じことが起こってる。  もう言わなくても分かると思うので省略。  Canvasタグ・DOM・CSS・JavaScript  JavaScriptでムービー作るとかぶっちゃけありえない。め んどくさい。
  9. 9. シナリオファイル  XMLで作る  他のシナリオ形式に比べて書きにくい  ファイルが長い  XmlHttpRequestでそのまま読めるメリット  その他形式案  他のソフトのシナリオ形式と互換  JSON → それならXMLでよくね?  コンバータ → 書くのメンドイ。
  10. 10. セーブデータ  普通にAjaxでサーバに送信する方法  今まで使われてたのとほぼ同じ方法。  PHPとかで簡単にできる。  LocalStorageを使う方法  セーブデータをローカル保存できる。  ついでにデータのキャッシュもここに置くと読み込みが早 くなる。  でも、せっかくWeb化した意味が薄い。  上記と組み合わせてやると効果的。
  11. 11. 難読化  画像の難読化 → DataURIを用いる方法  JSONやPHPなどを用いて圧縮や暗号化をかけてデータを 配信  JavaScriptを用いてデコードし、DataURIとして展開。  JavaScriptの難読化  たくさんあるので省略  ほかの難読化  DataURIでどこまでできるか不明。
  12. 12. 結論  IEを無視すれば既存のAjaxライブラリとかを使えばでき る気がする。  でも、作るの時間かかるなぁと思いつつ。  それよりシナリオやイラストが無いけどね!w

×