ホーム‎ > ‎Building Blocks‎ > ‎

Progress & Activity


ホームページ移転のお知らせ
1月1日にリニューアルを実施いたしました。
これに伴い、ページのURLが以下のアドレスに変更となりました。
http://android-design.teamegg.co.jp/
お手数をおかけしますが、リンク集やお気に入り登録情報などの修正をお願いします。

プログレスとアクティビティ


プログレスバーとアクティビティインジケータは、現在何かが起こっていることをユーザに通知するためのシステムです。

プログレスバー

プログレスバーは作業が終了した割合を表示するためのシステムです。これにより、ユーザに残りの操作にどのくらい時間がかかるかを素早く伝えることができます。


プログレスバーはいつでも0%から100%に向かって増加し、小さい値に戻ることはありません。複数の処理が同時に起こっている場合は1つのバーが100%に達した時に他のバーが0%に戻らないように、作業全体のパーセンテージを表示するべきです。


HoloDarkとHoloLightのプログレスバー

アクティビティインジケータ

アクティビティインジケータは処理の終了時間がはっきりしない際に使用されます。ユーザに裏で起こっていることついては示さず、処理が終わるまでの間少し待つことを求めます。

アクティビティインジケータにはバーとサークルの2つのスタイルが用意されています。いずれも、Holo Light and Holo Darkテーマの両方で、様々なサイズのインジケータが提供されています。周囲の状況に適したスタイルとサイズを選択してください。例えば、最も大きいアクティビティサークルは、何も表示されていないコンテンツエリアでうまく動作しますが、小さなダイアログボックスでない場合があります。各操作は1つのアクティビティインジケータで表さなければいけません。


  1. アクティビティバー
    この例ではアクティビティバー(Holo Dark)が、ユーザが最初にダウンロードをリクエストした時に表示されます。これはダウンロードが始まるまでの時間が不確定であるためです。ダウンロードが始まるとすぐに、アクティビティバーはプログレスバーに切り替わります。



  2. アクティビティサークル
    この例では、Eメールをダウンロードするのにどのくらい時間がかかるか判断することができないので、メッセージがロードされるときにGmailアプリケーション内でアクティビティサークル(Holo Light)が、使われます。


    アクティビティサークルを表示する際に、アプリの動作内容を示すテキストを表示してはいけません。動作するサークルはそれ単独で十分に今が待ち時間であることを示しており、最小限の表示で十分ユーザに理解させることができます。


インジケータのカスタマイズ

標準のプログレスバーとアクティビティインジケータはほとんどの状況に適応して動作し、Androidアプリの一貫したエクスペリエンスを維持するために、可能なら常に使用されるべきです。しかし、一部の状況ではカスタムしたインジケータを使うことがあるでしょう。

例:
全てのGooglePlayアプリ(Music、ブックス、ムービー、マガジン)に関連する項目については、それぞれの項目のダウンロード状態を常に、トップレベル画面に表示したかった。ダウンロード状況のステータスは:
  • 未ダウンロード
  • 一時的なダウンロードが完了
  • デバイスへの永続ダウンロードが完了

ダウンロードがすぐに完了するわけではないので、ダウンロードの進捗状況を1つずつ示す必要があります。

GooglePlayアプリには様々なレイアウトのコンテンツが含まれています。それらの中には画面表示スペース上に制約のあるものがあり、インジケータの表示が困難でした。

インジケータを表示することでトップレベル画面が煩雑になったり、カバーアートと競合させたくなかったので、我々は小さな領域で全ての情報を示すことができるカスタムインジケータをデザインし、必要に応じてそれがコンテンツ上に表示されるようにしました。


色は、それがダウンロードされたか(青)、ダウンロードされていないか(灰色)を示します。ピンの外観は、ダウンロードが永続的(白、まっすぐ)か、一時的(灰色、斜め)か示します。状態が変化する過程にある場合は、進捗は動く円グラフで示されます。

異なるレイアウトのGooglePlayアプリ間で、同じカスタムインジケータが各項目で表示されます。任意の画面デザインに組み込むことができる小さなまとまりの中で、進捗と同時にダウンロード状態を伝えます。

標準的なインジケータではニーズを満たせない場合(スペースの制約、状態の複雑さのため)、インジケータをすべて自分でデザインしてください。標準的なインジケータと視覚的な特徴を一致させることで、Androidアプリの統一感を保つことができます。この例では、円形の上、色合いが同じ青色、フラットでシンプルなスタイルを含めました。



原文はこちら > Progress & Activity

Except as noted, this content is licensed under Creative Commons Attribution 2.5. For details and restrictions, see the Content License.

Comments