2020年、サイボウズのアクセシビリティを振り返る

カバー:サイボウズのアクセシビリティを振り返る

こんにちは。開発本部 デザイン&リサーチ アクセシビリティチームの SUGI(@blindsoup2p1)です。

私は今年の4月に新卒で入社した全盲のスクリーンリーダーユーザーで、アクセシビリティ・エンジニアとして活動しています。

サイボウズでは今年、正式にアクセシビリティチームが発足し、グループウェアのアクセシビリティ向上や社内への啓発を進めてきました!

この記事では、今年1年アクセシビリティチームが取り組んできた過程と成果をまとめ、来年の展望を示します。 と共に、エクストリームユーザーである私がアクセシビリティ向上にどうかかわっていったのかを合わせて紹介します。

※アクセシビリティとは、能力・環境・状況にかかわらず、誰もがサービスやコンテンツを利用できること、またはその度合いのことです。
よくアクセシビリティは障害者・高齢者対応という誤解を受けますが、能力・環境・状況(の制約)は障害者・高齢者に限らず等しく誰もが一時的または半永久的に起こりうるものです。
そのためアクセシビリティは、すべての人、一人ひとりが利用できること、そのアクセス性を確保することといえます。

※エクストリームユーザーとは、サービスのターゲット層の中でも極端な性質を持つユーザーのことです。
エクストリームユーザーにヒアリングすることで、多くの人が気づいていない潜在的な問題や、常識・固定概念にとらわれない発想を得ることができます。
私の場合はスクリーンリーダー(音声読み上げソフト)を日常的に使用して画面を全く見ずに操作するという点で、エクストリームな状況にあります。

サイボウズにとってのアクセシビリティ

チームに入りたいと願うすべての人が、チームにアクセスできる能力。

サイボウズは「チームワークあふれる社会を作る」を理念に掲げ、グループウェアの開発を進めています。

この思想を踏まえてアクセシビリティについて考えた時、ユーザーが単にグループウェアにアクセスできる(利用できる)では不十分です。その先の目的が大事です。

つまり、ユーザーはグループウェアにアクセスすることで、何を求めているのか、何を達成したいのか。

その答えが、チームにアクセスすることです。

グループウェアを使うことで、チームに参加したい、貢献したい、活躍したい、協力したい…。

このようなユーザーの願いを尊重し、そのアクセス性を確保すること。

チームに入りたいと願うすべての人がチームにアクセスできる。その先に「チームワークあふれる社会」があります。

新設したアクセシビリティチームの紹介

2020年1月、正式にアクセシビリティチームが発足しました!

それまでは開発本部の小林大輔さんが協力者を募りつつ1人で活動していましたが、今年になってメンバーが4倍になりました!

チームの活動内容は、以下の3つです。

  • 社内啓発:勉強会を開催して社内のアクセシビリティリーダーを育成
  • 研究開発:サイボウズ OfficeGaroonkintoneのアクセシビリティ向上
  • 社外発信:記事執筆やイベント開催などでサイボウズのアクセシビリティの認知拡大

メンバーは以下の4人です。仕事の場所や時間は多種多様です。

  • 小林(@sukoyakarizumu)
    • kintone PG、現在アクセシビリティチーム専任
    • コロナ以降、基本在宅、時々必要に応じて出社
    • 2014年から協力者を募りつつ、アクセシビリティの啓発・製品のアクセシビリティ向上を行ってきた
  • 西藤(@ka3zu1ma10)
    • 週3日サイボウズ Officeのデザイナー、週2日アクセシビリティの兼務
    • コロナ以降フル在宅勤務
    • デザインもリサーチもアクセシビリティも幅広くこなすマルチプレイヤー
  • kotanori(@uexkull_)
    • 週3日システムエンジニア、週2日アクセシビリティチームの兼務
    • 入社当時から6年間フル在宅勤務
    • ロービジョン、拡大率200%
  • SUGI(@blindsoup2p1)
    • 今年(2020年)新卒入社、アクセシビリティチーム専任
    • 入社当時から在宅勤務、時々必要に応じて出社
    • 全盲、スクリーンリーダーNVDAを使用

今年のチームの活動振り返り

サイボウズアクセシビリティサイトの公開

サイボウズのアクセシビリティの情報を発信していくサイトを公開しました。

現時点のコンテンツとしては、製品情報と啓発プログラムがあります。

製品情報では、定期的にアクセシビリティにかかわるアップデート情報を掲載しています。

啓発プログラムでは、アクセシビリティを広めていきたいと考えている方に向けて、サイボウズでの取り組みやノウハウを発信しています。

このサイトは、サイボウズがアクセシビリティに取り組んでいることを知っていただくために、専用ページとして開設しました。

ひとまずは情報を必要としている人に届けたいという思いです。

製品の改善リクエストも受け付けているので、ぜひフィードバックをお寄せください。

社内勉強会

当事者目線で伝えるということ

定期的にアクセシビリティ勉強会を開催しています。アクセシビリティを向上させるHTMLの話、見やすい・読みやすい資料の作り方など内容はさまざまです。

勉強会を定期的に行う理由は、参加者に、アクセシビリティを身近に感じてもらい、重要と思ってもらうためです。

そのために、私がスクリーンリーダーのデモをしたり、サイボウズ製品のバッドプラクティスを紹介したりしています。

私が勉強会で発表することの意味は、当事者目線で話せること、日々の体験から必要性を語れることです。

とはいってもスクリーンリーダー特有の話に傾きすぎることは避けたいと常々思っています。

スクリーンリーダーだけではなく、キーボードユーザー、肢体不自由、タブレット・モバイルユーザー、母国語が日本語ではない人など、さまざまなユースケースに話を広げることを意識しています。

伝えたいポイントは、アクセシビリティは特別対応ではない、アクセシビリティはちょっとしたこと(タグや属性を書き換える、上流のうちから意識してデザインするなど)で向上できるということです。

いくつかの勉強会は資料・動画付きで公開しています。

参加者の意識の向上

勉強会を受けて、参加者の意識が向上した事例も少しづつ増えてきています。

たとえば、特に全社的な会議の資料などは、見やすさ・読みやすさを意識して作られることが増えました。

周辺の文字や代替テキストで図表の説明をすること、スライドに識別可能なタイトルをつけることなどです。

また、話し方についても、画面共有ありきではなく、口頭だけでも伝わる話し方を意識することが増えたように感じます。

開発方面では、見出しレベルが適切か、ボタンのマークアップは適切かなどのちょっとしたことを相談されることが以前より増えました。

写真:サイボウズ社内での勉強会の開催風景
サイボウズ社内での勉強会の開催風景

サイボウズ Office

明らかに問題が山積みの状態からのスタート

入社当初サイボウズ Officeは、スクリーンリーダーではほぼ使えない、あるいは著しく困難を要する状態でした。

  • 見出しが全くなく、すべての画面でページの先頭から情報を読んでいかなければならない
  • レイアウトテーブルがふんだんに使われていて、いたるところで「テーブル」と読まれて煩わしい
  • 入力欄にフォーカスした時、対応するラベルを読み上げない

この現状を打破すべく、サイボウズ Officeのデザイナーと一緒に週1回のペースで定期的にバックログの検討、実装を行っています。

サイボウズ Officeの場合は、開発PGの人でが少ないことから、PMと相談した結果、バックログの検討から実装までをアクセシビリティチームが巻き取って進めています。

デザインを変えるとお問い合わせが増えてしまう可能性があるので、ひとまずは、UIの変更が生じない基本的なタスクからです。

実際の進め方としては、通知の処理、スケジュール閲覧などのシナリオを決めてストーリーマッピングを行い、優先度の高いものから順次実装という流れです。

私のかかわり方としては、バックログの作成、実装(モブプログラミングもしくは個人タスク)、動作確認・検証です。

バックログの作成では、問題点を洗い出し、改善点と解決策をまとめます。これをチームでわいわいしながらストーリーマッピングに当てはめていきます。

実装はモブで行いますが、最近はメンバーもサイボウズ Officeのコードに慣れてきたので、チームを細分化したり、個人でやるケースが増えてきています。

動作確認・検証では、現時点ではNVDAとPC-Talkerという2つのスクリーンリーダーで品質をチェックしています。

スクリーンリーダーによって挙動が違うことがあるので、チェックは大事ですし、なにより自分自身が勉強になっています。

図表:サイボウズOfficeのユーザストーリーマッピング
サイボウズOfficeのユーザストーリーマッピング

今年取り組んできて私が感じたこと

2つあって、後付けでアクセシビリティを担保するのはコストが高いということ、そしてバックログのコストとユーザーへのメリットを考えることが大事ということです。

「見出しを付けるなどの”当たり前品質”程度のアクセシビリティ改善であれば、簡単にできるでしょ」、と最初は思っていました。

しかし、サイボウズ Officeは23年という歳月の中で、コードは複雑に絡み合い、共通化している部分、そうではない部分、他のページとは仕様が異なっている部分などさまざまな事情が積み重なっています。

そのため、ちょっとした手を加えるだけでも、思わぬところに影響範囲が及んだり、それによってレビュアーの負担を増加させてしまったり、品質を確保するために実装に思わぬ時間を取られたり、受け入れ試験の想定外の修正が入ったりしました。

新規開発のフローと共に改善するのであれば、このような手間は最小限に抑えられたし、それが理想の姿でしょう。

後付けのコストの高さを実感したことに付随して、リリースするバックログのコストパフォーマンスの良さとユーザーへのメリットの最大化を考えるきっかけになりました。

リリースできるバックログには限りがあるため、トップページやよく使う機能など、ユーザーにとっての大きなメリットが得られるようなものから厳選して取り組む必要があります。

地ならしした結果主要な画面の閲覧が容易に

5月から定期的にアップデートを行い、入社当初と比べると格段に使える状態になりました。

  • トップページの通知一覧から飛ぶことができるすべての画面に見出しをつけ、通知内容を確認しやすくしました。
  • 主要なアプリケーションの画面に見出しをつけ、必要な情報にたどり着きやすくしました。
  • スケジュール一覧のテーブル見出しをつけ、目的の予定にたどり着きやすくしました。

詳しいアップデート内容はアクセシビリティサイトの製品情報に記載しています:

Garoon

アクセシビリティチームが開発のフローに参加

PM・デザイナー・PGと一緒に、問題点を洗い出し、優先度の並び替え、コストの見積もりなどを定期的に行っています。

その上でPMと合意がとれたタスクの実装のプロトタイプを、アクセシビリティチームが作ります。

レビュー・マージ・試験などはGaroonチームのスクラムに任せています。

バックログの紹介は、全社員が参加可能なリファインメント・スプリントレビューなどの会議体で行っています。

そのため、Garoonでどのようなアクセシビリティ上の問題があって、どのように解決し、どのような効果が得られたのか、PM・PG・QA・その他会議参加者が知ることができます。

多くの人の目に触れることはとても重要なことです。アクセシビリティチームで完結することなく、アクセシビリティの重要性やノウハウを共有できるからです。

私のかかわり方は、サイボウズ Officeと同じで、バックログの作成、実装、動作確認・検証です。

Garoonの場合はリリースが3か月おきなので、より効果の高いバックログを厳選する必要があります。

共通コンポーネントの改善

アクセシビリティのバックログを作るとは別に、UIのリファクタのタイミングでアクセシビリティ向上を一緒に行っています

GaroonデザイナーがアクセシビリティチームとPM・PGとの橋渡しを担ってくれていて、UI関連の変更がある時は、アクセシビリティチームに相談してくれます。

相談の中でマークアップやキーボード操作などの対応方針を決めて、リファクタを行っているベトナム拠点の開発PGにフィードバックしています。

共通コンポーネントなので、一度しっかり調査して改善を加えれば、一律にそのパーツが使われている画面の品質が保たれるます。

徐々に回り始めたアクセシビリティ改善フロー

11月のアップデートで、最初のアクセシビリティ改善として、トップページの”当たり前品質”の向上を行いました。

トップページには見出しがなく、レイアウトテーブルも多く使われており、最も利用するページにも関わらず使い勝手が悪い状況でした。

アップデート情報は、アクセシビリティサイトに記載している他公式のリリースノートにも記載されました

また、共通コンポーネントとしてはツリービューとモーダルダイアログの改善を行いました。

さらに、リリースは先ですが、画面全体のランドマークの改善を行っています。

kintone

新規開発チームとの協力

kintoneについては、他の製品と比較すると、新規開発と共にアクセシビリティを考慮していく流れがあります

アクセシビリティチームが実装を巻き取るのではなくて、デザイナーがUIを考える時、PGが実装する時に、必要に応じてモブで相談に入っています。

その結果、デザイナーやPGの知見がたまっていきますし、デザインする時、実装する時に、多角的な視点で考えてみる習慣をつけるきっかけにもなります。

この流れを作るために、アクセシビリティチームに相談しやすい環境づくりをしてきました。

まず、質問・相談スレッドを立て、気軽に質問してもらうよう呼びかけました。

次に、kintoneの問題点をフィードバックする会を行いました。

伝えたいポイントは、kintoneを使うためにかなり試行錯誤しなければならないユーザー、もしくは使うことができないユーザーがいること。その困りごとは、ちょっとしたことで解決することができることです。

エンジニアのやるべきこと・やりたいに訴えかけるつもりでしたが、結果的には実装の段階で相談してもらえることが増えました。

また、アクセシビリティチーム側からも、リリース予定のバックログを眺めて、UIに変更が生じる場合にはモブで相談できないか持ち掛けるようにもしています。

現時点では開発フローに正式な手順としてアクセシビリティの相談・モブ実装があるわけではないのですが、意識の高い人たちによって、もしくはアクセシビリティチームの判断によって、スモールステップで取り組んでいる段階です。

モバイルチームとの協力

モバイルチームが、kintoneモバイルアプリの読み上げ改善をしてくれました。順次リリースしていっています。

定期的にアクセシビリティチームとモバイルチームで、現状のアプリの問題点を探求する勉強会を開催しています。

洗い出した問題は、モバイルチームが主導して、実装してくれています。

製品ロゴを読み上げない問題、エラーを読み上げない問題など、主要な問題が今年改善されました。

React化チームとの協力

kintoneは現在、新規開発とは別フローで、脱レガシーの一環としてReact + TypeScript化に取り組んでいて、キーボードユーザー、スクリーンリーダーユーザーなどの体験が向上するよう意識しながら実装を進めています

毎回開発PGとモブでマークアップを相談したり、複雑なコンポーネントの場合は、アクセシビリティチームで持ち帰って調査・検討したりしています。

理想的な状態を探るのに時間を書けてしまうこともあるのですが、PGとフラットにアクセシビリティの細かい話ができるのは素晴らしいことだと思っています。

ツリーやドロップダウン、モーダルダイアログ、それらの複合ウィジェットなどの複雑なコンポーネントについては、WAI-ARIA(アクセシビリティを向上させるために、追加の意味を定義するHTMLの属性)の込み入った話しをすることになります。

この属性を付け外しすると読み上げがどう変わるとか、仕様的にはこの属性は付けてはいけないとか、読み上げの体験を向上するためにラベルを付けたほうが良いなどです。

また、キーボードユーザーの体験を向上するために、タブキーでフォーカスできる部分の制御や矢印キーのキー操作のサポートについてもどのようにデザインすれば良いか話し合います。

このような深い話が他チームとできるのは非常にうれしいことです。アクセシビリティチームとしても知見がかなりたまりました。

私としても、アクセシビリティのガイドラインやHTMLの仕様書を頻繁に参照したり、コンポーネントのサンプルを実装してみてスクリーンリーダーごとの動作確認をしたりと、かなり勉強になりました。

今後の課題

現在は、アクセシビリティチームが主体となり、ともすればチーム内で完結する形で進めていますが、今後の課題は、自チーム以外の人たちに裾野を広げていくことです。

社内啓発の勉強会は、毎回40から50人ほどが参加してくれていますが、アクセシビリティに興味関心をもってくれている一部の人に限られています

無理にアクセシビリティに明るい人を増やす必要性はありませんが、アクセシビリティのアの字も知らない状態というのは避けたいです。

特に今サイボウズは人が増え続けていますから、このままいくとアクセシビリティはごくごく一部の人が知っているだけの化石になってしまいます。

だからこそ来年の展望としては、より広い人に、そしてそれぞれの興味関心に合ったコンテンツを提供していきたいと考えています。

  • 新卒・中途入社向けの人へのスターターキット(定期開催)の整備
  • 特定の部署やチームに向けての、よりニーズを絞った勉強会の開催

製品のアクセシビリティ向上については、デザイナー・PM・PGとの接点を増やしていく必要があります。

デザイナーやPMがバックログを考える時、PGが実装する時などに一緒にモブに入るなど、より密接に関係性を持たなければなりません。

さもなければ、アクセシビリティは別動隊で誰か(アクセシビリティチーム)が行う特殊な要件という位置づけを超えられません。

また、現在はその都度個別にアクセシビリティチームが相談を受けてフィードバックをしていますが、主体的に判断できるようにガイドラインの整備が必要不可欠だとも感じています。

まとめ

今年、まだまだ模索中ではありますが、それぞれの製品でアクセシビリティ向上を行っていく基盤を整え、実際にいくつかリリースすることができてきました。

私が入社するずっと前から、啓発や改善は行われてきており、その積み重ねが形となって実現してきている段階です。

単発ではなく、継続的な仕組みを作り始められていることが、大きな1歩でしょう。

グループウェアを使えるかどうかは、すなわち仕事を進められるか否かに直結します。

グループウェアを使うことができて初めて、スタートラインに立てます。

だからこそ、私たちはサイボウズのアクセシビリティを重要視していますし、志を高くもって継続的に取り組んでいくものと思っています。

ツール選定者や、実際の利用者の方々にとって、サイボウズのグループウェアが有力な選択肢となるために、来年も今年以上に精進していきます。

協力者を募集しています

アクセシビリティチームは、工数が足りていません。一緒に働く仲間を募集しています

チームワークあふれる社会を作るチームに入りたいと願うすべての人が、チームにアクセスできる

この考えに共感してくれる方、一緒にサイボウズのグループウェアを必要としている人に届けませんか?

採用情報(新卒・キャリア)をご覧ください。

また、改善・要望などを受け付けています

ぜひ、製品改善のフィードバックをお寄せください

ユーザーの方々からの直接のフィードバックが、何よりのモチベーションと組織を動かす原動力となります。よろしくお願いします。

サイボウズのアクセシビリティの情報については、ウェブサイトとTwitterで発信しています。よろしければチェックしていただけると幸いです。