$30 off During Our Annual Pro Sale. View Details »

Android accessibility and automated check tools

itome
November 28, 2019

Android accessibility and automated check tools

itome

November 28, 2019
Tweet

More Decks by itome

Other Decks in Technology

Transcript

  1. Androidアプリの アクセシビリティと ⾃動テストツール CA Y

  2. ⾃⼰紹介 https://twitter.com/itometeam https://github.com/itome https://itome.team . min 塚本武志 CyberAgent CATS

  3. Androidアプリのアクセシビリティ min

  4. Androidアプリのアクセシビリティ ‧Talkbackを使った⾳声によるガイド 6min 過去のスライド https://speakerdeck.com/itome/android-accessibility-suite - Android Accessibility Suiteに含まれるTalkback機能を 使った⾳声ガイド

    - TextViewなどは⾃動でコンテンツが読み上げられる - ImageViewやCanvasに直接描画されたテキストは開発者が Talkback内容を指定する必要がある
  5. ‧⽂字⾊と背景⾊のコントラスト - ⽂字⾊と背景⾊のコントラストが低いと、⽂字の視認性が悪くなる - ⾊覚障害のユーザーだけでなく、⽇光の下でのアプリの使い やすさにも影響する - マテリアルデザインガイドラインでは⼩さめのテキストでは 4.5:1以上、⼤きめのテキストでも3:1以上のコントラストが推 奨されている

    参照リンク https://material.io/design/usability/accessibility.html#color-contrast Androidアプリのアクセシビリティ 6min
  6. ‧⽂字⾊と背景⾊のコントラスト 参照リンク https://material.io/design/usability/accessibility.html#color-contrast Androidアプリのアクセシビリティ 6min - ⽂字⾊と背景⾊のコントラストが低いと、⽂字の視認性が悪くなる - ⾊覚障害のユーザーだけでなく、⽇光の下でのアプリの使い やすさにも影響する

    - マテリアルデザインガイドラインでは⼩さめのテキストでは 4.5:1以上、⼤きめのテキストでも3:1以上のコントラストが推 奨されている
  7. ‧⽂字サイズ Androidアプリのアクセシビリティ 6min - ⽂字サイズが⼩さいと、視認性が悪くなる - タイトルや説明⽂など、テキストのタイプによって推奨の⽂字サイズはさまざま - Androidでは、どんなタイプのテキストであっても12sp以上の⽂字サイズを指定することが推奨されている

  8. ‧⽂字サイズ - ⽂字サイズが⼩さいと、視認性が悪くなる - タイトルや説明⽂など、テキストのタイプによって推 奨の⽂字サイズはさまざま - Androidでは、どんなタイプのテキストであっても 12sp以上の⽂字サイズを指定することが推奨されて いる

    Androidアプリのアクセシビリティ 6min
  9. ‧ボタンのサイズ - マテリアルデザインガイドラ インでは48dp x dp以上が 推奨されている - ⼩さめのアイコンなど、それ⾃体で推奨 サイズに届かないボタンは、paddingで

    タップ可能領域を広げる 参照リンク https://material.io/design/usability/accessibility.html#layout-typography Androidアプリのアクセシビリティ 6min
  10. ‧その他 - ボタンのタッチ領域が重ならないようにする - TextViewに埋め込まれたURLにTalkbackでもアクセスで きるようにする - 冗⻑なcontentDescriptionを避ける(ボタンに対して 「〜のボタン」と読み上げさせるなど) -

    etc Androidアプリのアクセシビリティ 6min
  11. min Androidのいろいろな アクセシビリティテスト

  12. Androidのいろいろなアクセシビリティテスト min Android StudioのAccessibilityに関するLint ‧画像のcontentDescriptionがついているかなど、コード上で わかるアクセシビリティ対応を警告で教えてくれる

  13. Androidのいろいろなアクセシビリティテスト min Google Play ConsoleのPre-launch report

  14. Google Play ConsoleのPre-launch report ‧内部ではFirebase Test Labを使って実機テストが⾛っている ‧網羅的にテストできているわけではないものの、アプリの どんな部分に問題があるかに気づくきっかけになる ‧Google

    Play Consoleからアプリをリリースするときに  アクセシビリティに関する問題を検知してくれる Androidのいろいろなアクセシビリティテスト min
  15. https://play.google.com/store/apps/details?id=com.google.android.apps.accessibility.auditor&hl=ja ユーザー補助検証ツールを使ったテスト Androidのいろいろなアクセシビリティテスト min

  16. 実機上で画⾯のスクリーンショット を取って⾃動的にテストしてくれる https://play.google.com/store/apps/details?id=com.google.android.apps.accessibility.auditor&hl=ja ユーザー補助検証ツールを使ったテスト Androidのいろいろなアクセシビリティテスト min

  17. https://play.google.com/store/apps/details?id=com.google.android.apps.accessibility.auditor&hl=ja ユーザー補助検証ツールを使ったテスト ‧スクリーンショット上の要素であれば全てテスト対象にできるので、 ソースコードが内部にないアプリや、Webアプリなどの検証にも使える ‧必ず⼿動でスキャンする必要があるが、その分テスト対象 のページを柔軟に変更できる。 ‧実機テストのサポートをしてくれる。 Androidのいろいろなアクセシビリティテスト min

  18. https://play.google.com/store/apps/details?id=com.google.android.apps.accessibility.auditor&hl=ja ユーザー補助検証ツールを使ったテスト Demo Androidのいろいろなアクセシビリティテスト min

  19. Android Test Framework for Androidを使ったUIテスト Androidのいろいろなアクセシビリティテスト min

  20. Android Test Framework for Androidを使ったUIテスト ‧他のテストツールも基本的にこのライブラリに依存している ‧Espresso, Robolectricそれぞれに対応している ‧UIテストのコードに数⾏追加することで、UIテストと⼀緒に アクセシビリティテストも⾏ってくれる

    Androidのいろいろなアクセシビリティテスト min
  21. テストできる項⽬ Androidのいろいろなアクセシビリティテスト min

  22. @RunWith(AndroidJUnit4::class) @LargeTest class MainActivityTest { companion object { @BeforeClass @JvmStatic

    fun enableAccessibilityChecks() { AccessibilityChecks.enable() .setRunChecksFromRootView(true) } } @Test fun testAccessibility() { ActivityScenario.launch(MainActivity::class.java).onActivity { onView(withId(R.id.button_small)).perform(click()) } } } Android Test Framework for Androidを使ったUIテスト Androidのいろいろなアクセシビリティテスト min
  23. Android Test Framework for Androidを使ったUIテスト com.google.android.apps.common.testing.accessibility.framework.integrations.AccessibilityViewCheckExcepti on: There was 1

    accessibility error: AppCompatTextView{ id=2131165219, res-name=button_small, visibility=VISIBLE, width=27, height=32, has-focus=true, has-focusable=true, has-window-focus=true, is-clickable=true, is-enabled=true, is-focused=true, is-focusable=true, …… input-type=0, ime-target=false, has-links=false }: View falls below the minimum recommended size for touch targets. Minimum touch target size is 48x48dp. Actual size is 27x32dp. Androidのいろいろなアクセシビリティテスト min
  24. fastlane-plugin-accessibility_testを使った完全⾃動UIテスト Androidのいろいろなアクセシビリティテスト min

  25. fastlane-plugin-accessibility_testを使った完全⾃動UIテスト ‧Firebase Test Labで⾃動実機テストを⾛らせてアクセシビリティ に関する問題をスキャンできる ‧内部ではAndroid Test Framework for AndroidをPure

    Javaに 書き換えたものを使っているため、Pre-launchレポート相当の 結果が出⼒される ‧CATSチームが作成したオープンソースのfastlaneプラグイン Androidのいろいろなアクセシビリティテスト min
  26. fastlane-plugin-accessibility_testを使った完全⾃動UIテスト Androidのいろいろなアクセシビリティテスト min

  27. fastlane-plugin-accessibility_testのメリット ‧テストコードを書く必要がない ‧CIに組み込んで、GitHubで結果を確認できる ‧グラフィカルに結果を確認できる Androidのいろいろなアクセシビリティテスト min

  28. min まとめ

  29. ‧テスト⽤のツールが充実しているので、うまく駆使して負担を減らす ‧最終的なチェックは必ず実機を⾃分で触ってみる ‧アクセシビリティの⾼いアプリを開発すればリーチできる  ユーザーが増える まとめ min ‧Androidのアクセシビリティ対応はまずMaterial Design Guideline

  30. ありがとうございました https://twitter.com/itometeam https://github.com/itome https://medium.com/@itometeam 塚本 武志