今日から意識できるアクセシビリティ #CM_LY_a11y
2025.04.01クラスメソッドとLINEヤフーが語るLINEミニアプリのアクセシビリティに登壇してきました！
先日、LINEヤフー社とクラスメソッドの共同イベント「クラスメソッドとLINEヤフーが語るLINEミニアプリのアクセシビリティ」にて「今日から意識できるアクセシビリティ」というテーマで登壇させていただきました。
当ブログでは登壇内容を要約してお伝えします。
資料はこちらからご確認ください。
事例紹介：旭化成ファーマのLINEミニアプリ
最近携わった旭化成ファーマ様の「服薬支援プログラム」のLINEミニアプリ開発について紹介しました。
詳しい事例内容は「服薬支援プログラムを紙からLINEへ 高齢者を意識したUI/UX設計で使いやすい仕組みを実現」をご確認ください。
このプロジェクトでは、紙ベースの服薬支援をLINEミニアプリに移行し、高齢者を意識したUI/UX設計をしました。
LINEミニアプリ化による主なメリットは2つ：
- 個人情報登録の壁を取り払える（住所などの個人情報提供が不要に）
- ユーザーの状況を分析しながら治療の継続をサポートできる
上記の理由からLINEミニアプリでの開発を採用しました。
アクセシビリティのための情報整理
高齢者向けの画面設計では、まず「高齢者」という対象を具体的に理解することから始めました：
- 65歳以上の方が高齢者と定義され、人口の29.1%を占める
- 高齢者の約70〜75%が何らかの白内障の症状を持っている
- 約40%（1451万人）の高齢者が2つ以上の慢性疾患を抱えている
※ 参考：総務省『人口推計』（2023年9月時点）、厚生労働省『国民健康・栄養調査』『患者調査』（2019年〜2021年）および関連研究データを基に作成しました。
これらの情報から、具体的な対応策を考えることができます：
- 白内障の方には、コントラストの高い画面設計
- 手の動きに制限がある方には、大きめのタップ領域
また、実際のユーザーが使用する端末についても調査し、高齢者向け端末でもテストを実施しました。
これにより、タッチ感度の違いなど、通常のスマートフォンとは異なる操作感を把握できました。
UIの具体的な設計ポイント
-
テキストの大きさ
- 見出しは22ポイント、本文は18ポイントの太字を使用（WCAG準拠）
-
コントラスト（明暗差）
- 少なくとも4.5対1のコントラスト比を確保（WCAG準拠）
- 確認ツールとして「カラーコントラストアナライザー」や「カラーレビュー」を活用しました。
-
メンタルモデルの活用
- ユーザーが既に学習している概念を取り入れる。
- 例：補聴器業界の「右耳用は赤色」「左耳用は青色」という色分けを参考にしました。
-
入力のしやすさ
- 複数設問ではなく「一問一答形式」を採用。
- ボタンには陰影をつけて「押せる」ことを視覚的に明確化しました。
まとめ
アクセシビリティ対応のポイントは大きく2つ：
-
情報を整理する
- 対象ユーザーの状況を具体的に考える
- ユーザーに合った環境（プラットフォーム）を検討する
-
UIを設計する
- テキストの大きさ、コントラストはWCAGを参考にし、ツールを活用する
- ユーザーのメンタルモデルを意識する
- ユーザーに合った画面構成を考える
アクセシビリティは特別なことではなく、ユーザーへの配慮の積み重ねです。
短い開発期間の中でも、お客様とその先のユーザーに寄り添って考えることが大切だと感じています。
おわりに
以上が登壇内容になります。
オフラインのイベントに登壇することは初めてだったので、参加者の方に親身に話しかけていただきとても嬉しかったです！
貴重なお時間をいただき、ありがとうございました。
