Upgrade to Pro — share decks privately, control downloads, hide ads and more …

人事労務freeeのアクセシビリティへの取組み ~ アクセシビリティQAのススメ ~ / hr freee accessibility QA

059b353090e76ea89bc676dcd3011a79?s=47 yoshi@freee
May 16, 2019
Technology
1
4.2k

人事労務freeeのアクセシビリティへの取組み ~ アクセシビリティQAのススメ ~ / hr freee accessibility QA

059b353090e76ea89bc676dcd3011a79?s=128

yoshi@freee

May 16, 2019
Tweet

More Decks by yoshi@freee

See All by yoshi@freee
プロダクト開発におけるBusinessとEngineeringの融合 / Around the Product vol2
059b353090e76ea89bc676dcd3011a79?s=48 ytyt
0
240

Other Decks in Technology

See All in Technology
Building smarter apps with machine learning, from magic to reality
7e6a435700dda6cdb22105d601f20892?s=48 picardparis
4
3.1k
Agile and Requirement : アジャイルな要件定義について考える
A64ac825509279a770c13c6fc517f11a?s=48 kawaguti
PRO
9
3.6k
Devに力を授けたいSREのあゆみ / SRE that wants to empower developers
E12b5afe5b4e6552019c09d6ac4128c3?s=48 tocyuki
3
480
YAMLを書くだけで構築できる分散ストレージ
842515eaf8fbb2dfcc75197e7797dc15?s=48 sat
PRO
0
200
ドキュメントの翻訳に必要なこと
0d0586f83b68c623c4f04c752c4b515b?s=48 mayukosawai
0
180
信頼性の階層の一段目を積み上げる/Monitoring Dashboard
0b238801605070def81a98cfe8061aee?s=48 shonansurvivors
0
180
New Features in C# 10/11
1c3658db58f755e44fc1a70255c08ff7?s=48 chack411
0
990
Data-Driven Healthcare - Techplay
Bc9f06dc792f2ab663c7bf10326e649e?s=48 kotaroito
0
120
TypeScript 4.7と型レベルプログラミング
993ef638264def4334358f986fb4a91d?s=48 uhyo
6
3.5k
事業の成長と共に歩む、ABEMA SRE探求の歴史 / SRE-Next 2022
762fa63fae184f8e08f11d527a93ba3f?s=48 nagaa052
0
410
Microsoft Build 2022 - Azure のデータ & 分析サービス 最新アップデート / Microsoft Build 2022 Updates on Azure Data and Analytics Services
22ac00b36d2057e61ee1c06f0f5dc6cb?s=48 nakazax
1
180
數據的多重宇宙 @ LINE Taiwan
2102a6b8760bd6f57f672805723dd83a?s=48 line_developers_tw
PRO
0
720

Featured

See All Featured
XXLCSS - How to scale CSS and keep your sanity
1b8ad785acdd1ce1c99914b1c2a4e10e?s=48 sugarenia
236
1M
Statistics for Hackers
56c4053438af8e8b90d6f53cbb7573be?s=48 jakevdp
781
210k
Creatively Recalculating Your Daily Design Routine
48c098b6579220a67a6ba949be6e4b5a?s=48 revolveconf
207
10k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
8081b26e05bb4354f7d65ffc34cbbd67?s=48 chriscoyier
498
130k
Art, The Web, and Tiny UX
D67fff74178013024d833b3eec6cf27f?s=48 lynnandtonic
280
17k
Designing Experiences People Love
1b75d89772b7eea1f6c89fbf362607d9?s=48 moore
130
22k
Fashionably flexible responsive web design (full day workshop)
433acaea1012b25d97ae66da9b998dad?s=48 malarkey
396
62k
Code Reviewing Like a Champion
C7393b7ba7ec9c8890dd77d209fbb3c9?s=48 maltzj
506
37k
jQuery: Nuts, Bolts and Bling
9cde37f47e4a800ea081ea42de8d749a?s=48 dougneiner
56
6.4k
10 Git Anti Patterns You Should be Aware of
Dafc4723e9a1c067796c0fec6f509774?s=48 lemiorhan
638
52k
A Tale of Four Properties
8081b26e05bb4354f7d65ffc34cbbd67?s=48 chriscoyier
149
20k
Building Adaptive Systems
06f8b41980eb4c577fa40c41d5030c19?s=48 keathley
25
1.1k

Transcript

  1. freee 株式会社
 2019.05.16 人事労務freeeのアクセシビリティへの取組み ~ アクセシビリティQAのススメ ~

  2. 竹田 祥 freee関西支社 開発部長 ・エンジニア ・プロダクトマネージャー ・アクセシビリティ初級 2

  3. None

  4. スモールビジネスを、世界の主役に。


  5. None

  6. 6 アイデアやパッションやスキルがあれば
 だれでもビジネスを強くできるプラットフォーム


  7. Q.この数字は何でしょう
 99.7%

  8. 中小企業 99.7% A.日本の企業規模の割合
 ※出典：中小企業庁 平成26年 


  9. この99.7%のビジネスを
 サポートし、強くしたい


  10. None

  11. ビジネスをはじめる

  12. ビジネスを続ける、育てる

  13. アクセシビリティ に取組む理由

  14. 14 アイデアやパッションやスキルがあれば
 だれでもビジネスを強くできるプラットフォーム


  15. アイデアやパッションやスキルがあれば
 だれでもビジネスを強くできるプラットフォーム


  16. だれでも ＝ あらゆる人


  17. アクセシビリティ対応
 =
 あらゆる人が使えるようにする


  18. freeeが目指している
 ものと完全に一致
 ↓
 やらない理由がない


  19. どうやっているか

  20. アクセシビリティQA
 という仕組みを始めました


  21. そもそも ”QA” とは
 品質保証 サービスの開発において 機能の 、デザインの などは 一般的に実施されている。

  22. “アクセシビリティQA” とは
 機能やデザインと同じく 「アクセシビリティの品質保証」 を開発プロセスに組み込む

  23. チーム構成

  24. アクセシビリティやっていき CAO (Chief Accessibility Ojisan) 会計フリー開発メンバー モバイル開発メンバー etc 人事労務フリー開発メンバー

  25. CAO (Chief Accessibility Ojisan) 中根さん / 全盲のエンジニア / AccSell運営

  26. AKO (Accessibility no hon Kaiteru Ojisan) 伊原さん / PM /

    アクセシビリティ本の執筆、監修

  27. • アクセシビリティやっていき がある • 先ほどの強豪 名を軸に、各開発チームからエンジニアやデ ザイナー、 など複数のメンバーが参加 • 全体で使う共通のライブラリなどの作成

    • それぞれが各プロダクトでアクセシビリティを意識した開発を 行いつつ、 にて情報共有や悩み相談を行う

  28. プロセス

  29. つの観点でクオリティをチェック システムQA デザインQA アクセシビリティQA 動作テストチーム UI/UXデザイナー 強豪2名

  30. アクセシビリティQA 強豪2名 • アクセシビリティ が存在し、他のチェックと同様にリ リースまでのプロセスに組み込まれている • 今は強豪 名がチェック（今後広げたい） •

    画面モック時点での事前チェック、検証環境で実際に動作 する状態でのチェックの 段階実施

  31. 強豪のおじさん2名が厳しくチェック

  32. 具体的な事例

  33. 月リリース 「特別休暇」機能

  34. 勤怠管理担当者が会社独自の休暇を定義する

  35. 従業員は日々の勤務でその休暇を取得できる

  36. アクセシビリティ の流れ

  37. DesignDoc(要件まとめ)作成 / PM UXデザイン → UIモック作成 / デザイナー アクセシビリティQA(事前チェック) /

    強豪

  38. 強豪のおじさん2名が厳しくチェック

  39. Adobe XDで作ったモックに強豪が指摘やアドバイス

  40. モックを元に以下のチェックを行う ・デザインで改善できるもの ・実装時に気をつけるもの

  41. デザインで解決できるものはモックを修正して報告

  42. コーディング時に解決すべきものはgithub issueに

  43. ここまで終わったら 実際のコーディングへ

  44. コーディング&検証環境へアップ / エンジニア アクセシビリティQA(実動作のチェック) / 強豪 ※システムQA、デザインQAも並行して実施 ※各指摘の影響範囲によっては実施順序を調整

  45. 強豪のおじさん2名が厳しくチェック

  46. 実画面を元に以下のチェックを行う ・スクリーンリーダーの解釈確認 ・障害を持つ方にとっての操作感 　(実用に耐えうるか)

  47. 具体的な指摘内容がコメントされる 要約：aria-labelちゃんと設定してね☆

  48. 指摘内容はgithub issueに

  49. その後、優先度に応じて実際に対応する

  50. レビューする人のために確認方法をしっかり書く

  51. 優先度の高い指摘 に対応できたら 無事にリリース　

  52. 優先度の低いissueは改善時間に対応 大阪チームだと毎週金曜日の午後は自由に使える 「たこ Hack Day」 この時間にアクセシビリティ対応を進めるエンジニアも。

  53. アクセシビリティ に役立つ情報 強豪がいなくても大丈夫！

  54. 強豪の一人 中根さん が運用してるサイト

  55. 強豪の一人 伊原さん が執筆 監修された書籍 で「アクセシビリティ」で検索

  56. デザイニングWebアクセシビリティを実践するためのチェックリスト
 様作成

  57. ※その他、随時更新します！
 まずは始めてみることが大事です
 ぜひ一緒にチャレンジしましょう


  58. 58 アイデアやパッションやスキルがあれば
 “だれでも” ビジネスを強くできるプラットフォーム
 を実現していきます。ご期待ください。


  59. None