AndroidやiOSの各機種・バージョンで検証したい人におすすめのRemote TestKit 〜HTMLメール作成の救世主〜

※ 本記事は[Qiita Engineer Festa 2022](https://qiita.com/official-campaigns/engineer-festa/2022)の **Remote TestKitを使ってレビューを書こう！** のテーマへエントリーする記事となります。

---

# 経緯

HTMLメールの作成って大変ですよね。
flexboxが使えず、テーブルレイアウトで書かなければいけないし、
古代のPC環境を使い続けている会社も送信対象となっているメールの場合、
とある環境で表示したときの崩れを修正したと思ったら、別の環境で表示したときに崩れてしまったり、
ネットでググってもドンピシャな記事が出てこなくて四苦八苦したり…。
参考：[HTMLメール作成のコツ・注意点](https://qiita.com/ymeeto/items/12001ff30c95729126c2)

中でも一番大変なのが、Android環境やOutlook環境で崩れないメールを作成することだと思います。
iOSやMac、WEBのGmailなどは思ったとおりの表示になってくれることが比較的多いですが、
上に挙げた環境や、古いWindowsやIEへの対応が必要だった場合は、相当キツい作業になると思います。

そんな、普段からキツいなぁと思いながら作成してるHTMLメールですが、
ある日、AndroidのGmailで表示した時しか再現しない崩れの修正をする必要がでてしまいました。

そのメールを作成した当時に使っていたHTMLメール確認用のサービスでは表示崩れが起きていなかったので、
崩れてしまう環境（Androidのバージョン等）を特定した上で修正を行わないといけませんでした。
そのため、複数の機種やバージョンのAndroidで実機テストする必要があったのですが、
手元にAndroidの端末がそんなに豊富にあるわけもありません。

そこで救世主となったのが、膨大な数のデバイス＆OSバージョンのスマホの中から
好きな機種をリモートでレンタルして検証できる **Remote Testkit** というサービスでした。

https://appkitbox.com/testkit/

# Remote Testkitについて

仕事で使っていた画面は公開することができないのですが、
Qiitaのキャンペーンでトライアルアカウントを利用させていただくことができるようなので、
個人用PCにもRemote Testkitを導入して、画面のキャプチャを撮影してみました。

UIは簡素ですが情報量は多く、必要十分といった感じです。

## レンタル画面

Remote Testkitは、以下のような画面でレンタルするスマホを選ぶことができます。
（アプリ版とWEB版でレンタルできる機種が変わるわけではないですが、
UIが違うのでどちらも撮影しました。）

iOS 4~15系 や Android 2~14系 をざざっと検索してみましたが、この選択肢の多さには驚きました！

|アプリ版 |WEB版 |
|---|---|
| ![app.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/365927/2625babd-9751-dc21-126f-300d82d2d2dd.gif) | ![web.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/365927/ae54eeb1-7f85-0348-c36e-044ac5cccb4b.gif) |


デバイスの総数は現時点で1132件もあるようです！（デバイス一覧は下記のリンクから確認できます！）

https://appkitbox.com/testkit/devicelist/

ご覧の通り選択肢は非常に多く、OSの各バージョンが網羅できるだけでなく、
数々の機種の中から選べるところにとても安心感を感じました。
iPadの用意もちゃんとあるのが嬉しいですね。

余談ですが、当時作業していたメールの崩れ問題は、Pixel6の環境だけは崩れずに表示される状態だったため、
それもあってメール作成当時に崩れが発生している事実に気付きにくい状況でした。
ですが、Remote Testkitで気軽に複数環境を検証できるおかげで、その事実をすぐに発覚させることができました！

というか、昔遠くに住んでる家族のiPhone操作をサポートしようと思って
iOSをリモートコントロールする手段を調べたことがあるのですが、そのときはやり方を見つけることができなくて諦めたんですよね。
このサービスではそれを実現できちゃってるところが凄いし驚きです。
AppleサポートとかでもiOSを直接操作してくれる事はなかった気がするので、
どういう方法で実現してるのか、めちゃめちゃ気になりました…。

## 返却するたびに初期化される安心感
機種を返却するたびにデータが初期化されるので個人用メールアドレスの登録も安心です。
端末にGoogleアカウントを登録していても、一度返却すればきれいサッパリ初期化されてます！
（レンタルするたびにGoogleアカウントの登録をしなければいけないですが、これは致し方ないですね…）

## レンタルしてみた

実際にレンタルしてみた感じは以下の通りです。
文字入力はPCのキーボードで直接行えるので、とても便利です。

**アプリ版**
|Android  |iPhone  |
|---|---|
| ![remote_and.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/365927/e4551806-b24a-93ca-7f44-03dd6f0b55e0.gif)  | ![remote_ios.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/365927/5d89da44-d462-c163-9529-5b496192d14f.gif)  |

**WEB版**
**Android**
![testkitWEBand.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/365927/52715d56-2238-1bd9-134e-441c5c92fe33.gif)

※ トライアルでは借りれる合計台数に制限があったようでiPhoneを借りる前に制限に達しちゃいました…^^;

レンタル時間は、レンタル時点では30分と60分しか選べませんが、
レンタル後に30分〜240分の時間延長ができます。
一度延長してから再び延長するためのクールタイムなどは無いので、
長い時間使う予定であれば最初に何回も延長すればOKです。

ただ、仕事で使っていたプランだと、借りる機種が一台であれば何時間でも借り放題だったのですが、
今回利用したトライアルアカウントだと、10分ごとに1チケット消費するようなので、延長するのは億劫でした。
そこは料金プラン次第で使い勝手が変わってくると思います
やはり一台だけでも借り放題のプランを契約したほうがいいと思いました。
（というより、チケット制はトライアル版だけの特別仕様だったのかな？）

料金プランはこちら
（しれっと書いてありますが、最低利用期間の３ヶ月で契約すると、[初月の使用料は無料](https://appkitbox.com/testkit/price/?entry=top03#:~:text=3%E3%83%B6%E6%9C%88%E9%96%93-,%EF%BC%88%E5%88%9D%E6%9C%88%E7%84%A1%E6%96%99%EF%BC%89,-%E3%81%AE%E3%81%9F%E3%82%81%E3%80%81%E3%81%8A)になるそうですｗ）

https://appkitbox.com/testkit/price/?entry=header

1台しか借りれないプランでも、
1機種検証するたびに返却する という使い方をすれば、複数環境の検証が可能です。

ただし返却後、再レンタルできるようになるまでに少々時間がかかるので、
変更を加えながら複数の環境で崩れが発生しないか確認する、という使い方はさすがにキツいです。
そのため、自分は一箇所で崩れないように修正して、概ねOKになったら機種変えて検証という使い方をしていました。

複数端末の間でやりとりする必要があるテストを行う場合は、２台以上のプランを契約するといいですね。

「最新・人気端末パック」という別料金のオプションがある事がすこし気になりましたが、
大体の場合、最新・人気端末パック限定のマークがついている機種と同じ機種が通常プランにも用意されているようなので
このオプションを契約しないと使えない機種がある という話ではなく、
最新・人気機種の在庫が＋αで追加される、といったイメージのようです。
選択肢を制限することでお金稼ぎをしようという姿勢ではないところに好感が持てました。

## その他の使い勝手
料金以外の使い勝手についても触れておくと、
リモートコントロール特有の遅延問題は、Androidはそこまでひどくないです。
多少ありますが、メールやアプリの検証程度では問題ないレベルでした。
iOSはちょっと重たい気もしましたが、通信環境や機種にもよるかもしれません？

ウィンドウサイズを調整して画面を拡大・縮小することもできます。
画面サイズを大きくするともっさりしやすいので、問題なければ小さめのサイズのままで検証した方がいいかもしれません。

## アプリの検証も可能

HTMLメール作成の際に非常に助かったので、この記事はそれを主軸にした内容になっていますが、
もちろん各OSのブラウザも同様に検証できますし、アプリだって検証できちゃいます！

私もHTMLメールだけじゃなく、アプリの検証でもこのサービスを利用することがありますが、
エミュレーターで再現できない動作の違いやWebViewの崩れなどが極稀にあるので、実機でテストできるのは安心です！

詳しい使い方・どんなことができるのかは、ぜひ公式サイトを確認してみてください。

https://appkitbox.com/testkit/doc/software_ui

https://appkitbox.com/testkit/doc/web_ui

# 余談

ところで、Remote Testkitにはとても感謝してますし、実際に助かりましたが、
そもそもの原因であるAndroidやOutlook、IEなど
環境ごとの崩れ方が違う・いろんな環境でざっとメールを確認しなければいけない
という問題にはいまだ悩まされています。

HTML作成が楽になるやり方、
作業を軽くするための技術・サービス等ご存知の方はコメントでどしどし教えてください！

[Can I use](https://caniuse.com/) のHTMLメール版である　[Can I email](https://www.caniemail.com/) は良いサービスだと思います。
参考：[HTMLメール版のCan I use！「Can I email」が誕生しました！！](https://www.mitsue.co.jp/knowledge/blog/frontend/201909/13_1407.html)