Helpfeelがアクセシビリティにどのように取り組み始めて、どこまで来れたのか/Helpfeel Accessibility 2025-07

アクセシビリティ言われてやること？エンジニア・デザイナーが語る 良いプロダクトを作るアクセシビリティ での登壇資料です。

リンクなどを見れるGoogle Slide版もあります。

Transcript

1. Helpfeelがアクセシビリティに どのように取り組み始めて、 どこまで来れたのか 2025.07 Pasta-K 2025.07.09 (Wed) アクセシビリティ⾔われてやること？エンジニア‧デザイナーが語る 良いプロダクトを作るアクセシビリティ 1
2. • Pasta-K ◦ よく呼ばれる呼び⽅: /^ぱすた(けー?)?(くん|さん)*$/ ◦ https://x.com/pastak ◦ https://blog.pastak.net/ • 京都⽣まれ京都育ち京都在住 • 株式会社Helpfeel 開発部 Gyazo開発チーム • 主にフロントエンドをメインにしています ◦ アクセシビリティ ◦ ブラウザ関連技術 ◦ React / TypeScript About me 2
3. 株式会社 Helpfeelのプロダクトについて 3
4. 　　 画像・動画基盤 4 プロダクト‧ラインアップ ナレッジの専⾨会社として、情報の川上から川下までをカバー それぞれのサービスが情報の収集（Gyazo）、編集（Helpfeel Cosense）、検索（Helpfeel）に特化 ToB 画像‧動画基盤     ナレッジ管理 検索システム あらゆる情報を整理できる 画期的な知識共有サービス 世界トップシェアを誇る スクリーンショット共有ツール 検索に特化しどんな質問にも 答える疑問解決システム Cosense Gyazo Helpfeel ToC
5. ご利⽤法⼈‧サービス⼀覧 各社の顧客向けFAQはhttps://www.helpfeel.com/showcaseにリンクがございますので実際にお試しいただけます （社内⽤や限定公開のFAQとしてご導⼊の企業様の場合は、⼀般公開されていないためご覧いただけません） 5 業界のリーディングカンパニー含め600サイト以上で採⽤されています。
6. どのような質問表現にも適切な答えを導き  利⽤者の⾃⼰解決率を上げるFAQ検索ツール Helpfeel
7. 7 Helpfeel（ヘルプフィール）とは？ どのような質問表現にも適切な答えを導き  顧客の⾃⼰解決率を上げるFAQ検索ツール Helpfeelは特許技術と⽣成AIを組み合わせることで、⼈ごと に微妙に違ってくる曖昧な⾔葉の表現や、感覚的な⾔葉の表 現、スペルミス等にも対応でき、検索ノーヒット “0%”を ハルシネーション（誤回答）なく実現するGoogleより も検索しやすい⾰新的なFAQシステムです。お客さま⾃⾝が適 正な回答を検索できる事で、サービスからの離脱を防ぎ、契約 の問い合わせなど、よりポジティブなアクションに働きかけて いくことができます。 ※1 出典：富⼠キメラ総研「2025 ⽣成AI∕LLMで⾶躍するAI市場総調査」 ※
8. どの会社もFAQはあれど、ユーザーの ⾃⼰解決を実現できていない ‧回答記事はあるけど、お客様が⾒つけ  られていない ‧さまざまなリテラシーのお客様がいる中  で、その⾔い回しの幅は広い ‧⾒つからないから問合せが増える Helpfeelは独⾃検索技術で、あらゆる⾔い 回しに対応 ‧1つの記事から50倍に拡張するので、  どんな検索ワードも拾う ‧⾔い換え、誤字脱字、動詞の活⽤があっ  ても、問題なく⾒つかる Helpfeelで ⾒つかる範囲 Helpfeelの特徴①「検索性」 8 返⾦してほしい 返⾦依頼⽅法 ▪ ▪ ハンコを紛失 判⼦を紛失 判⼦をなくした 判⼦がなくなった 印鑑をなくした 印鑑を無くした ▪ ▪ ▪ 盗まれてしまった 紛失のお ⼿続き お客様が探す記事 記事 特許技術「意図予測検索」のおかげで、どんな⾔い回しでも記事にたどり着ける 印鑑 ハンコ なくした 他のFAQで ⾒つかる範囲 届出印を紛失 届出印 検索ワード 盗まれた
9. 何故アクセシビリティについての取り組みを始めたか 9
10. • 営業時の話題に「Webアクセシビリティ」という⾔葉が先⽅から出るよう になってきた（2022年頃？の議事録には登場していて失注に繋がっていた ようであった……） • ⾃分⾃⾝としてもアクセシビリティの向上をやっていって欲しいという思い があった ◦ 個⼈的な経験からバリアフリーやユニバーサルデザインには想いが あった • 『Webアプリケーションアクセシビリティ』が出たりもして、⾊んな社内の ⼈を説得するための材料や武器が揃った 主なきっかけたち 10
11. • フェローの増井を筆頭に、HCI（Human‒Computer Interaction）に強みがある と⾃負していた ➢ 『より多くの⼈が当社のデジタルツールを使い、情報格差の問題から解放され るために、誰もが使えるユニバーサルデザインを重視しています』 ▪ Helpfeel Tech Conf 2024 の コンセプトより • 「ユニバーサルデザインは⼤切だよね」と⾔ってはいたものの、本当に必要な アクセシビリティを提供できているか？を点検したことはなかったことに気付い た → 「出来ているつもり、やっているつもり」になってないか？ 「UI/UXのHelpfeel」からその先へ 11
12. ⾃社イベントでCTOから発信したステートメント 12 Helpfeel Tech Hour Vol.3 アクセシビリティを始めたい！編 オープニングトーク 2023/06/16 開催 より
13. BtoBtoC SaaS と アクセシビリティ または僕が社内に向けてどのようにアクセシビリティを説いたか 13
14. • Helpfeelの営業先‧導⼊するのはBusinessの顧客 • 導⼊先の多くは顧客ウェブサイトのFAQ • 我々が提供しているサービスを実際に操作するのは顧客のお客様 ◦ 例えば、ECサイトのFAQとして導⼊いただいた場合は、Helpfeelを実 際に操作するのはそのECサイトを利⽤するユーザーさま • Helpfeelは顧客ウェブサイトの体験の⼀部 ◦ 求められる⽔準は「顧客ウェブサイト」と同等かそれ以上 ※ Helpfeelは社内向けやコールセンター向けにも提供していますが、今回はBtoBtoCのケースに絞っています toBとして売り、toCとして使われるSaaS 14
15. • 顧客は中⼩企業からナショナルクライアント‧官公庁まで多岐にわたる • 「すべての顧客の要求の和集合」が我々が提供すべきアクセシビリティ要求 の⽔準であるはず ◦ 単純化すると⼀番要求が厳しい顧客の⽔準を満たすのが⽬標になる ◦ そうしないとSaaSとして“⼤きな”顧客を掴むことが出来ない • 逆に考えると、この⽔準を我々がしっかり提供できて、SaaSとしても広め ていければ、あらゆる業種のウェブサイトや社内FAQなどに最⾼⽔準のアク セシビリティが在る状態を実現できる ◦ 「アクセシビリティ向上はオプションです」はナシ ◦ どこかのために⾏った改善は多くの導⼊先でも同様に⼊っていく toB だからこそ最⾼の状態を届けるチャンスがある 15
16. • FAQからアクセシビリティを底上げしていく • ⾊々な⼈が⾊々なサービスや体験に関する疑問を⾃⼰解決できるようにし ていくことがHelpfeelの使命 ◦ ウェブのFAQで⾃⼰解決出来ないと、問い合わせフォームやさらには電 話やメールを使わないといけなくなってしまう • 個⼈的にはFAQのアクセシビリティが良いことが、他のページや機能‧体験 のアクセシビリティを⾼めるキッカケとして更に波及できる状況になって いって欲しいと思っている ◦ FAQで解決⽅法は分かったのに、それをするための操作のアクセシビリ ティが⼗分ではなかったら？ アクセスできないFAQは本末転倒では？ 16
17. SaaSはウェブアプリケーションが主体ではあるが、ユーザーがサービスに たどり着くまでには多くの接点がある。それらのアクセシビリティは⼗分 か？ • 新機能紹介のためのブログやプレスリリースのアクセシビリティ ◦ 利⽤しているSaaSやCMSはアクセシビリティのための⼗分な機能を有しているか • 展⽰会でのポスターなどの掲⽰物や動画CMなどのアクセシビリティ ◦ ⾊や⽂字の使い⽅は適切か。字幕などが適切に設定されているか。 • 営業資料のアクセシビリティ 業種をまたいで取り組んでいく 17
18. • アクセシビリティの重要度が理解されていないと、他業種から「もっと優先 度の⾼い開発事項があるからそっちをやってくれ」と⾔われることがあるら しい…（同僚が以前の職場で⾔われたという話を聞きました） • 場合によっては顧客に影響のある改善や変更になることもあるので、顧客に 理解をしてもらうためのコミュニケーションを取ってもらう必要もある ◦ 「強調のために⽂字⾊を変更できるようにして欲しいです」 • ユーザビリティ改善、新機能開発、ビジネスのための開発などと同様に重 要性のある取り組みだと理解してもらって、社内で相互にアクセシビリティ 改善を応援‧評価できる⼟壌を作っていきたい 越境と協業が必須 18
19. 具体的な取り組みの紹介 その他の取り組みや個々のより詳細は過去の登壇スライドで紹介しています 「アクセシビリティを始めたい！」から1年、あれからどうなったのか。 19
20. • Helpfeelの検索型AI-FAQが総務省「情報アクセシビリティ好事例2024」に 選定 • 広報チームから提案があり、プロダクトのエンジニアと協⼒して応募 ◦ ⾃⼰評価などに取り組んだエンジニアによるZennの記事: 情報アクセシ ビリティ好事例2024に向けてHelpfeelを⾃⼰評価しました • ⾃⼰評価様式なども公開 ◦ Helpfeelによくある質問 - Helpfeelのアクセシビリティ対応 情報アクセシビリティ好事例2024 20
21. • 隔週の⽔曜⽇の⼣⽅にSlackの Huddleで30分〜1時間ほど開催 • 集まった⼈たちで話題を持ち寄る ◦ 世の中のアクセシビリティに 関する話題 ▪ Blog‧本‧ニュース etc ◦ 開発しているプロダクトに関 する相談 アクセシビリティオフィスアワー 21
22. 22 LP観察会 • デザイナーや広報と⼀緒にサービスや会社のLPのアクセシビリティの状況 を観察しながら、改善点や現状の良いポイントなどを共有 ◦ Lighthouseの使い⽅‧読み解き⽅なども紹介 ◦ ymrlさんのAccessibility Visualizerが誕⽣してからより分かりやすくな りました • メニューの⼀部がTabでフォーカスできない • CMSがimgのaltにデフォルトでファイル名を挿⼊している • Helpfeelのオレンジ⾊をテキスト⾊に使うとコントラスト⽐を保つことが難 しくなる ◦ Helpfeelには⻘⾊がもあるので、上⼿く使い分けたり組み合わせて担保
23. 23 「アクセシビリティをはじめよう」勉強会 アクセシビリティに関する導⼊資料を⽤いた勉強会を不定期に実施
24. • Helpfeelは「(FAQで)世直しをするんだ」と⾔っている ◦ ⾊んな⼈に⾃分でFAQを使って疑問を解決できるのが当たり前になる世 の中にしていきたい。そのためにはアクセシビリティは必須。 • 使ってもらうアクセシビリティだけではなく、サービスを知ってもらうため にもアクセシビリティは必要。 ◦ そのために社内の⾊んな業種‧⾊んな仕事において、これはアクセス可 能か？を考えてもらえるようにもっとしていきたい • まだまだアクセシビリティについて関⼼や理解に差があるので、全社的な底 上げのための取り組みも模索していきたいと（個⼈的には）思っている ◦ 不定期の勉強会をまずは定期化→オンボーディング研修化？ まとめ 24