ホーム画面 稼働状況の可視化について

[keiji]

#192 でいただいたコメントを受けて調整したデザインを公開します。

また、このDiscussionの各コメントに開発チームからのコメントをリプライの形で書き込んであります。
数が多いので簡素な書き方になっていますが「皆さんからのご意見、本当にありがたく、感謝しています」とのことでした！

以下、元になったIssue（ #192 ）のDescriptionです。

---

接触確認の状況について表示する機能（#128）と、接触確認が有効になっていない（設定の関係で正しく動作しない）ケースで利用者をナビゲートする画面について、UIデザイン案がきたので公開します。

わかりやすさ、伝わりやすさ、アクセシビリティの観点から意見をいただけると嬉しいです。

いただいた意見は随時検討して、取り込めるところは取り込みたいと考えています。
なお、#186 で課題が明らかになった情報設計についてはこのデザイン案には含まれていません（別途起案中です）。

[Takym]

下記の案と似ていますね。
Covid-19Radar/Covid19Radar#534
Covid-19Radar/Covid19Radar#705

[keiji]

背景に直接情報を配置することで、利用者にUI各部の優先順位をわかりやすく提示しているのだなと思ってい見ていました。
同じ方向性で以前にも提案されていたんですね。

[i-maruyama]

とても、いいですね。

• 「接触有無の最終確認日時」と「陽性者との接触の確認」が、難しいところですが、やはりあいまいです。一般ユーザーから見れば、接触有無の最終確認日時＝ボタンを押した時刻でも、あります。ボタン押しても日時が更新されないから、バグだと思われる可能性もあります。

以下私見ですが、（ #197 で述べたように） FetchExposureKeyAsync ＝「接触を確認する」という事にすべきと思います。例えば、ボタンで「接触を確認」しようとしても、TEKが最新なら、submitBatch は動作しないことになります。

おそらくこのsubmitBatch の実行成功の最新日時を、「接触有無の最終確認日時」と表記されていると思います。この代案が非常に難しいのですが、一つだけあげておきます。
-- 接触有無の最終確認日時 （現状１１文字)
-- 新規陽性者との接触確認　（意図：日時は削除可能。ボタンで「接触を確認」しようとしても新規陽性「登録」者がいなければ、この日時は不変になるのも分かる。あと新規の情報は、みんな欲しい）

• 「接触有無が確認できません」については、上記のように難しいところです。なので、タイトルについては、「動作中」、「正常に動作していません」、「停止中」の三つで良いと思います。
• あと、通信の確認不可で「通信環境をご確認の上、再起動・・・」とありますが、これでは、省エネモードによるバックグランド停止が除外されており、しかもこの場合には何度再起動しても同じです(追記：正確には、再起動すれば接触確認は行われますが、問題は解決しないという意味です）。ここは、いっそのこと、一切の指示を無くしてHPへ誘導し、そこに原因と対処法の最新情報を掲示してはいかがでしょうか？

ちなみに、いま充電状態も表示させながらバックグラウンドテストしてるのですが、省エネモードは、充電して100%になると自動解除されるのを、今日知りました。このおかげで、COCOAのバックグラウンド動作が動いている人もいそうです。

[keiji]

開発チームよりコメント

「陽性者との接触の確認」が、難しいところですが、やはりあいまいです。

「陽性者との接触を確認する」ボタンのラベルを、「陽性者との接触結果を確認する」に変更し、ユーザーが誤解しない表現にする。

ここは、いっそのこと、一切の指示を無くしてHPへ誘導し、そこに原因と対処法の最新情報を掲示してはいかがでしょうか？

詳細説明を省き、「対処方法を確認」ボタンを設置して厚生労働省のFAQページにアンカーリンク付きで誘導。

[yoshitomo-g]

ものすごくすっきりした感じがします。上下の余白が広がったからでしょうか。
以下、気になったところです。

共通

対象：ボタンラベル「陽性者との接触を確認」
@i-maruyama さんも仰っているように、処理の結果を表示するだけなので表現を変えたいところです。「～を見る」という案も浮かびましたが、非視覚的な利用も考慮すると良くないよなぁという思いもあります。

接触有無の確認不可

対象：テキスト「接触有無が確認できませんでした。」
提案：「接触有無の確認ができていません。」
理由：確認できない状況が進行中なので。

また、@i-maruyama さんの次の提案に賛成します。1行で説明するのは無理だと思いますので。

ここは、いっそのこと、一切の指示を無くしてHPへ誘導し、そこに原因と対処法の最新情報を掲示してはいかがでしょうか？

接触通知の停止中

対象：ボタンラベル「設定を変更」
提案：「理由を確認する」
理由：直接設定変更に進むのではないので。

[keiji]

開発チームよりコメント

対象：ボタンラベル「陽性者との接触を確認」

「陽性者との接触を確認する」ボタンのラベルを、「陽性者との接触結果を確認する」に変更し、ユーザーが誤解しない表現にする。

対象：ボタンラベル「設定を変更」
提案：「理由を確認する」

ラベルを「対処方法を確認」に変更。
詳細説明を省き、「対処方法を確認」ボタンを設置して厚労省のFAQページにアンカーリンク付きで誘導。

対象：テキスト「接触有無が確認できませんでした。」
提案：「接触有無の確認ができていません。」

確認できなかったことで本表示がなされているため、現状の文言で問題ない認識。

（有山より補足）「確認ができていません」という文言は、たとえば一定期間確認できていないとか、設定の問題などでこれからも確認できる見込みがない場合には良いのですが、たまたま確認できなかっただけ（継続性がない）パターンが考えられる場合は「確認できません

[yoshitomo-g]

@keiji さん
最後の補足が途切れているように見えるのですが、いただいたコメントの咀嚼をしたいので、続きがあるようでしたらいただけますでしょうか。

[keiji]

本当ですね。

（有山より補足）「確認ができていません」という文言は、たとえば一定期間確認できていないとか、設定の問題などでこれからも確認できる見込みがない場合には良いのですが、たまたま確認できなかっただけ（継続性がない）パターンが考えられる場合は「確認できませんでした」の方が、次の行動につながりやすいと考えています。

みたいなことを書いたと思います。

[yoshitomo-g]

ありがとうございます。

以前（5月27日）のデザインでは確認が出来なくなった最初の日時が表示されていましたので、短期間かどうかの違いはあっても継続中という認識でした。

新しいデザイン（6月23日）では日時の表示がなくなったことで、1行目だけでは継続性の有無を判断できなくなりました。
また、2行目が「解決のため、対処方法を確認してください。」に変わっていますが、ここからは何か対処をしないと解決しないのだと感じました。この感じ方が狙い通りではないのなら、「翌朝になっても」や「24時間経っても」のような文言を追加することを提案します。問い合わせフォームの「24時間以内に自動返信メールが届かない場合は～」というメッセージのように、時間経過で解決する可能性があると伝えることを意図しています。

[Meiryo7743]

接触通知のステータス欄について

直下にある「利用期間」や「陽性と診断されたら」と同じようにカード型の UI に統一した方が自然に見えそうです。

このアプリでは，ある一つのことに係わる情報を 1 つのカードに集約するデザインを採用しています。さらに，接触通知が停止しているときには，ボタンが表示されるわけですから，敢えて首尾一貫した見た目にしない理由が思い浮かびません……。（ボタンの配色も同様です）

「接触有無が確認できません」について

「接触有無が確認できません」→「エラー」のようにシンプルな文言はどうでしょうか。直後にその理由を説明する欄が設けられており，わざわざ見出しで詳しく述べる必要はないと考えます。いずれにせよ，他言語への対応も考慮すると，より簡潔に表現できないか検討の余地がありそうです。

エラーの対処法については，上で提案されているようにウェブページへ誘導する形式が望ましいでしょう。実装にあたっては，そのページを開くボタンを配置するのが良さそうです。

「本アプリを広めましょう」の部分

デザイン案では「COCOAを周りの人に知らせる」に差し替わっています。こちらの部分も変更するのでしょうか？　あるいは，旧版のデザインを基に編集した結果生じた単なるミスなのか……少しばかり気になってしまいました（恐らく後者だと推測しております）。

[keiji]

開発チームよりコメント

直下にある「利用期間」や「陽性と診断されたら」と同じようにカード型の UI に統一した方が自然に見えそうです。

現状のカード型UIは、一つ一つが機能の入り口を示す括りとなっている。動作状況はアプリそのものの状況を表す機能のため、あえて背景上に表示している。
デザイン全体の整合性を取るならば現状で進めるのが良いと考える。

「エラー」のようにシンプルな文言はどうでしょうか。

エラーのパターンを作成しました。

エラーの対処法については，上で提案されているようにウェブページへ誘導する形式が望ましいでしょう。

詳細説明を省き、「対処方法を確認」ボタンを設置して厚労省のFAQページにアンカーリンク付きで誘導。

[keiji]

「COCOAを周りの人に知らせる」と「アプリを周りの人に知らせる」についてはぼくの方で確認が漏れていました。
現状の「アプリを周りの人に知らせる」のままになると考えていますが、混ざっているのは混乱の元なので確認します。

[tatsu-jp]

スッキリとして良いと思います。

OS/アプリの各役割や仕様を理解していないユーザーの視点で見ると、各ステータスが以下のように見える可能性がありそうだと感じました。各ステータスをどのような定義で考えているのを教えていただけると助かります(以下とは違う気がしています)。

「動作中」：接触確認(OS)ができている && 1日1回の定期チェックが成功している(日時から判定)
「接触有無が確認できません」：接触確認(OS)ができていない？何かに失敗している？
「停止中」：接触確認アプリを利用する上で必要な設定が有効になっていない

「接触有無が確認できません」は捉え方が複数あります。皆さんが提案されているようにQ&Aへ誘導するか、もう一つの案としては定義を絞る方が良いと思います。例えば、「接触有無が確認できません」=「定期チェックに失敗した(ダウンロードに失敗した)」という定義にして、単純に「毎日の接触確認処理に失敗しました」と表示した方が何が起きたかが分かりやすいと思います。ログを送付するへのリンクも表示することで、ユーザーがトラブル時のログ収集に協力しやすくなるのではないかと思います。

他の観点では、ステータスを細分化すべきかどうかも議論できればと思います。以下のように「接触有無が確認できません」というステータスを無くし、「動作中」の横のチェックマークアイコンを警告アイコンに変える表現でも十分なように思います。1日1回の定期チェックが成功しているかどうかは日時情報から判定可能ですし、2つのステータス(動作中/停止中)しかないので単純で分かりやすいと思うためです(警告時には、ポップアップ内の文字列を変える等の工夫があると分かりやすいかもです)。

「動作中(OK)」：接触確認(OS)ができている && 1日1回の定期チェックが成功している(日時から判定)
「動作中(WARNING)」：接触確認(OS)ができている && 1日1回の定期チェックに失敗した(日時から判定)
「停止中」：機能を利用する上で必要な設定が有効になっていない

[keiji]

開発チームからのコメント

「接触有無が確認できません」は捉え方が複数あります。皆さんが提案されているようにQ&Aへ誘導するか、もう一つの案としては定義を絞る方が良いと思います。

詳細説明を省き、「対処方法を確認」ボタンを設置して厚労省のFAQページにアンカーリンク付きで誘導。

ステータスを細分化すべきかどうかも議論できればと思います。以下のように「接触有無が確認できません」というステータスを無くし、「動作中」の横のチェックマークアイコンを警告アイコンに変える表現でも十分なように思います。

アイコンを分けるのであれば文言も分けたほうがユーザーが理解しやすいため。

[kvaluation]

最終確認の日時

　最終確認の日時の表示に賛成です。ありがとうございます。

　** 最終確認日時が「最新」であれば、最新であることをお伝えできたらより良いと思われます。 **

　一案としては、最終確認日時が「今日」か、今日でないかを表示でき、今日であれば、運用上、最新であると評価できます。
　「朝6時以降に、＜今日＞がでていなければ、もう一度起動してみてください」と保健所等の関係機関にもご説明できるかと思われます。
　＜今日＞がでていれば最新の陽性登録との照合済みですとご案内できます。

画像の日時

　接触有無の最終確認日時は、0:30から5:00ぐらいという現状にあわせるのが良いかと思います。Android側の時刻は12:30であれば、同日のお昼と思われます。

接触有無が確認できません

　素晴らしい機能でありがとうございます。
　「接触確認アプリCOCOAを再起動する」ボタンを配置できないでしょうか。
　「再起動をお試しください」で再起動の仕方など保健所等への電話問合せが増加したりしないようなご配慮をお願い申し上げます。
　

[keiji]

開発チームからのコメント

最終確認日時が「最新」であれば、最新であることをお伝えできたらより良いと思われます。

最新確認日時に文言修正

「接触確認アプリCOCOAを再起動する」ボタンを配置できないでしょうか。
「再起動をお試しください」で再起動の仕方など保健所等への電話問合せが増加したりしないようなご配慮をお願い申し上げます。

（有山）今回はFAQにリンクする仕様を選択したため、再起動ボタンを不採用となりました

[heykuro]

@Meiryo7743

ご意見ありがとうございます。

デザイン案では「COCOAを周りの人に知らせる」に差し替わっています。こちらの部分も変更するのでしょうか？　あるいは，旧版のデザインを基に編集した結果生じた単なるミスなのか……少しばかり気になってしまいました（恐らく後者だと推測しております）。

こちら前者の方となります。COCOA自体が特性上、あまり立ち上げられないアプリではあるので、そこからシェアをされるということ自体が少ないのではということで今回のデザイン変更の中で全体のバランスも見つつ変更されています。このあたりもご意見あればいただけますと幸いです！

[Takym]

ページ上部の「動作中」について、背景を非表示にすると「壊れている」という印象を（少なくとも僕は）受けますので、背景を非表示にするのではなく色を変えて強調するのはどうでしょうか？ページ下部の共有ボタンの説明文は「より多くの人が使うと効果が高まる事」を広く認知して貰う為に消さない方が良いと思います。

[keiji]

開発チームからのコメント

ページ上部の「動作中」について、背景を非表示にすると「壊れている」という印象を（少なくとも僕は）受けますので、背景を非表示にするのではなく色を変えて強調するのはどうでしょうか？

現状のカード型UIは、一つ一つが機能の入り口を示す括りとなっている。動作状況はアプリそのものの状況を表す機能のため、あえて背景上に表示している。
デザイン全体の整合性を取るならば現状で進めるのが良いと考える。

ページ下部の共有ボタンの説明文は「より多くの人が使うと効果が高まる事」を広く認知して貰う為に消さない方が良いと思います。

シェアによる普及が1文では促進できないと思われるため、UI面を考慮して不採用とした。

（有山補足）この点ですが、シェアによる普及ボタンが、UIの中で陽性情報の登録と並び立つ重要度があるかと言われると、やはりメリハリは付けた方がいいだろうと思います。前述のデザイン全体の整合性もありますが、機能の重要度を視覚的に表現する意味でも、原案で行こうと考えています。

[Takym]

現状のカード型UIは、一つ一つが機能の入り口を示す括りとなっている。動作状況はアプリそのものの状況を表す機能のため、あえて背景上に表示している。
デザイン全体の整合性を取るならば現状で進めるのが良いと考える。

では代案として、動作状況と接触確認ボタンの間に線を引くのは可能でしょうか？

[keiji]

代案というのは、カードUIを維持したままカードとカードの間に線を引く。ということでしょうか。
それとも、カードUIでない画面案で動作状況と接触確認ボタンの間に線を引くと言うことでしょうか。

[Takym]

カード型UIを維持しない画面案で想定していましたが、維持しつつ線を引くのも良いと思いました。維持する場合、機能の入り口という意味は失われそうではありますが。

[Meiryo7743]

@heykuro

こちら前者の方となります。COCOA自体が特性上、あまり立ち上げられないアプリではあるので、そこからシェアをされるということ自体が少ないのではということで今回のデザイン変更の中で全体のバランスも見つつ変更されています。このあたりもご意見あればいただけますと幸いです！

返信ありがとうございます。なるほど，意図的な変更なのですね。それでしたらリンクテキストにせず，いっそのことハンバーガーメニュー内に移動させてしまうのはどうでしょうか。

ホーム画面には接触関係の情報だけを配置して，それ以外のコンテンツはメニュー内に収めてしまう方が，より洗練された印象を受けます。

[keiji]

開発チームからのコメント

リンクテキストにせず，いっそのことハンバーガーメニュー内に移動させてしまうのはどうでしょうか。

UI的にはメニュー内でも問題ないと思いますが、メニュー要素を修正するより１画面内での修正の方が範囲が狭いと考えて不採用としました。

（有山補足）この点、ぼくは開発チームとは意見が異なるところで、利用者はハンバーガーメニュー（ドロワー）の操作の結果として、従属する画面の切り換えを予期する場合が多いと考えます。そこに他のアプリとの連携（シェア）という単機能を配置するのは適切でないと考えます。

[i-maruyama]

「アプリを周りの人に知らせる」は、NonContactPage, ThankYouNotifyOtherPage にもあります。（Command="{Binding Path=OnClickShareApp}"で共通ですが、翻訳文字列の static resource は違います。）

私自身は、どちらが良いか分かりませんが、同じ機能は今のように同じ文字列になっている方が、安心してクリックできます。

[keiji]

開発チームからのコメント

「アプリを周りの人に知らせる」は、NonContactPage, ThankYouNotifyOtherPage にもあります。（Command="{Binding Path=OnClickShareApp}"で共通ですが、翻訳文字列の static resource は違います。）

NonContactPageも同一UIに変更予定。
ThankYouNotifyOtherPageは現状利用されていないため対応不要。

[keiji]

現状報告です。いただいた意見を元にブラッシュアップしたものを開発チームから受け取っています。

公開をどうするかを検討中です。このIssueにコメントとして掲載することも考えたのですが、スレッドが延びているので後から来た人が読みにくいかもしれないので、別Issueにしようかなと思っています。

[keiji]

Discussionがスタートしたので、このIssueは今晩あたり閉じて、ブラッシュアップ済みのものをDiscussionで公開したいです。