Shinya’s Daily Report このページをアンテナに追加 RSSフィード

2012/01/20(金)

[][][][]『2012年のHTML5CSS3JavaScriptはこうなる〜実際のサービス事例で考えるHTML5の近未来』に参加してきた #html5semi 08:15 『2012年のHTML5、CSS3、JavaScriptはこうなる〜実際のサービス事例で考えるHTML5の近未来』に参加してきた #html5semiを含むブックマーク 『2012年のHTML5、CSS3、JavaScriptはこうなる〜実際のサービス事例で考えるHTML5の近未来』に参加してきた #html5semiのブックマークコメント

f:id:absj31:20120120215320j:image:w600

(写真:神保町駅改札前)

HTML5関連ネタはやろうやろうと思いつつ個人的にはリーチ出来てない分野でして、ちょっくら拝見してきました。ちなみに上記の募集サイト、凄い人気で200人の定員に一時は倍の400人が登録すると言う事態に。HTML5人気は凄いですね〜。

開催開場は株式会社オプト1F大会議室@神保町。この日は朝から雪が降るなどして天候が崩れていましたが、夕方〜開催の頃には問題無く止んでおりました。しかし外は寒かった!(>_<)

入場時の状況で5分程遅れて本編スタート。以下メモです。


基調講演:HTML5最新動向

f:id:absj31:20120120193551j:image

【講演概要】
HTML5関連の動きは現在非常に早く、最新動向を追いかけているだけでも大変です。
FullScreen API、Web Intents、Web RTC、Page Visibilityなどなど、大小様々な仕様が日々提案、公開されています。
この講演では、そうした最新動向をコンパクトにまとめてご紹介し、今後のWebの未来を占うための材料を提供したいと思います。

この基調講演に関しては、下記イベントでの内容の手直し版的な内容とのこと。時期的にもそこまで開きは無いので、このセッションはその時の資料&動画を貼ることで割愛したいと思います。

D

※今回用に手直しされたVer。併せてUPしておきます。



第1部 HTML5で実現する「世界で一番のマンガ投稿&共有サイト」

f:id:absj31:20120120201023j:image

【講演概要】
「世界で一番のマンガ投稿&共有サイト」を実現するため、なぜマンガ★ゲットはHTML5を採用したのか?
今後の野望を交えてお話いたします。
  • そもそもマンガゲットってどんなサービス?
    • Webマンガの投稿共有サイト。
    • 無料で編集・配信/無料で読める
  • もうちょっと深い話
  • 漫画雑誌だけでは採算が取れない。
    • 投資漫画雑誌
    • 儲ける:コミカライズアニメ
      • このループが漫画の儲け方。
    • 単行本市場は10年でだいたい横ばい。
    • 漫画雑誌は10年で下がり気味。
      • 1.作家を育てる場所gはなくなる
      • 2.マンガ好きを増やす場所が無くなる
      • →漫画界の危機。
    • 電子コミック:儲ける部分でしか有効ではない。
    • 漫画雑誌に相当するインフラが必要。
  • 機能
    • ユーザの声からの学び
    • 作家同士でせっさたくま
    • 自分でも掛けそう、かきたい。
    • 無名漫画でも口コミで広がる
    • システムの現状
      • 4300作家
      • 38000漫画。
      • 890000ユーザ
      • 1億閲覧を最近突破。
  • HTML5導入の経緯
    • 2010春:すべてのデバイスで提供したい。(それまではガラケーのみ対応)
    • まず対応したい
    • 対応方法のチョイス
      • →普通に考えたらHTML5でしょ!
    • 開発スタート
      • しかし甘くは無かった
      • 罠1:Android OS 2.1
        • Canvasバグがあった(結果何だか小さく見えてしまう)
      • 罠2:Android端末の性能差
        • 創成期の一部の端末。最近のからすると、ちょっと遅い。
        • コマのスクロールがびっくりするくらい遅い
        • →個別チューニングで対応し、手間が掛かった。
      • 罠3:IEcanvas未対応
        • IEはそれでも人気。
        • 漫画ゲットユーザ間でも一番人気。
        • もちろん個別対応した。
      • ※色々あったが、コアなソースの部分はソースで1つで済んだ。
      • リーダのコアな部分を作る
        • →コンテナ側を工夫して様々なデバイスに対応
      • そこまで複雑な仕組みのシステムではない。
    • HTML5についてのまとめ
      • プリミティブな機能のみ必要な場合は横展開しやすく使い勝手が良い
      • 実機による検証が必要。
      • 新しい仲間(エンジニア)を探しているよ!
  • 現在、それなりに盛り上がっている原因の分析
    • みんな漫画を読みたかったし、描いて誰かに読んで欲しかった。
      • 需要、ニーズが多くあった。
      • コマ割り画像でガラケーでも読み易かった。
      • 閲覧数が高くなり、レビューが増え、漫画を描きたくなる。
      • 投稿・閲覧が盛り上がった。
    • 園芸のプロセスと比較してみる
      • 土を耕す(システムを準備する)
      • 種をまく(ユーザを連れてくる)
      • 手入れをする(サービスを運営する)
    • どうやってユーザを連れてきたのか?(投稿サービスなので、初期の投稿メンバー&コンテンツ確保が絶対に必要。)
      • 始めの9か月、マンガ作家の登録数が多かった
      • Web上で招待メール送付
      • 専門学校の授業で取り上げてもらったり、プレゼンに伺った(マンパワーで実践)
        • ターゲット:まんがかのタマゴ
      • 気を付けていた事:【信頼の醸成】
        • もらって嬉しい招待メール:漫画を読んで、感想を添えて。
        • 弊社でコマ割:アナログ主体の作家さんにはとっつきづらいウェブサービス→原稿を送ってもらって弊社で対応。
      • 開始直後の手厚い問い合わせ対応
  • 前職:FF11コミュニティ運営が専門。
    • コミュニティ運営とは:リテンション
    • コミュニティの三角形
      • (1).三角形の頂点に立つひとのクローズアップ
        • ゲームで言えば、コミュニティサイトのオーナー、ハイレベルなプレイヤー
        • 光を当てる。みんなのあこがれの存在を作る
      • (2).三角形の最下部のユーザの育成
        • ゲームで言えば初心者、まんがで言えば新規加入者
        • 原因を突き止め、とにかくやめさせない。→三角形がどんどん大きくなる。
      • (3).新たな三角形が醸成されるようなイベント企画などを打つ
  • まとめ
    • 今後の話
      • 予告1:漫画を1ソースで全言語・世界配信。
      • 予告2:出版社はやはり必要。大事な機能を持っている。→リアルなビジネスにつながっていきますよ...との事

第2部 スマホブラウザゲームのクオリティアップにHTML5あり!

f:id:absj31:20120120204247j:image

【講演概要】
弊社で開発するアクションゲーム、MMOストラテジーなどのブラウザゲームを事例に、
HTML5とその周辺技術を使うことでよりクオリティを高める方法についてお話いたします。

後半はDemoを交えつつの諸解説・・・という流れだったのですが、会場がネット回線利用出来ずという状態でまさかの全編口頭説明。色々観てみたかったのでこれには残念。


第3部 JavaScriptエンジニア向け!スマートフォンで動くブラウザゲームの作り方

f:id:absj31:20120120211149j:image

【講演概要】
Android, iOSの標準ブラウザ上で動くゲーム開発を通じて得た知見を元に、
開発を進める上でのワークフロー、独自に開発したフレームワーク、使用した外部ライブラリ、
はまりどころなどをJavaScriptエンジニア向けに紹介します。

こちらも基調講演同様、大分駆け足での解説となったセッションでした。スライド資料が既に上がっているため大枠のメモだけ残し、その他についてはスライド資料参照という形を取ろうと思います。(詳細な対応方法等が満載ですし)

    • チケット管理はJserがオススメ
      • 理由:
        • Jserはプロジェクトの最初より後半が忙しい
        • チケットがjserへ一番最後に亘ってくる
        • サーバサイドとマークアップの繋ぎ込みが多い
    • ワークフロー
      • タスクリストを作る
      • 全員で見積もり
        • 見積もりポーカーを採用
        • 見積もり時間は全て加算して計算
        • 作業人数によって優先度を決める
        • チケット化に必要な簡単な設計を行う
      • エンジニアがチケット化
        • 一番重要度の高いタスクのみチケットを切る
        • 見積もり時に優先度、実装に必要な情報を記述
        • チケット完了後の対応も書く
      • 適宜アップデート(1日1回)
      • エンジニアが主導出来、簡単に導入出来る事を主眼に置いている。
  • 実装詳細編
    • ※非常に詳細かつメモが取り切れなかったのでスライド資料を御参照ください。(^_^;)


終了予定時刻を20分程過ぎ、全てのセッション終了。そのままの流れで懇親会へと続いて行きましたが、懇親会には参加せずそのまま帰宅。

HTML5スマホ界隈は現在多いに賑わっておりますがまだまだこれからの部分が多く、各種デバイス対応等の苦労も(かつての各種ブラウザ対応のように)解決し切れていない状態であるのだな〜と実感。こういった問題とはITで物づくりをして行く以上、付き合って行かざるを得ない問題なのですかねやはり...(苦笑)

とは言えこの辺りの技術・分野は今後必ず大きい位置を占める事になるでしょうから、引き続きウォッチして行きたいと思います。やはり何かテーマを持って実際に作るのが早いよな〜。テーマ何が良いかな?ちょっと考えておこう。

その他関連: