社内でのアクセシビリティ推進

by Tiphaine

Slide 1

Slide 1 text

社内でのアクセシビリティ推進　　 DroidKaigi 2022 Tiphaine（ティフェン）

Slide 2

Slide 2 text

◉ Android エンジニア ◉ メドピア株式会社 @tahia910 2 Tiphaine（ティフェン）

Slide 3

Slide 3 text

“ なぜ会社でアクセシビリティが注目されない 3 ?

Slide 4

Slide 4 text

◉ クレームのイメージが強くて嫌な印象 ◉ 向き合い方が分からない ◉ 問題を放置する危険性が明確ではない ◉ タスクを増やされたくない 4 チャレンジ参考：Deque Systems

Slide 5

Slide 5 text

“ 彼を知り　己を知れば百戦危うからず 5

Slide 6

Slide 6 text

課題と向き合い方 What? 6 1

Slide 7

Slide 7 text

障害の種類 7 視覚認知/神経運動聴覚

Slide 8

Slide 8 text

◉ 色が区別しづらい ◉ テキストを読めない ◉ 画面が見えない 8 問題：視覚系

Slide 9

Slide 9 text

◉ ボタンを正確に押せない ◉ 複雑な操作がしづらい ◉ タッチ画面が使えない 9 問題：運動系

Slide 10

Slide 10 text

◉ 長文が読みづらい ◉ 文字が理解しづらい ◉ UIを理解できない 10 問題：認知系

Slide 11

Slide 11 text

◉ 聞き取りづらい ◉ 音を認知できない ◉ 字幕がないと理解できない 11 問題：視覚系

Slide 12

Slide 12 text

◉ 文字拡大 ◉ 色調補正 ◉ TalkBack 支援技術 12 点字ディスプレイ参考：Emerald Coast

Slide 13

Slide 13 text

支援技術 13 ◉ 表示拡大 ◉ 音声入力/音声操作 ◉ スイッチ・アクセス参考：Google

Slide 14

Slide 14 text

14 他にも色々あります！全部覚えられない😱

Slide 15

Slide 15 text

“ 15 ガイドラインに従うだけで解決できる

Slide 16

Slide 16 text

WCAG 2.0 ◉ ウェブ・コンテンツ・アクセシビリティ・ガイドライン 2.0 ◉ W3Cの勧告ガイドライン ◉ 内容は対応すべき要件のリスト 16

Slide 17

Slide 17 text

４つの原則 1. 知覚可能（perceivable） 2. 操作可能（operable） 3. 理解可能（understandable） 4. 堅牢性（robust） 17

Slide 18

Slide 18 text

適合レベル 18 A シングルA 25項目最低限 AA ダブルA 13項目好ましい AAA トリプルA 23項目最上級

Slide 19

Slide 19 text

JIS X 8341-3:2016 ◉ 国内の基準規格 ◉ モバイル端末向けのコンテンツも対象 19 「JIS X 8341-3:2016 適合レベルAA準拠」記載を目指す✊

Slide 20

Slide 20 text

先輩たちの解読メモ ◉ サイバーエージェント ◉ Freee ◉ MDN ◉ 弊社も作成中󰢜 20

Slide 21

Slide 21 text

◉ クレームのイメージが強くて嫌な印象 ◉ 向き合い方が分からない ◉ 問題を放置する危険性が明確ではない ◉ タスクを増やされたくない 21 チャレンジ参考：Deque Systems

Slide 22

Slide 22 text

Why？ビジネスにとっての価値と危険性 2 22

Slide 23

Slide 23 text

ブランディング ◉ 会社のイメージ向上✨ ◉ 業界の動向で当たり前になる ◉ 競合サービスとの差別化要因 23

Slide 24

Slide 24 text

期待に応える ◉ ロイヤル・カスタマーを増やす ◉ 家族や友達への宣伝 ◉ SNSでの炎上を避ける 24

Slide 25

Slide 25 text

◉ ガイドラインがあるとコードが綺麗に ◉ コンポーネント使い回しで、生産性🆙 ◉ UIテストの実装が勧められる開発者の環境改善 25

Slide 26

Slide 26 text

26 ユーザビリティアクセシビリティ参考：BAsixs 満足安心利用アクセスしやすさ

Slide 27

Slide 27 text

27 参考：内閣府（万人）日本の将来推計人口 37%

Slide 28

Slide 28 text

2050年の高齢者は今の30代後半全員スマホに慣れた人 28

Slide 29

Slide 29 text

ユーザー層の変化 ◉ 日本の総人口が縮む ◉ 現在のユーザーが老けていく ◉ 加齢による問題は65歳前から始まる 29

Slide 30

Slide 30 text

30 参考：総務省 (1 / 2) (󰏦) インターネットの利用状況（%）

Slide 31

Slide 31 text

31 アクセシビリティ対応をしない障害者に利用できない “考慮する必要がない” マイノリティだと思われる数字に出ない (+ 社会的認知度が低い) 参考：pacingpixie / HubSpot / 内閣府

Slide 32

Slide 32 text

数字に見えない人 ◉ 社会のプレッシャーで、言えない人 ◉ 自分は無関係だと思えば、見えなくなる ◉ そもそも政府の数字と対象が違う 32

Slide 33

Slide 33 text

全てのユーザーのため ◉ 「障害者 vs 健常者」ではない ◉ 一時的/状況的障害で健常者も困る ◉ “Don’t assume anything” 33

Slide 34

Slide 34 text

より良いプロダクトへ ◉ 制約を与えると創造性が上がる ◉ スキルが高くなって品質向上に繋がる 34 BAD DESIGNS DISABLE PEOPLE 参考：btrax

Slide 35

Slide 35 text

35 (󰑔) webアクセシビリティ関連訴訟参考：UsableNet

Slide 36

Slide 36 text

法律に求められる 36 参考：内閣府 2021年に障害者差別解消法が改正され、民間事業者も義務化へ

Slide 37

Slide 37 text

◉ クレームのイメージが強くて嫌な印象 ◉ 向き合い方が分からない ◉ 問題を放置する危険性が明確ではない ◉ タスクを増やされたくない 37 チャレンジ参考：Deque Systems

Slide 38

Slide 38 text

取り込みの流れ How? 38 3

Slide 39

Slide 39 text

39 企画 & 分析設計実装テスト運用・保守全ての段階で確認したい参考：TPGi

Slide 40

Slide 40 text

Roadmap 40 1 観察

Slide 41

Slide 41 text

観察 ◉ どれぐらい注目されているか？ ◉ 担当アプリの現状はどうか？ ◉ 意思決定者は誰か？ ◉ 仲間はいるか？ 41

Slide 42

Slide 42 text

Roadmap 42 1 観察 2 勉強

Slide 43

Slide 43 text

勉強 ◉ 基礎知識（対象、問題、支援技術） ◉ アクセシビリティの重要性 ◉ WCAG解読 ◉ インクルーシブデザイン 43

Slide 44

Slide 44 text

Roadmap 44 1 2 観察 3 具体化勉強

Slide 45

Slide 45 text

45 具体化 ◉ 達成可能で小刻みな目標を設定する ◉ 問題を特定して、チケットを作る ◉ ↑ 優先度を決めて、消化する参考：W3C, Web担当者Forum / 弁護士ドットコム

Slide 46

Slide 46 text

“ 46 やれる範囲で、少しずつ、継続的に

Slide 47

Slide 47 text

◉ 小さくてやりやすい変更から始める ◉ 1スプリントに小さいチケット1件など ◉ 既存プロセスにチェックを入れ込む 47 長期的に続くため

Slide 48

Slide 48 text

Roadmap 48 1 3 2 観察具体化勉強 4 実装

Slide 49

Slide 49 text

49 WCAG知覚可能のAレベル項目スクリーンリーダー対応のみ無事にリリース😭✨ WCAG知覚可能のAレベル項目 kakari for Clinic

Slide 50

Slide 50 text

Roadmap 50 1 3 4 2 観察具体化 5 運用勉強実装

Slide 51

Slide 51 text

記録と教育 ◉ チェックリスト ◉ トレーニング ◉ 社内ガイドライン ◉ ポリシー 51

Slide 52

Slide 52 text

進捗管理支援技術利用のトラッキングは 🆖 52 参考：AdrianRoselli, W3C, Mightybytes, StackExchange

Slide 53

Slide 53 text

進捗管理 ◉ 達成したWCAG項目の数 ◉ 事前に設定した目標 ◉ チケットの消化 ◉ アクセシビリティ関連問い合わせの数 53

Slide 54

Slide 54 text

◉ 人はあなた自身を否定していない ◉ 仲間を増やそう ◉ 謙虚心を忘れない ◉ 影響力のある人のサポートを求めよう 54 人間関係について

Slide 55

Slide 55 text

Roadmap 55 1 3 5 4 2 観察具体化運用勉強実装 6 情報配信

Slide 56

Slide 56 text

情報配信 ◉ 社内で進捗を共有する ◉ お客さんに変更を知らせる ◉ フィードバックをもらう 56

Slide 57

Slide 57 text

日常の小さな思いやり ◉ SNSで情報を共有するだけでも充分👍 ◉ 投稿する時に配慮する 57

Slide 58

Slide 58 text

参考 ◉ Pragmatic Accessibility: A How-To Guide for Teams (Google I/O '17) - Google Developers ◉ Android Accessibility by Tutorials - Victoria Gonda ◉ noteアクセシビリティ施策 - note ◉ Ameba Pickのアクセシビリティ向上への取り込みについて - CyberAgent 58

Slide 59

Slide 59 text

Thanks! 59 テーマ：SlidesCarnival Special thanks: @purunkaoru @y2kit_1127 @Gabrielle_Lng