こんにちは、TVerのサービスプロダクト本部でフロントエンドのEMをしている中谷です。
TVerでは、プロジェクトの開発進行とバランスを取りながら、アクセシビリティの向上に日々取り組んでいます。今回はユーザー様からいただいたお問い合わせをきっかけに、メーカー様のご協力を得て実機検証を行い、改善対応に繋げた事例について紹介させていただきます。
今回の対応について
意思伝達装置とは、ALSなどの難病で発話や身体操作が困難な方が、視線やスイッチといったわずかな動きで文字を入力しコミュニケーションを取ったり、PCなどを操作するための装置です。この装置を日常的に使っているユーザー様からお問い合わせをいただきました。
いただいた内容をもとに調査を進めたところ、TVer側の実装にいくつかのアクセシビリティ上の課題が見えてきました。
確認された課題と解決
課題は大きく二つありました。
1. ソフトウェアキーボードからの入力受付
TVer上でのキー入力ハンドリングが、ハードウェアキーボードのイベントのみを対象として実装されていました。そのため、意思伝達装置などで使われるソフトウェアキーボード経由の入力イベントが想定されておらず、反応しない状態になっていました。 原因は、入力判定に物理キーの位置を表す e.code のみを用いていた点にありました。ソフトウェアキーボードや支援技術では e.code が送られてこない場合があるため、e.code に加えて、入力された文字そのものを表す e.key でも判定するように修正し、解決しました。
2. プレイヤーメニューの操作性
動画プレイヤーにカーソルを合わせると再生・停止などの操作メニューが表示されますが、一定時間で自動的に非表示になる仕様でした。マウス操作であれば再度カーソルを動かせば済む挙動ですが、視線入力やスイッチ操作では、メニューが消えるまでに目的のボタンへたどり着くことが難しい状態となっていました。 こちらは、操作可能な要素(アイコン・ボタン)にホバーしている間はメニューを非表示にしないよう判定を加える形で、順次対応を進めています。
メーカー様のご協力と実機での検証
いただいたお問い合わせ内容から、コード上での問題の所在はすぐに把握できました。しかし、それが実際の操作においてどの程度の支障になっているのかは普段の開発環境ではなかなか実感しにくく、そこで今回意思伝達装置のメーカーである株式会社オレンジアーチ様に事情をご相談し、同社のeeyesをお借りすることができました。突然のご相談にもかかわらず検証の趣旨にご理解をいただき、快く実機をお貸しくださったことに、心より感謝しています。

実際に実機をお借りし、ユーザーの方と同じ環境でTVerを操作してみると、私たちが普段当たり前に行っている操作感覚とはまるで違いました。実機に触れてその難しさを体感したことで課題の解像度が上がり、対応を進めることができました。

アクセシビリティ対応の学び
Webアプリケーションは、無意識のうちにマウスとキーボード操作を前提に最適化されがちです。内側だけを見ていては気づけない課題に、外からの声と実機に触れる機会を通じて光を当てていただけたことは、たいへん貴重な経験でした。 TVerのアクセシビリティ対応は、まだ道半ばです。今回の対応ですべてが解決したわけではなく、私たちが把握できていない課題や、行き届いていない点が数多く残っていると考えています。これからも、できるところから一つずつ改善を重ねていきます。
TVerで働くWebフロントエンドエンジニア募集中!
TVerをより使いやすく便利にしていくための様々な機能開発や改善を行うために、 TVerのミッション「テレビを開放して、もっとワクワクする未来を」に共感いただけるテレビの未来を支えるエンジニアの方をお待ちしております!
累計9,000万DLの民放公式テレビポータルのアプリ開発を担う、Webフロントエンジニアを募集!
最後までお読みいただきありがとうございました。