2013年6月18日火曜日

Test the Web Forward を開催しました! #testtwf

6月7−8日に、Test the Web Forward 2013 Tokyo というイベントを開催しました。 



公式サイト:http://testthewebforward.org/events/tokyo-2013.html
公式イベント: https://plus.google.com/u/0/events/cbnnd183320n38e6nch0h0gm3gs
サマリー動画:




===Test the Web Forward ってなあに?===

Test the Web Forward とは、スペックエディターや W3C メンバーを含む Web 標準のエキスパートの皆さんや開発者の皆さんが集まり、W3C 仕様の読み方や W3C 仕様テストの作成方法について学び、実際に仕様テストを書き、そうした活動を通じて Web の進化に貢献しようというイベントです。

Web 開発者なら誰でも感じるであろう Web の実装や互換性の問題点に対して、ブラウザベンダーに解決を丸投げするのではなく、開発者みずから、ブラウザの違いを問わない、相互運用性の高い Web を作り上げていく手助けをしようというムーブメントです。

Adobe の Rebecca Hauck さん、Israel Noto Garcia さん、Laurence Mclister さんを中心に、サンフランシスコ・北京・パリ・シドニー・シアトルで開催されてきて、この東京は6カ所目で、Adobe と Google の共催という形で開催し、Microsoft、 KDDI と W3C もスポンサーに加わって頂きました。Rebecca 達はいつも「Test the Web Forward は Adobe のイベントにしたいわけではなく、Adobe も、Google も、Microsoft も、それ以外の多くの会社や個人など、Web の未来をよりよい物にしたいと考えている人みんなで作るもの。みんなで web をよいところにするために、協力しましょう!」とおっしゃっています。そして、次はぜひ日本の開発者の皆さんが、自ら Test the Web Forward を開催してほしい、とも :)

世界のITエキスパートたちを捕獲! 凸撃インタビュー

Test the Web Forward はこの後も8月の上海、11月の深圳での開催が既に決まっています

===1日目===

えーじさんによる開催の挨拶。


総務省の岡本さんからのご挨拶。


How To Read W3C Specifications(W3C仕様書の読み方) 
プレゼンター:Kazuaki Takemura


Specification and Test Lifecycles(仕様書とテストのライフサイクル) 
プレゼンター:Oli Studholme
スライド:https://github.com/oli/test-twf


ちなみに会場はパンパン。。。



エキスパート達によるライトニングトーク
(俺が開発してるところのテスト書いてくれアピールタイム)

このライトニングトークの内容をもとに、土曜日のハッカソンの参加グループを検討&決定します。

●CSS FlexBox

CSS-FlexBox documentation
CSS-FlexBox のテスト
CSS-FlexBox Test cases


●CSS Text + Writing Modes

CSS3 module: text documentation
CSS Writing Modes Module Level 3 documentation
CSS Text test cases
CSS3 Writing Mode test cases


●CSS Object Model (CSSOM)

CSSOM documentation
Suggested tests to write for CSSOM
CSSOMのドキュメントの日本語訳
CSSOM test cases


●CSS Fonts

CSS Fonts documentation
CSS Fonts test cases


●HTML5

HTML5 documentation
HTML5仕様のテストカバレッジについてまとめられたページ


●Filter Effects

Filter Effects 1.0 documentation
Filter Effects チームのドキュメント
Filter Effects test cases


●ShadowDOM

Shadow DOM documentation
Shadow DOM tutorial



ここまでの動画。Hangout On Air で配信してました :)




ご飯を食べつつ、ビールを飲みつつ交流し、明日の参加チームを決めていきます。


HTML5 寿司です♪


Test the Web Forward のマスコット「恐竜」の寿司も!



Rebecca によるかんぱーい!

Test the Web Forward

さらに部屋に戻って、テーマごとにホワイトボードを準備。ライトニングトークを行ったエキスパートが明日に向けてチームメイトをリクルーティング。



そして参加者全員がどこかのチームに入り、ホワイトボードに名前を書き、明日会場に来たらどこのチームでテストを書くかわかった状態で解散。


解散、解散。。。解散ですよ!と叫んでも議論が白熱し、終了時刻を過ぎてもあと10分!もうちょっと!先生、この人達帰りません!(笑)いや、白熱しててすごくよかったです!! :D

Test the Web Forward

===2日目===

2日目の朝は、朝食から始まります。サンドイッチmgmg!


今日は朝からチーム毎に座ります。


朝のセッション。

===Testharness.js Essentials(Testharness.jsの基礎) ===

プレゼンター:Michael[tm] Smith, Daniel Davis

Using testharness.js
Testing with testharness.js


===Anatomy of a Ref Test(リファレンステストはどのように構成されるのか)===

プレゼンター:Rebecca Hauck
日本語スライド「リファレンステストの書き方」
英語スライ"How to write a Reftest"





===LT: How to Write a Test===

そして飛び入りの fantasai によるテストのやり方についてのライトニングトーク。

1. Identify or synthesize test assertion. Be very precise!
2. Construct test scenario.
3. Assert pass/fail.
4. Review the test!
  * Test passes when it should pass.
  * Test fails when it should fail.
  * Test tests what it thinks it's testing.


ここまでは Hangout on Air で配信していたので、動画をどうぞ!



いよいよみんながテストを書くハックタイム開始。

Test the Web Forward

Test the Web Forward

Test the Web Forward

Test the Web Forward

Test the Web Forward

Test the Web Forward

なお、参加者がテストを書き、エキスパートがチェックし、無事 submit されるとカーンと鐘を鳴らし、会場みんなで拍手をして喜ぶ、というのが Test the Web Forward の慣習。これは前に進んでる感があっていいです!



ランチタイムはお弁当、そしてずっとコードを書いているので大変疲れるためおやつタイムもあります!

こちらはJxckさんが提供してくださった Gopher チロルチョコ。

Test the Web Forward

Test the Web Forward

Microsoft さんが提供してくださった MS チロルチョコ。

Test the Web Forward

結果発表!

ちなみに今までの記録はシアトルの500テストだったのですが、なんと東京では609個のテストをsubmitし、世界新記録を更新!やった!!

動画もどうぞ :D



恐竜を囲んでオーガナイザーみんなで記念撮影 :Dちょっと夕日がまぶしいw



二日目の懇親会は、W3C Developer Meetup に合流。そちらについては別にブログ記事を書いてあるのでここでは割愛します :)

W3C Developer Meetup Tokyo #w3cdev


===ツイートまとめ!===



===コミュニティ===

いくつかのチームが Google+ コミュニティを作っているようです。


===記事===

Web標準をテストするハッカソン –「Test The Web Forward」がついに東京に上陸
より良いウェブを実現

===おみやげいっぱい!===

Tシャツ

Test the Web Forward

Test the Web Forward 

ステッカー


  ===撮影隊!===

準備中の村岡さん。

Test the Web Forward

ヘルメット装着!

Test the Web Forward

恐竜と化したともちゃん。

Test the Web Forward

スタッフの皆さん、エキスパートの皆さん、そしてご参加頂いた皆さん、ありがとうございました!

===今後のために、アンケート===

アンケートの回答もありがとうございます!

よかったところいくつか:
"仕様策定に関わっている方と一緒に作業できた点。また、どういう視点で標準を作り出すのかを知ることができ、とても刺激になりました。" 
"コードを書いてマージされるまでを体験でき、自分でもW3Cに貢献できると実感できたところです。" 
"テストをその場でExpertがレビューして、アドバイスをくれたこと。おかげで自信を持ってpull request できました。" 
"今まで貢献するにも大きな壁を感じていた W3C の活動に、具体的なやり方を教えてもらえたことで自分でも貢献できる道が見えた。 自分でも身近な人たちにこのノウハウを広めて日本でも積極的な活動にしていきたい"
"W3Cのgithubのコードの中に自分の名前を見つけられるのは嬉しいです。 "
実際に仕様を作っている人と席を並べて学び、テストをチェックしてもらい、作業を進めてマージされるところまで体験できる、実に稀なイベントになったと思います。ぜひ今後も継続してください :)

改善すべきところ:

運営に際して改善すべき点も多々あるので、頂いたフィードバックを元に改善していければと思います。いくつか掲載。。。
"テストがまだ書かれていない(取り組むべき)箇所が明示されていると、はじめやすかったかな、と思います。" 
"参加者が自由に作成するテストを選択できるのは良かったのですが、同じ対象に対して重複したテストを作成してしまうことがあったので、事前にテスト作成対象を各個人に振り分けておいても良かったのではないかと思います。ただ、参加者が自分の興味あることに取り組む方がモチベーションが高くなるので、あまり強制的な方法でない方が望ましいと思います。" 
"初めにテストの書き方や仕様書からテストとなる部分を探すまでに慣れるのが、時間かかったので、初めにサンプルとなるテストのテンプレートや初日のオリエンテーションの際に、ひとつ実際にW3Cの仕様書を読んで、テストに起こすところまでを実演していただければ、もっとスムーズに進めたと思います。" 
"みなさん本当に真面目にtestを書いていたので、もう少し交流できても楽しかったかもしれない。"

===おまけ===

Facebook / W3C の Tobie の背後に忍び寄る恐竜 ;)



なお、このブログに掲載した写真は私が撮った物・html5j が撮った物の mix です。写真が多すぎるので、一個一個クレジットしなくてもいいよと仰っていただいたのでバクっと掲載しちゃいました :)

Gihyo: Webをより良いものにしよう! HTML5/CSSの仕様のテストを書くハッカソン「Test The Web Forward Tokyo 2013」レポート

Disclaimer
このブログは山崎富美の個人的なものです。ここで述べられていることは私の個人的な意見に基づくものであり、私の雇用者には一切の関係はありません。