モバイルシミュレータにさようなら。モダンブラウザでモバイル開発

Webクリエイターの皆さん、こんにちは。十円玉です。

皆さんは、モバイルブラウザアプリケーションやサイトをどうやってデバッグ(テスト)していますか?
ふたつみっつ昔ですと、各ケータイキャリアよりモバイルシミュレータが出ていて
それを見ながらパチパチソースの手直しをしていたと思います。
一番堅実な方法が、実機でのテスト。
もっとラクな方法だと、ブラウザのUserAgentを上書きしていらっしゃったことでしょう。
iPhoneならiOS SDK、AndroidもオープンソースのSDKでエミュレートできますよね。

この遠回りでややこしいモバイルテストを、モダンブラウザでいっぺんにやってしまいましょう!
それがコチラ。
FireMobileSimulator(Firefox版)
GoogleChrome版

コイツがあれば、もう色々なソフトを立ち上げて非効率的な開発をしなくて済むようになります。

端末の着せ替え(プラグインの設定から機種を逐次追加でき、90年代の機種から最新機種まですべての端末を使用可)は勿論のこと
・UserAgentの変更
・絵文字の表示
・画面サイズの再現
・GPSのシミュレート
・端末固有ID端末情報の細かい設定 ※ガラケーに限る
などなど、モバイルシミュレータとしては不足のない機能性を併せ持っており

更には、アドオン(拡張機能)との組み合わせでデバッグ環境を組むことが可能。
※下記はFirefoxでの例
・LiveHTTPHeaders:HTTPリクエストヘッダの監視
・WebDeveloper、FireBug:DOMソースコードの書き換え、クッキーや動的スクリプトのデバッグ

ちなみに、au W64Sでモバイルサイトをシミュレートさせるとこうなります。

mb_sample

ちなみに、スマホ特有のタッチ操作等、再現が難しいものは多少なりともあります(´・ω・`)
デザイン、UIのデバッグとしてお使いになってみては?

コメント

タイトルとURLをコピーしました