Mozilla Hackathon 2012 成果発表~アドオン開発グループ編~

こんにちわ。赤塚です。
先日行われた Mozilla Hackathon 2012 におけるアドオン開発グループの成果をまとめてご報告いたします。

  • Piro さん
    • ツリー型タブの改良
  • Gomita さん
    • ジェスチャによる操作を可能とするアドオン(モバイル)
  • hATrayflood さん
    • printplus
  • luckpoint さん
    • 選択した文字列で検索できるようにコンテキストメニューを追加(モバイル)
    • 音声検索できるメニューを追加(モバイル)
  • EnsekiTT さん
    • 我ログ
  • port4art さん
    • ユーザが選択した複数の英単語の意味をデスクトップの通知を用いて表示する
  • y_system さん
    • スーパー高校生の名言をランダムにアドオンバーに表示する
    • 京急の運行情報が通常かそうでないかを取り出して表示
  • dokan さん
    • 任意のサイト上にある、任意の要素を発見した際に、なんしか知らせるアドオン
  • dynamis さん
    • fixprefix(モバイル)
    • kinect.js

1.Piro さん
・ツリー型タブの改良
かねてからリクエストのあったと言うツリー型タブとブックマークの連携を実装しておられました。デモでは、任意のツリーをドラッグしブックマークにドロップすると、そのままブックマークとして登録されたり、逆にブックマークをドラッグ&ドロップしてツリータブにされていました。ツリーによってグループが表現できるのでグループ化するという意味では Panorama に近いかもしれません。ただ、空間的認知には若干劣る可能性がありますが、モードレスで触れられる点はとても有利なように思いました。操作的にも動き的にもとてもスムースな印象で、質の高さを感じざるを得ませんでした。さすがです。
アドオン:https://addons.mozilla.org/ja/firefox/addon/tree-style-tab/

 

2.Gomita さん
・ジェスチャによる操作を可能とするアドオン(モバイル)
マウスジェスチャによるブラウザの操作を可能とするアドオン FireGestures の開発者でもあらせられる Gomita さんは、モバイルにジェスチャを持ち込む試みをされておりました。具体的には、マルチタッチが可能なモバイルならではの三本指によるジェスチャで、三本触ったまま左右に動かすことでタブの移動、上に動かしてコンテンツのリロード、下に動かしてタブを閉じる機能を実装されておりました。
ジェスチャの他にも、例えば他者の指を借りないと動かないコンテンツによるコミュニケーション促進や、指20本乗らないと動かない強制柔軟機器など、さまざまな用途が考えられますね。
アドオン:https://addons.mozilla.org/ja/android/addon/three-finger-swipe/
github:https://github.com/gomita/threefingerswipe

 

3.hATrayflood さん
・printplus
このアドオンは閲覧中のウェブページを PDF にするだけでなく、PDF化する際のフッタやヘッダ、紙の向きに対する最適化など、さまざまな細かい調整が可能となります。今回は、以前作ったこのアドオンを最新版の Firefox に対応するための開発をしておられました。
アドオン:https://addons.mozilla.org/ja/firefox/addon/printplus/
github:https://github.com/hATrayflood/printplus
ご本人によるレポート:http://karakurimono.biz/mozillathon2012/

 

4.luckpoint さん
・選択した文字列で検索できるようにコンテキストメニューを追加(モバイル)
デスクトップでできるけれども、モバイルではまだ未実装なモノはまだ沢山ありそうです。本作品もそのうちの一つと言えます。選択した文字列をデフォルトのサーチエンジンで検索できるモバイル用アドオンです。
アドオン:https://github.com/luckpoint/luckpoint.github.com/blob/master/assets/Mozilla_Hackathon2012/search_contextmenu_addon.xpi

・音声検索できるメニューを追加(モバイル)
iPhone の Siri などに見られるように、音声認識技術は日々進歩し、実用に耐えうるまでになってきました。本作品は、ブラウザ上で音声による検索を実現できるようにしたアドオンで、デバイス自体に音声認識機能が無い場合でも、音声による検索が可能となるはずです。モバイルになって、キーボードの存在が危うくなっていったとき、音声は有力な入力方法の一つとなっていくのでしょうね。実装ではアドオンの範疇だけでは間に合わず java にも変更を加えていたようです。
アドオン:https://github.com/luckpoint/luckpoint.github.com/blob/master/assets/Mozilla_Hackathon2012/recognize_speech_addon.xpi
ネイティブモジュール:https://github.com/luckpoint/luckpoint.github.com/blob/master/assets/Mozilla_Hackathon2012/fennec-17.0a1.en-US.android-arm.apk
ご本人によるまとめ:https://github.com/luckpoint/luckpoint.github.com/blob/master/_posts/2012-07-29-mozilla_hackathon2012.md

 

5.EnsekiTT さん
・我ログ
閲覧履歴をより細かく保持しておくためのアドオンです。ウェブと人の行動の関係を探る試みの基礎ツールとして開発をスタートしました。アドオン制作は初めてのことながら、HTML構造や閲覧した日時などを保持する機能が実装されました。

 

6.port4art さん
・ユーザが選択した複数の英単語の意味をデスクトップの通知を用いて表示する
Chrome 拡張機能にある英単語をハイライトすると該当英単語の意味が表示されるものの実現を目指しておられました。彼もアドオン制作は初めてのことながら、Addon-SDK の API にある selection および notifications を器用に組み合わせて実現していました。さらに、複数単語が選ばれたときにも対応し、選ばれると notifications によってバラバラとその意味が流れ出てくるようなアドオンが完成しました。全選択したらバグる の発言は笑いを誘っていました。
アドオン:https://www.dropbox.com/s/3av65nqg0l33330/port4word.xpi (今後掲載予定なはず)

 

7.y_system さん
・スーパー高校生の名言をランダムにアドオンバーに表示する
彼もまたアドオン制作は初めてでありました。今回作ったのは2つありましたが、一つ目は学生マーケティングにも参加されている凄腕スーパー高校生が放つ名言をアイコンをクリックすることでアドオンバーに表示するアドオンです。思わず、クリックせざるをえず、アドオンバーはすぐに満杯になっていきます。
アドオン:http://kamalab08.co.cc/files/wuitap.xpi

・京急の運行情報が通常かそうでないかを取り出して表示
ダァシエリエス、ダァシエリエス で有名な京急の、運行状態が通常かそうでないかを取り出してアドオンバーに表示します。地味ではありますが、彼にとっては確かに使えるアドオンなはずです。このような、自分が使うモノを自分で作るというコトが、今後もっと広まっていくことを熱望してやみません。
アドオン:http://kamalab08.co.cc/files/keikyu.xpi

 

8.dokan さん
・任意のサイト上にある、任意の要素を発見した際に、なんしか知らせるアドオン
彼もまた初のアドオン制作でした。ウェブページはさまざまな要素で成り立っていますが、その中から自分の見たい・知りたい要素があった場合にアドオンバーで表示するアドオンです。例えば、RSS が装備されているとか、やばいウェブサービスが埋め込まれていないかなどを発見することができます。開発のあとは学会の準備のための論文執筆。

 

9.dynamis さん
・fixprefix(モバイル)
ウェブページでは CSS でスタイルを決めていくことが普通のこととなってきましたが、まだ仕様が確定していないプロパティに関してはベンダープリフィクスが付加され、それぞれ実装されていきます。ウェブページによっては、Firefox でも実装されているものの、特定のベンダープリフィクスのみが指定されていてうまく表示できないこともあり、そのプリフィクスを -moz に置き換えて閲覧できるようにしようとするアドオンがこれです。残念ながら最後まで実装できなかったようですが、リモートデバッガの使い方を習得されるなど、これからの開発に役に立つ知見を得られたようです。

 

10.私
・kinect.js
昨今、外部デバイスとブラウザをつなぎ JavaScript で制御するコトに喜びを感じている私ですが、今回はちょっと考えるところあり kinect をつなげてみました。実装としては、kinect を叩くためのネイティブライブラリを作成し、js-ctypes でそれを呼ぶことで、JavaScript からの制御を可能としています。サンプルアプリケーションとして、任意のウェブページの各要素を手で触れ、その要素が何であるかを表示しつつどんどん壊していくものを作りました。ちょっとまだ遅いけど。
github:https://github.com/dadaa/kinect.js

 

以上がアドオン開発の部の成果です。それぞれがさまざまな領域においてブラウザを拡張することができました。すばらしいっす。