「FireMobileSimulator」の使い方

このページでは、「FireMobileSimulator」の基本的な使い方を書いています。使い方と言っても、難しい操作を要求されるわけではないので、アドオンの入れ方くらいに捉えてください。

オプション設定で「User-Agent」を変えたり、「ID情報」を変えたりできますが、当ページでは「パソコンでスマホの画面を確認する方法」だけを書いています。なお、「FireMobileSimulator for Google Chrome」の話になります。

以前は、「Firefox」のアドオンを利用していましたが、「このアドオンはお使いのバージョンの Firefox と互換性がありません」となってしまったので、「Chrome」のアドオンを使うようになりました。

「Firefox」のアドオンは、ソーシャルゲームを開発していた頃に使っていまして、当時の話は「ソーシャルゲームプランナーのお仕事」という本に書いてますので、気が向いたら見てみてください。

「FireMobileSimulator」の追加方法

「Google Chrome」を使用している前提で話を進めます。「Chrome ウェブストア」に行き、「FireMobileSimulator」で検索すると「FireMobileSimulator for Google Chrome」が表示されます。

「FireMobileSimulator for Google Chrome」追加画面

「CHROMEに追加」というボタンを押すと、「追加しますか？」と訊かれるので、「拡張機能を追加」を選びます。

少し待つと、「Chrome に追加されました」と出ます。それまで、「CHROMEに追加」と書かれていた箇所が、「確認しています...」と表示されます。

「FireMobileSimulator」の使用

「Chrome」に追加された丸いアイコンをクリックすると、「FireMobileSimulator」のメニューが表示されます。

端末名が並んでいますので、シミュレートしたい端末を選びます。無い場合は、「最新端末リストから端末を追加」を選択。ちなみに、「FireMobileSimulator」が起動しているときは、アイコンがカラーになっています。

端末を選択後、ブラウザを再読み込みすると、下のような画面になります。「枠が出ただけじゃん」と思って閉じないでください。ブラウザの横幅を縮めて再度読み込むと、モバイル端末で見たときの画面に切り替わります。

パソコンでの閲覧時には表示されないオーバーレイ広告なんかも出ます。ただ、あくまでもシミュレーターなので、実機で確認したときとの違いはあるでしょう。

補足みたいなもの

端末リストに追加したい端末が存在しない場合は、「追加したい端末が存在しない場合」という箇所をクリックすれば、案内が表示されます。それに従い、端末の追加作業を行うことになります。

「それは面倒」「端末っていうか、画面サイズだけ変えたい」というのでしたら、オプション設定にある端末設定で、スクリーンの横幅を変えれば済むかも。

サイト制作者にとっては、閲覧環境によって表示が変わるのは悩みどころ。色んな端末を片手にチェックはできないし、そもそも持てる機種にも限界があります。とはいえ、訪問者の利便性を考えると、まったくチェックしないわけにもいかない。そんな事情があるので、パソコンでスマホの画面が確認できるFireMobileSimulatorは、非常に有難い存在ですね。