Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Accessibility in CATS
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
itome
September 10, 2019
Technology
4
2.5k
Accessibility in CATS
itome
September 10, 2019
Tweet
Share
More Decks by itome
See All by itome
今日始め るCloudflare Browser Rendering
itome
1
290
Android accessibility and automated check tools
itome
1
5k
Introduce_Owl.pdf
itome
0
97
Introducing Android Accessibility Test with Accessibility Testing Framework
itome
1
750
Introduction of accessibility for mobile development
itome
0
250
Architecture_for_mobile_development.pdf
itome
0
270
Android_Accessibility_Suite.pdf
itome
0
160
Introducing Owl
itome
0
1.1k
Migrate to Koin
itome
2
350
Other Decks in Technology
See All in Technology
GSIが複数キー対応したことで、俺達はいったい何が嬉しいのか?
smt7174
3
150
外部キー制約の知っておいて欲しいこと - RDBMSを正しく使うために必要なこと / FOREIGN KEY Night
soudai
PRO
12
5.4k
30万人の同時アクセスに耐えたい!新サービスの盤石なリリースを支える負荷試験 / SRE Kaigi 2026
genda
4
1.3k
茨城の思い出を振り返る ~CDKのセキュリティを添えて~ / 20260201 Mitsutoshi Matsuo
shift_evolve
PRO
1
260
CDKで始めるTypeScript開発のススメ
tsukuboshi
1
390
AI駆動PjMの理想像 と現在地 -実践例を添えて-
masahiro_okamura
1
110
会社紹介資料 / Sansan Company Profile
sansan33
PRO
15
400k
SREが向き合う大規模リアーキテクチャ 〜信頼性とアジリティの両立〜
zepprix
0
440
超初心者からでも大丈夫!オープンソース半導体の楽しみ方〜今こそ!オレオレチップをつくろう〜
keropiyo
0
110
配列に見る bash と zsh の違い
kazzpapa3
1
140
M&A 後の統合をどう進めるか ─ ナレッジワーク × Poetics が実践した組織とシステムの融合
kworkdev
PRO
1
430
ClickHouseはどのように大規模データを活用したAIエージェントを全社展開しているのか
mikimatsumoto
0
230
Featured
See All Featured
Everyday Curiosity
cassininazir
0
130
For a Future-Friendly Web
brad_frost
182
10k
What’s in a name? Adding method to the madness
productmarketing
PRO
24
3.9k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
196
71k
Jess Joyce - The Pitfalls of Following Frameworks
techseoconnect
PRO
1
64
Art, The Web, and Tiny UX
lynnandtonic
304
21k
SEO Brein meetup: CTRL+C is not how to scale international SEO
lindahogenes
0
2.3k
Building Applications with DynamoDB
mza
96
6.9k
The Curious Case for Waylosing
cassininazir
0
230
Code Reviewing Like a Champion
maltzj
527
40k
Design in an AI World
tapps
0
140
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
49
9.9k
Transcript
CATS Android チームの アクセシビリティに関する 取り組み CA.apk #
⾃⼰紹介 https://twitter.com/itometeam https://github.com/itome https://itome.team . min 塚本武志 CyberAgent CATS
アクセシビリティって何? min
アクセシビリティって何? ⼀般にアクセシビリティとは、アクセスのしやすさを意味し ます。転じて、製品やサービスの利⽤しやすさという意味で も使われます。似た意味をもつ⾔葉にユーザビリティがあり ますが、アクセシビリティはユーザビリティより幅広い利⽤ 状況、多様な利⽤者を前提とします。 ウェブアクセシビリティ基盤委員会 (https://waic.jp/knowledge/accessibility/) min
アクセシビリティって何? ⼀般にアクセシビリティとは、アクセスのしやすさを意味し ます。転じて、製品やサービスの利⽤しやすさという意味で も使われます。似た意味をもつ⾔葉にユーザビリティがあり ますが、アクセシビリティはユーザビリティより幅広い利⽤ 状況、多様な利⽤者を前提とします。 ウェブアクセシビリティ基盤委員会 (https://waic.jp/knowledge/accessibility/) min
アクセシビリティって何? min アプリユーザーにはさまざまな属性がある ‧視覚に障害を抱えている⼈ ‧聴覚に障害を抱えている⼈ ‧ディスプレイの⾒⾟い屋外で使っている⼈ ‧スマホの操作に慣れていない⼈ ‧キーボードでアプリを操作している⼈ ‧etc ‧⼿が⼩さい⼈
/ ⼤きい⼈
アクセシビリティって何? min 様々なユーザーがアプリのすべての機能に (できるだけ簡単に)アクセスできること
アクセシビリティに 配慮することの意義 min
アクセシビリティに配慮することの意義 min 世界の⼈⼝の15%* が何らかの障害を抱えている → アクセシビリティに配慮することで、15%の潜在的 ユーザーに使ってもらえる可能性を広げられる * https://developer.android.com/guide/topics/ui/accessibility/index.html より
アクセシビリティに配慮することの意義 min 障害を持たないユーザーでも状況によって普段通りの操作が難しくなる → アクセシビリティに配慮することで、障害を持たない ユーザーにとっての使いやすさも向上する * https://developer.android.com/guide/topics/ui/accessibility/index.html より
開発者が気をつけるべきこと min
開発者が気をつけるべきこと min ヒューマンリーダビリティと マシンリーダビリティ https://speakerdeck.com/cybozuinsideout/ - -accessibility https://material.io/design/usability/accessibility.html
開発者が気をつけるべきこと min ヒューマンリーダビリティ すべての⼈が⾝体的に知覚‧理解‧操作できること ⽂字やアイコンの背景のコントラスト が低いと、コンテンツを判別しづらい
開発者が気をつけるべきこと min ヒューマンリーダビリティ すべての⼈が⾝体的に知覚‧理解‧操作できること ⽂字やアイコンの背景のコントラスト が低いと、コンテンツを判別しづらい
開発者が気をつけるべきこと min ヒューマンリーダビリティ すべての⼈が⾝体的に知覚‧理解‧操作できること エラーを⽰す⾚いラインを表⽰する だけでは、どう対応すればいいか 理解することができない
開発者が気をつけるべきこと min ヒューマンリーダビリティ すべての⼈が⾝体的に知覚‧理解‧操作できること エラーを⽰す⾚いラインを表⽰する だけでは、どう対応すればいいか 理解することができない
開発者が気をつけるべきこと min ヒューマンリーダビリティ すべての⼈が⾝体的に知覚‧理解‧操作できること ボタンのアイコンが⼩さい場合でも ⼗分なタッチ領域を確保する
開発者が気をつけるべきこと min マシンリーダビリティ コンテンツが機械によって解釈されうること レイアウトの適切なグルーピングに よって、コンテンツのまとまりを 機械が理解できる
開発者が気をつけるべきこと min マシンリーダビリティ コンテンツが機械によって解釈されうること アイコンにテキストによる説明が を追加することで、Talkbackなどに よる読み上げが可能になる
CATS Androidチームの取り組み min
CATS Androidチームの取り組み min 1⼈から始められること ‧⾃分で開発しているアプリを実際にTalkbackを オンにして⽬を瞑って使ってみる ‧ユーザー補助検証ツールを使って各画⾯のテストをしてみる ‧調べたこと、実践していることをドキュメントにまとめておく
CATS Androidチームの取り組み min 1⼈から始められること ‧ユーザー補助検証ツールを使って各画⾯のテストをしてみる 実機上で画⾯のスクリーンショット を取って⾃動的にテストしてくれる https://play.google.com/store/apps/details?id=com.google.android.apps.accessibility.auditor&hl=ja
CATS Androidチームの取り組み min チームで取り組んでいること ‧アクセシビリティの対応⽅針の統⼀ ‧conentDescriptionの命名規則の統⼀ ‧アクセシビリティに関する相互レビュー ‧Talkbackの挙動の統⼀(グルーピングなど)
CATS Androidチームの取り組み min アクセシビリティの⾃動テスト Android Test Framework for Androidを使ったUIテスト くわしくは
→ https://bit.ly/ iMw
CATS Androidチームの取り組み min アクセシビリティの⾃動テスト Android Test Framework for Androidを使ったUIテストのデメリット ‧テストのためにRobolectricを使ったUIテストを書く必要がある
‧画⾯を追加するたびに、Activityを表⽰→テストという コードの追加が必要 ‧テキストでしかエラーを確認できない
CATS Androidチームの取り組み min アクセシビリティの⾃動テスト
CATS Androidチームの取り組み min Google Play ConsoleのPre-launch report
CATS Androidチームの取り組み min Google Play ConsoleのPre-launch report ↑Test Labの結果からアクセシビリティのチェックをしているらしい
CATS Androidチームの取り組み min Test Labの出⼒ファイルを確認してみる 各画⾯のスクリーンショットの他に スクリーンショットに対応した “accessibility.meta” がある
CATS Androidチームの取り組み min Test Labの出⼒ファイルを確認してみる metaファイルの中⾝は不明なバイナリ ⾒た感じどうやらProtocolBufferのバイナリファイルっぽい ↓ ↓ もとのProtoファイルが不明なので復元できない
CATS Androidチームの取り組み min Android JetpackにAppCrawlerが追加される Firebase Test Labで使われているRoboテスト⽤のライブラリ ソースコードは公開されておらず、jarをダウンロードして利⽤
CATS Androidチームの取り組み min Android JetpackにAppCrawlerが追加される 配布されたjarファイルをデコンパイルしてみる Accessibility Test Frameworkがつかわれているらしい ↓
↓ Accessbility Test Frameworkのソースコードに含まれるprotoで metaファイルを復元できた
CATS Androidチームの取り組み min Android JetpackにAppCrawlerが追加される 復元したデータはテストの結果ではなく、テストを実⾏する前の View階層の抽象データ Accessibility Test Frameworkを使って復元したデータをテスト
↓ ↓ テスト結果をもとにimagemagickを使ってスクリーンショットに反映
CATS Androidチームの取り組み min
CATS Androidチームの取り組み min Firebase Test Labを使ったアクセシビリティテストのメリット ‧テストコードを書く必要がない ‧CIに組み込むことができる ‧グラフィカルに結果を確認できる
CATS Androidチームの取り組み min Fastlaneのプラグインとして使えるようにしました
まとめ min
まとめ min ‧CATS Androidチームはアクセシビリティ対応を進めています! ‧アクセシビリティ対応は1⼈でも始めることができる ‧Firebase Test Labを使った⾃動テストを導⼊することで ⼈がチェックするコストを減らすことができます
ありがとうございました https://twitter.com/itometeam https://github.com/itome https://itome.team 塚本 武志