Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
UIデザイナーが500ページ超のヘルプを書いて得られたもの
Search
Keisuke Miyajima
July 07, 2020
Design
0
290
UIデザイナーが500ページ超のヘルプを書いて得られたもの
UX JAM Online #05 のLTの資料です。
Keisuke Miyajima
July 07, 2020
Tweet
Share
More Decks by Keisuke Miyajima
See All by Keisuke Miyajima
UXを視野に入れたUIリニューアルのプロセス
myzksk
1
740
Other Decks in Design
See All in Design
急成長中のWINTICKETにおける ちいさくはじめるライティング改善 / winticket-writing
cyberagentdevelopers
PRO
1
210
Tableau曲線表現講座(2024.11.21)
cielo1985
0
180
Managing Design Systems (Smashing NY 2024)
nathanacurtis
2
340
Design Your Own App Using Figma by Medha Muppala
gdgmontreal
0
1.5k
ビジョン実現を加速させるデザインプログラムマネージャーの視座とキャリア/ Designship2024_Sato
root_recruit
0
210
Managing Design Systems (Antwerp 2024)
nathanacurtis
1
330
みんなに知って欲しい 視覚過敏のアクセシビリティ
0opacity_
5
1.6k
太田博三(@usagisan2020)
otanet
0
200
コンセプトで経営・事業・組織を動かす、 Ameba20周年ブランディング / ameba-20th-branding
cyberagentdevelopers
PRO
1
420
ENEOS社事例|アプリ事業を加速させるデザイナーの取り組み / dx-eneos-design
cyberagentdevelopers
PRO
1
520
How to go from research data to insights?
mastervicedesign
0
180
ゲーム開発における、Figma活用事例の紹介 / applibot-figma
cyberagentdevelopers
PRO
2
450
Featured
See All Featured
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
191
16k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
26
1.5k
Documentation Writing (for coders)
carmenintech
66
4.5k
How To Stay Up To Date on Web Technology
chriscoyier
789
250k
Being A Developer After 40
akosma
87
590k
Testing 201, or: Great Expectations
jmmastey
40
7.1k
Rebuilding a faster, lazier Slack
samanthasiow
79
8.7k
RailsConf 2023
tenderlove
29
940
Building Adaptive Systems
keathley
38
2.3k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
17
2.3k
Imperfection Machines: The Place of Print at Facebook
scottboms
266
13k
Into the Great Unknown - MozCon
thekraken
33
1.5k
Transcript
UIデザイナーが500ページ超の ヘルプを書いて得られたもの 株式会社グラッドキューブ 宮島 敬右
宮島 敬右 Keisuke Miyajima UIデザイナー HCD-Net認定 ⼈間中⼼設計スペシャリスト 3級 テクニカルライティング
「SiTest (サイテス ト) 」 は、 ウェブサイ トの解析・改善によく⽤いられる 「ヒートマップ」 や 「A/Bテス
ト 」 などのツールを 『オールインワン』 で提供する、 SaaSのウェブアプリケーションです。
情報設計 ユーザー コンテンツ コンテキスト
情報設計 ユーザー コンテンツ コンテキスト
コンテキスト 背景 多機能なツールでありながら、 ヘル プページの情報量が少ない。 お問い合わせに対してヘルプに誘導 しにくいので、 利⽤者が増えるほど サポートコストも増える。 ヘルプとしての
「あたりまえ品質」 を 提供しなければならない。
コンテキスト ⽬的 品質の下⽀え →「サービス利⽤者」 の体験向上 お問い合わせ対応の⼯数削減 →「サービス提供者」 の体験向上 社員教育のための資料化 →「サービス提供者」
の体験向上
不安を抱かずに サービスを利⽤できる コンテキスト ゴール
情報設計 ユーザー コンテンツ コンテキスト
どのレベルの 「リテラシー」 の ユーザーが⽇常的に使⽤してい る⾔葉で書く? どのレベルの 「リテラシー」 の ユーザーが理解できる説明量で 書く?
ユーザー
カスタマーサポート担当者からの 情報をもとに 「初⼼者〜中級者」 に設定
サービス全体と各機能の 「利⽤ 前〜利⽤中〜利⽤後」 の時系列 「何を達成したいのか」 ・ 「何に 困っているのか」 ユーザー
利⽤の時系列とUIの画⾯構成に沿った サイ トの構成にする 「機能の説明」 と 「よくある質問」 を 分類する
情報設計 ユーザー コンテンツ コンテキスト
対象のドメインで⼀般的に通⽤ する⽤語・略語にもなるべく説 明をつける 「画⾯上の要素の説明」 と 「タス クの⼿順」 をそれぞれ⽤意する 「問題解決」 だけでなく、
機能か ら得られる 「価値」 も伝える コンテンツ
ヘルプもサービスの重要な タッチポイントと位置づけて、 利⽤のモチベーションが上がる コンテンツを⽬指す
UIとタスクのフローについては デザインした⾃分がすべて説明 できる (べき) 技術やユーザーとの契約に関す るは内容はエンジニアとセール ス担当者の協⼒が必要 コンテンツ
正確性の担保や抜け漏れの防⽌には 部⾨・役割を横断した コミュニケーションが不可⽋
3級テクニカルライ テ ィ ングの資格 コンテンツ
推薦図書を買って1回講習を受けて 10時間ほど勉強すれば、 わりと⾼い確率で合格できる 受験の費⽤は16,000円く らいで、 HCD認定のような更新の⼿続きもない
過剰にへり くだらない ✕:〜させていただきます。 ◦:〜できます。 修飾語の係り受け ✕:⼤幅に時間と費⽤を節約できます。 ◦:時間と費⽤を⼤幅に節約できます。 簡潔に ✕:〜することが可能になります。 ◦:〜できます。
なるべく肯定的に ✕:〜しないでください。 ◦:〜してください。 漢字をひらく ✕:頂く ◦:いただく ✕:下さい ◦:ください など ⼀⽂⼀義 ⽂⾔の統⼀
https://support.sitest.jp/hc/ja
成果 ヘルプページへのアクセスが増加 ヘルプの活⽤の頻度が向上して サポート⼯数が減少 カスタマーサポート担当者以外の 担当者も、 問い合わせに回答で きるようになった
※個⼈の感想です。 1. プロダクトとサービスに対する客観性 2. 説明の⽂章を考えるときのスピード 3. 簡潔に伝えるための⽂章⼒
テクニカルライテ ィ ングの基礎を学ぶのは、 UIデザインやコミ ュニケーショ ンの ち ょ っと したスキルア
ッ プにおすすめです ※個⼈の感想です。
参考にした書籍 『⽇本語スタイルガイド』 『ヘルプサイトの作り⽅』 『⽇本語の作⽂技術』 『実践・⽇本語の作⽂技術』 『分かりやすい表現の技術』 『理科系の作⽂技術』 テクニカルライティングの基礎を 学べる推薦図書 ヘルプサイトを作るプロセスと、
公開後の運⽤を学べる ⽇本語の作⽂の正しい⽂法・構成 を学べる 相⼿に伝わりやすい筋道の⽴て⽅ と、説明の表現や構成を学べる 38年前に出版された名著 「説明書」について⾔及している のは10ページほどだが、本質がす べて書かれている