原文 作成日: 2012/10/29
PhoneGap advice on dealing with Apple application rejections

最近、開発者のコミュニティでは、Appleが「十分にネイティブではない」という理由でPhoneGapアプリの申請を却下しているという不満が聞かれます。このような申請却下自体は驚くようなことではありません。Appleには、App Storeで受け入れるものと、受け入れないものについて、厳密なルールとガイドラインがあります。筆者が驚いたのは、PhoneGapがその理由であると不平をもらしている人がいたことです。このような非難は適切なものではなく、この記事ではこの点を明確にしたいと思います。

AppleとHTML

最初に、AppleとHTMLについて説明しましょう。Appleでは、ユーザーインターフェイスがHTMLを使用して構築されているからという理由でアプリケーションの申請を却下しているわけではありません。実際、多くのAppleアプリやiOSの広告プラットフォームは、HTML、CSSおよびJavaScriptを使用して構築されています。例えば、Apple StoreおよびiAd広告プラットフォームは特に、ユーザーインターフェイスの主要メディアとしてHTMLを使用しています。Apple以外にも、HTMLで構築されたユーザーインターフェイスを持つアプリで成功したものとして、LinkedInWikipediaBBC Olympicsその他の多くのアプリがあります。

注意:前述のすべてのアプリでPhoneGapが使用されているわけではなく、これらはUIとしてHTMLを使用しています。

Appleでは、次のような条件を満たしていないアプリケーションの申請は却下されます。

  • 「アプリ」にふさわしいユーザーエクスペリエンスを提供している
  • iOSエコシステムになじんでいる
  • モバイルWebエクスペリエンスと差別化されている

この要件は、UIとしてHTMLを使用して開発されたアプリだけではなく、すべてのアプリに適用されます。アドビはAppleではないので、『App Review Guidelines』と『App Store Review Guidelines』(Appleから提供されている)以外の正確な承認ルールはわかりません。しかし、承認においてユーザーエクスペリエンスに重点が置かれていることは明らかです。つまり、ユーザーがどのようにアプリを操作し、デバイス上でどのような「操作感」であるかという点です。

Appleが提供している『iOS User Interface Guidelines』には、Appleのエコシステムで受け入れられるものと、受け入れられないものについて、多くの情報が記載されています。このUI Guidelinesで、Appleは「Webベースのデザイン」への対応を具体的に説明しています

「Webベースのデザインの再検討

Webから移行する場合は、ユーザーに、Webエクスペリエンスではなく、iOSアプリのエクスペリエンスを提供することを保証する必要があります。 ユーザーは、iOSベースのデバイスで、iOS上のSarariを使用してWebサイトを閲覧できるということを忘れないでください。」

HTMLおよび関連テクノロジーを使用して優れた「アプリ」エクスペリエンスを創造するためのヒントについては、『iOS User Interface Guidelines』を通読することをお勧めします。

『iOS User Interface Guidelines』に加えて、Appleの『App Store Review Guidelines』には、アプリの承認を得るためのヒントが示されています。次のようなヒントを含め、多くはHTMLベースのエクスペリエンスに関連しています。

  • 「2.12:有用性や独自性のないアプリ、Webサイトをアプリとしてバンドルしただけのアプリ、持続的な娯楽性の価値を提供しないアプリは、申請が却下される場合があります」
  • 「10.3:システムによって提供されるボタンやアイコンなどのアイテムを、正しく、『Apple iOS Human Interface Guidelines』の規定に従って使用していないアプリは、申請が却下される場合があります」
  • 「10.6:AppleおよびAppleユーザーは、シンプルで、洗練され、創造的で、よく考えられたインターフェイスに高い価値を見出だしています。これは時間のかかる作業ですが、それだけの価値があります。Appleでは高い基準を設定しています。ユーザーインターフェイスが複雑で、優れたものでない場合、申請が却下されることがあります」
  • 「12.3:単なるWebクリッピング、コンテンツアグリゲーターまたはリンクのコレクションであるアプリは、申請が却下される場合があります」

前に述べたように、アドビはAppleのルールやプロセスのすべてを熟知しているわけではありませんが、次のような場合には、申請が却下される可能性があります。

  • アプリがPhoneGapでラッピングしただけのWebサイトである場合、申請が却下される可能性があります。このケースにも例外はありますが、WebサイトをラッピングしてWebビューにしたものでApp Storeに参入できると期待しないでください。
  • アプリでコンテンツを表示するために、(Webサイトと同様に)ユーザーがピンチ、ズーム、パンする必要がある場合、申請が却下される可能性があります。アプリにはアプリにふさわしい操作感が必要であり、直感的に操作できる必要があります。ユーザーがアプリの機能について調べる必要がないようにしてください。また、何か役に立つものを入手するために、ユーザーが過去のナビゲーションコンテンツに移動する必要がないようにしてください。
  • アプリがハイパーリンクを含むページ上のテキストのような外観である場合や、ネイティブなスタイルを備えていない場合、申請が却下される可能性が高くなります。

App Storeの承認の境界線はあいまいに見える場合があり、評価対象の個々のアプリに特有です。各アプリは、それぞれのメリット、機能およびユーザーエクスペリエンスに基づいて検討されます。また、『iOS User Interface Guidelines』および『App Store Review Guidelines』は常に変化するドキュメントです。新しいバージョンのOSがリリースされたり、新しいアプリのデザインによって新しい問題が提起されたときには、変更される場合があります。これらのガイドラインを定期的に見直してください。

PhoneGap

次に、PhoneGapとはいったい何であるのか、これまでに説明した文脈とどのように関係するのかを見てみましょう。PhoneGapのFAQでは、「PhoneGapは、クロスプラットフォームのモバイルアプリを、HTML、JavaScript、CSSなどの標準ベースのWebテクノロジーを使って構築するためのオープンソースソリューションです」と説明されています。PhoneGapについてさらに詳しくは、筆者の以前の記事「PhoneGapビジュアル解説」(英語)を参照してください。PhoneGapは、HTML、CSSおよびJavaScriptを使って構築されたユーザーインターフェイス要素のコンテナとして機能します。PhoneGapによってHTMLエクスペリエンスがラッピングされます。これにより、アプリは、JavaScriptを使用してオペレーティングシステムのネイティブ機能を操作できるようになります。また、PhoneGapは、App Storeで配布できるように、アプリケーションをパッケージ化する機能も提供します。

PhoneGapを使用することによって、次のようなAppleのルールやガイドラインから解放されるわけではありません。PhoneGapアプリケーションは、ユーザーインターフェイスがWebテクノロジーを使って構築されているからという理由で、直ちに受け入れられないわけではありません。

PhoneGapは、開発者に代わってUIを構築することや、Appleの任意のガイドラインに準拠することを目指しているわけではありません。PhoneGapアプリケーションを構築するときには、デザイナーや開発者がUI/UXを管理し、特定のプラットフォームやエコシステムのガイドラインに対応させる必要があります。PhoneGapアプリケーションを設計、開発するときには、アプリケーションの「アプリにふさわしい操作感」と「ネイティブな操作感」を実現するために、何が必要であるかを検討してください。これらの検討事項の多くは、次のいずれかのカテゴリーに分類されます。

ユーザーインターフェイスのスタイル

最初に、アプリケーションについて次の点を考えてみてください。

  • アプリは、プラットフォームと一貫性のあるユーザーインターフェイスのパラダイムに従っていますか。
  • アプリケーションはどれくらいビジュアルに表示されますか。
  • アプリケーションはHTMLページに似ていますか。それとも、ビジュアルな「コントロール」やタッチに最適化されたインターフェイス要素を備えていますか。

2つのアプリケーションの表示を見てみましょう。どちらもFresh Food Finderと呼ばれる、App Storeで実際に提供されているオープンソースのPhoneGapアプリケーションの表示です。

PhoneGapエミュレーターによってキャプチャされたこの2つの画像は、まったく同じアプリケーションからキャプチャされたものです。左側の画像では、HTMLコンテンツが表示されていますが、CSSスタイルシートが適用されていません。ビジュアルエクスペリエンスを比較すると、左側のアプリケーションはWebページコンテンツのように見えます。アプリケーションのエクスペリエンスで期待されるような外観を提供するスタイルが設定されていません。反対に、右側の画像はアプリのような外観です。ナビゲーション要素を含むヘッダー領域があり、スクロール可能なコンテンツ領域があり、各リストアイテムにはユーザーに次のエクスペリエンスやワークフローを示すUI要素が用意されています。

まず、これはWebビューでラッピングされた単なるWebサイト(筆者のweblog)です。Appleは、ネイティブシェルでWebサイトをラッピングする方法には難色を示しています。ラッパーはロジックを含まない空のシェルで、単にリモートWebサイトを参照するだけです。この場合、オフラインのシナリオではエラーとなります。また、モバイルWebエクスペリエンスと差別化されておらず、このようなエラーを相殺するだけの付加価値もありません。

次に、ユーザーインターフェイスがモバイルエクスペリエンス用に最適化されていません。ユーザーは、コンテンツを読むために、ピンチやズームのジェスチャを実行する必要があります。さらに、タッチ対応のナビゲーションもなく、ナビゲーションとコンテンツの明確な区別もなく、全体的なエクスペリエンスにアプリにふさわしい操作感が備わっていません。

ネイティブアプリケーションの隣に配置したときに、「違和感のない」アプリケーションを開発してください。個々のネイティブUIスタイルをすべて模倣する必要はありませんが、ユーザー操作のパラダイムは同じである必要があります。ユーザーインターフェイスは直感的で、わかりやすいものにしてください。アプリにふさわしいエクスペリエンスとはどのようなものであるかを考えるときには、既に一般に公開されている他のアプリを見て、既にAppleによって承認されているデザインを調べてみてください。次のようなWeb上の多くのリソースで、既存のアプリのユーザーインターフェイスが比較されています。

HTMLエクスペリエンスをネイティブな操作感に近づけるために役立つツールやフレームワークも数多く存在しています。ここでは、そのいくつかを示します。

この一覧に示したものはほんの一部に過ぎません。多くのフレームワークは、ネイティブに似たエクスペリエンスを模倣しています。また、フレームワークを使用せずに、独自のインタラクティブエクスペリエンスを作成することもできます。

インタラクティブ機能とパフォーマンス

ユーザーがHTMLリンクをクリックして別のページを読み込むする必要がある場合や、ビュー間で連結されていないトランジションがある場合、エクスペリエンスの最適化が必要である可能性があります。Appleでは、統一された操作感と継続的なエクスペリエンスを提供するアプリケーションが好まれるようです。ユーザーがアプリ内でアクションを実行するときに、現在の「ページ」がアンロードされ、新しいページが読み込まれるような印象を受ける場合、このトランジションをよりシームレスなものにする処理を行います。データの非同期読み込みとコンテンツの動的な更新を備えた、単一ページのアーキテクチャを導入してみてください。または、ページ間のトランジションをより軽く、より高速にして、ユーザーエクスペリエンスの中断が少なくなるようにしてみてください。

アプリケーションのデータを入出力するプロセスとエクスペリエンスを最適化します。最初に、必要なデータだけを、軽量な形式で送信することによって、データトランザクションのオーバーヘッドを最小化します。この最適化によって待ち時間が短縮され、データを要求してから画面に表示されるまでの合計時間が短くなり、一般的にアプリが「速くなった」ように感じられます。

アプリケーション内のすべてのトランジションとアニメーションに注意を払います。このようなアクティビティには、あるビュー画面から別の画面へのトランジションや、HTMLエクスペリエンス内での要素のアニメーション化が含まれます。アプリがもたついたり、点滅したり、最適なエクスペリエンスが提供されない場合は、画面上でアプリの要素を移動する方法を再検討します。CSSスタイルのみを使用して、HTML DOM要素のGPUレンダリングを強制的に実行する手法を検討します。多くの場合、これらの手法によって、全体的なアプリケーションのパフォーマンスを向上させることができます。

さらに、不確定なプログレスバーやアニメーションによるスピナーなどのシンプルなニュアンスを追加することによって、サーバーとのトランザクションなど、時間がかかる処理の実行中のステータスを提供します。これらのUIインジケーターは、アプリケーションの操作感をより高速で、「ネイティブ」なものにするのに役立ちます。

最後に(しかし、重要でないというわけではありません)、アプリケーション内での応答時間に注意します。これらの応答時間は、ユーザーアクティビティの処理やサーバーからの応答時間に関連している場合があります。Appleでは、一般的に、処理の遅いアプリケーションや応答性の低いアプリケーションは好まれません。サーバーからデータを読み込んで使用できるようになるまでに時間がかかる場合、Appleはアプリの申請を却下することがあります。同様に、ユーザーがボタンをクリックしたときに、数秒間何も起こらない場合、この鈍い動作が却下の理由になる可能性があります。アプリケーションは、バックグラウンドで処理が行われているときでも、一定レベルのインタラクティブ機能とフィードバックをユーザーに提供する必要があります。

次のステップ

結論として、ユーザーエクスペリエンスには注意を払ってください。Appleの承認プロセスは、アプリによる処理の対象と処理の方法によって異なります。PhoneGapを使用することが、Appleが提供する『App Review Guidelines』や『App Store Review Guidelines』を遵守しなくてもよいという意味であるとは考えないでください。一般的に、Appleではアプリケーションの品質と全体的なユーザーエクスペリエンスに細心の注意を払っています。アプリケーションのパフォーマンスが低い場合、バグが多い場合、外観が美しくない場合や、モバイルWebエクスペリエンスと差別化されていない場合、App Storeでの申請が却下される可能性があります。Appleでは、自社のエコシステムで受け入れるアプリケーションの品質について、非常に高い基準を設定しています。高品質なユーザーエクスペリエンスに力を入れるほど、成功する可能性は高くなります。

アプリケーションのエクスペリエンスを向上させ、よりネイティブな操作感を実現する方法の例については、人気のあるUntappdアプリケーションの作成者であるGreg Avola氏がADCに投稿した記事「Creating apps with PhoneGap: Lessons learned」(PhoneGapによるアプリの作成:学んだ教訓)を参照してください。

現在、新しいコメントシステムに移行中であるため、コメントの投稿は受け付けておりません。しばらくの間、ご意見やご感想をお寄せいただく場合は、フィードバックフォームをご利用ください。ご迷惑をおかけしますが、どうぞよろしくお願い申し上げます。