Designers Hack - デザイナーズハック

Web やアプリのデザイナーか「技術にしばられないでデザインを考えていく」コミュニティ。
月1回の定例MTGと年に数回のデザイン中心ハッカソンなどをしています。

  

「さわってみよう Firefox OS」に参加の方へ

未分類

2012.11.02

もう明日にと迫った「さわってみよう Firefox OS」ですが、いくつかお知らせがあります。

いろんな楽しみ方をしてもらうために、セッション後は自由にさわる時間をとっています。
こちらから「これをやってください」というわけではなく、それぞれがやりたいことをもとに形にしていくのを、スタッフが手助けできる形を考えています。

実機をさわるだけでもいいのですが、せっかくなので少し自分でカスタマイズなりアプリ作成なりがその場でできるようにするために、下記注意事項をごらんいただき、少しだけ事前準備をお願いいたします。

実機について

たぶん合計で10台ほど準備できると思います。ひとり1台はありませんので、グループで使ったり、順番に使って試したりしてください。


ほんの一部です。

Firefox OSの動作について

現時点ではまだまだ開発段階です。かなり動作が遅かったり、なにかの拍子にいきなり動かなくなったりする可能性もありますが、ご了承ください。

Firefox OSの実機への転送について

当日作ったりカスタマイズしたりしたものは、できるだけ実機に転送してその場で確認できるようにしたいのですが、転送できるマシンが1台しかありません。

ものすごく時間がかかったり、転送待ちの時間なども発生すると思いますが、ご了承ください。

全体的に

なにか競争して作ることは考えておらず、「ゆるくさわってみる」ことに重点を置いています。また、なにかしら来た人たちで情報交換したり交流ができたらいいなと思っています。

事前準備について

Firefox OSのPCでのシミュレーターのようなもの

【かんたん】r2d2b2g(PC版Firefoxのアドオン)をインストールしておく

Firefoxを16.xにし、下記ページより該当するOSのものをインストールしてください。

  • r2d2b2g

 
該当するOSのものをインストールしてください。

インストールすると、「ツール」内に「Firefox OS Simulator」が出てきます。

新しいタブが開きますので、左カラムの「Stopped」となっているところをクリックします。

「Running」になりました。

シミュレーターが立ち上がります。
これでなんとなくどんなものかというのはわかると思います。

#r2d2b2gはWindows 8だとうまく動かないようです。

【ちょっとむずかしい】「Firefox OS デスクトップ」をインストールしておく

コマンドを使って「Firefox OS デスクトップ」をインストールすると、より本物のOSに近いものが再現できるようです。下記 さんのブログを参考にしてください。

#途中、「gaia」をダウンロードするところがありますが、この「gaia」がフロント部分の実装コードになるようですので、ちらっと見てみておくといいかもです。

自分で作ったアプリを実機にインストールしてみたい方

特に準備は必要ありません。ふつうにスマホのWebアプリを作成してください。
確認はAndroid版Firefoxがベストですが、それで確認ができても動かない可能性もあります(逆にいうとどこまで動くのか試してみたいところもあります)。

既存アプリのデザインをカスタマイズをしてみたい方

上記gaiaのソースは、gitを使わなくても、こちらのGithubのタブの右端あたりからダウンロードできます。
ただ、このソースコードをそのままローカルで見ても(ローカルのサーバーをたてても)うまく動きません。

別のところからとってきたソースコードがありますので、それを使って自分のPCのFirefoxで見栄えを確認しながら調整をすることができますので、お渡しします。

また、かんたんにデザインを変えられそうなアプリは次のとおりです。

Setting

SMS

ブラウザ

FMラジオ

タスク(Todo)

いいと思われたデザインは、MozillaのやっているFirefox OSのギャラリー(?)に掲載してもらえるそうです。

ちなみに、ちょろっと変えてみたらこんな感じになりました。

その他あったほうがいいもの

ローカルのサーバー環境

  • MacだとMAMPとか
  • WindowsだとApatchとか

ほかにも…

当日、Mozillaの浅井さんに聞いて、もっと他のこともできるかもしれません。
そのあたりは臨機応変によろしくお願いいたします。