AI提供エラー時のアクセシブルなデグラデーションモード設計。ブラウザ状態モデルの実装によりユーザーに状態変化を通知しながらフォーカス奪取を回避する。
シェアックリップ
シェアされたアックリップです。
そのほかの #UXデザイン ピックアップ
Kyoto UI自由研究室 #1 (2026/11/13 19:00〜)
UI・UX・アクセシビリティに関する気づきや試験を持ち寄る勉強会。完成度不問で、途中経過や失敗事例の共有も歓迎する。
The Design + Accessibility Summit
デザイン専門家向けのオンラインサミット(第7回)。アクセシビリティの実装をマスターしたいデザイナーを対象とした、4日間の集中的なナレッジシェアと最新事例の紹介。
「誰もどれも取り残さない」は、どうつくる?|PROJECT SOLITの実践
ファッションを起点にインクルーシブデザインを実践する PROJECT SOLIT の代表による、社会の在り方を問い直すセッション。属性やカテゴリーではなく、人間の多元性から考えるアプローチと企業との共創事例を紹介。
加齢で水晶体が短波長の光を通しにくくなり、青系の色の見分けやすさに影響が出る仕組みを科学的に解説。色の違いが常に同じように見えるとは限らないこと、デザイン時は色以外の手がかりの必要性を指摘。
視覚障害で見えにくくなった著者が、生成AI(Claude)の助けを借りてアクセシブルなスライド動画作成ツール「UDスライド動画工房」を開発。音声に合わせて自動的にスライド長を決める設計で、大きなフォント・高コントラスト・キーボード操作のみで対応。
ユニバーサルプレゼンテーションの実例から、情報設計における課題を指摘。多言語対応や装置があっても対象者に見えない・聞こえない・意味が通じない例(美術館サイトの外国語ラベル、視覚障害向け信号の多言語化、点字案内の視認性、電車アナウンスの聞き取りにくさ)を挙げ、情報が確実に届くための3つのチェックを紹介。
そのほかの #生成AI ピックアップ
EU域内でWebサービス・アプリを提供する企業が対応すべきアクセシビリティ関連法制(EAA・WAD・雇用平等指令)と、WCAG基づく実装方法、EU主要国の罰則・執行事例を解説。AI画面開発におけるアクセシビリティ要件化の必要性も論じる。
視覚障害で見えにくくなった著者が、生成AI(Claude)の助けを借りてアクセシブルなスライド動画作成ツール「UDスライド動画工房」を開発。音声に合わせて自動的にスライド長を決める設計で、大きなフォント・高コントラスト・キーボード操作のみで対応。
Windows 11 Narrator の画像説明機能が、NPU 非搭載の通常 PC ではハルシネーション(AI の幻覚)を起こし不正確な出力になる問題と、その技術的背景、ユーザーの自衛策について。
生成AIのストリーム出力をキャンセルした後も、スクリーンリーダーが遅延テキストを読み上げる競合状態バグの原因特定と修正方法。UI状態管理を状態テーブルで明確化することで根本原因(クライアント側のストリーム継続)を解明する開発プロセス。
ストリーム型のAI生成UIにおいて、キャンセル操作時にフォーカスを失い、古い状態の通知がスクリーンリーダーで宣言される問題を分析。WAI-ARIAのライブリージョンとフォーカス管理の実装パターンと、デバッグ手法を具体的に解説している。
生成AI(Claude)が撮影画像やPDFの内容を読み取り・解析する機能を活用し、視覚障害のある人の日常的な困りごと(テキスト認識・情報抽出・細部確認)を解決する方法をデモンストレーション。VoiceOver(iOSスクリーンリーダー)の初級ガイド。
そのほかの #WAI-ARIA ピックアップ
ストリーム型のAI生成UIにおいて、キャンセル操作時にフォーカスを失い、古い状態の通知がスクリーンリーダーで宣言される問題を分析。WAI-ARIAのライブリージョンとフォーカス管理の実装パターンと、デバッグ手法を具体的に解説している。
エラーメッセージは何が失敗したかを具体的に示し、理由と回復方法を明示する。『Invalid input』のような曖昧な表現ではなく、実行可能な指示が必要。
React でメールフォームを実装する際に、フォーカス管理とアクセシビリティを両立させる方法。フォーム状態(読み込み中、成功、エラー)の変化を WAI-ARIA で通知しながら、キーボード操作とスクリーンリーダーに対応。エラー時のフォーカス復帰の実装方法を解説。
セマンティック HTML がスクリーンリーダーや支援技術でいかに機能するか、ランドマーク・見出し・フォーム要素の正しい使用の重要性を解説する。
Accessible Toast Messages: What Developers and Designers Need to Know | Accessible Web Webinar
UIのトースト通知(バナー・ステータス更新)をスクリーンリーダーに正しく読ませるための実装ガイダンス。重複通知や通知漏れを避けるための開発とデザインのポイント。
カスタム作成した UI 要素がスクリーンリーダーに役割と状態を伝えていない WCAG 4.1.2 の失敗パターンを解説。ネイティブ HTML 要素の利用と正しい ARIA role 付与の重要性を説明