「ちいさくはじめるデザインシステム」とUXライター

LINE Technical Writing Meetup vol. 24にてお話したSmartHR Design Systemとそれをまとめた書籍「ちいさくはじめるデザインシステム」の出版で、UXライターがどんなことをしたかについてまとめたスライドです。

Transcript

1. 「ちいさくはじめるデザインシステム」 とUXライター 株式会社SmartHR｜UXライター おおつかあぐり LINE Technical Writing Meetup vol. 24
2. © 2023 Aguri Otsuka All Rights Reserved. @aguringo おおつかあぐり UXライター / SmartHR Inc. About Me
3. © 2023 Aguri Otsuka All Rights Reserved.
4. © 2023 Aguri Otsuka All Rights Reserved.
5. © 2023 Aguri Otsuka All Rights Reserved. 今日お話すること どうしてUXライターが デザインシステムを運用しているのか？
6. © 2023 Aguri Otsuka All Rights Reserved. できることが増えると…
7. © 2023 Aguri Otsuka All Rights Reserved. つねに自分に問いかけている言葉 UXライターって どんな価値貢献するの？
8. © 2023 Aguri Otsuka All Rights Reserved. https://note.com/aguri/n/n024d48ba30d3 https://note.com/aguri/n/n5e7f8591df79
9. © 2023 Aguri Otsuka All Rights Reserved. 4年目時点での考え（イマココ）
10. © 2023 Aguri Otsuka All Rights Reserved. UXライターは、どうやって価値貢献するのか？ t 開発現場での意思決定の再現性を率先して高 めg t マルチプロダクト化するアプリケーションの ユーザーの学習コストをできるだけ下げる
11. © 2023 Aguri Otsuka All Rights Reserved. デザインシステムとは 「ちいさくはじめるデザインシステム」 「デザインシステム」は、デジタルプロダクト開発においてその必要性や役割を 言及されることが多い概念です。GoogleのMaterial DesignやAdobeのSpectrum など、有名企業をはじめ業種や業態を問わず、数えきれないほどのデザインシス テムが公開されています。 プロダクトの重要性が増すにつれ、プロダクトが示す領域も広がり、デザインシ ステムが取り扱う範囲も広がってきています。タイポグラフィやレイアウト、 色、アイコン、コンポーネントといった、デザインに関する事柄だけでなく、言 葉の表現や雰囲気など、ユーザーとのありとあらゆる接点を網羅する必要が出て きているともいえるでしょう。デザインシステムは、不確実性の高いモノづくり の現場において、良いモノを作るための1つの手段なのです。
12. © 2023 Aguri Otsuka All Rights Reserved. だから、 UXライターは デザインシステムの運用に 携わっている
13. © 2023 Aguri Otsuka All Rights Reserved. Document／文書 ドキュメントとは？
14. © 2023 Aguri Otsuka All Rights Reserved. Document／文書 の意味 英語の翻訳：〔正式な〕公文書、記録文書 語釈：参照されることを前提として残す記録
15. © 2023 Aguri Otsuka All Rights Reserved. UXライターがデザインシステムに関わる意義 意思決定の抽象化をして記録を残し、 その再現性を高める
16. © 2023 Aguri Otsuka All Rights Reserved. 「〇〇して、△△にする」 「▪▪したら、▼▼になった」 「hogeのときには、fugaする」
17. © 2023 Aguri Otsuka All Rights Reserved. 具体を集めて、ルール＝抽象化する過程 収集・分類・定義（命名）
18. © 2023 Aguri Otsuka All Rights Reserved. 抽象化はUXライターの得意分野 「ちいさくはじめるデザインシステム」 「調査・分類・抽象化」といったUIテキストの作成プロセスは、イン ターフェースインベントリのプロセスに類似しています。インター フェースインベントリとは 、 プロダクト上のUIコンポーネントを調 査・分類し、コンポーネントに対する共通認識を醸成する活動を指す 言葉で、デザインシステムを構築するうえで「最初の一歩」として位置 付けられることもあります。つまり、UIテキストの作成は、その営み 自体がデザインシステムのガイドライン作成に通ずるものといえます。 SmartHRのUIテキストガイドラインも例外ではありません 。UIテキス ト作成のために、既存のUIテキストを収集・分類・抽象化していく過 程で、プロダクト全般に適用できるガイドラインがおのずと生まれて いったのです。
19. © 2023 Aguri Otsuka All Rights Reserved. SmartHR デザイン原則
20. © 2023 Aguri Otsuka All Rights Reserved. おさらい
21. © 2023 Aguri Otsuka All Rights Reserved. UXライターがデザインシステムにコミットすると… デザインの意思決定を誰もが参照しやすいように なる 開発者の意思決定の足並みが揃う ユーザーに提供するプロダクトの使い勝手が良い 状態が生まれる
22. © 2023 Aguri Otsuka All Rights Reserved. 今日のテーマの別の角度からの話はこちらでもお読みいただけます デザインシステムの運用体制についてはこちら 開発しながらガイドライン化する考え方についてはこちら https://note.com/aguri/n/n2665dcdc5948 https://speakerdeck.com/aguringo/20220315-design-study-morning07
23. Confidential - Not to be disclosed or distributed to third parties. Copyright © 2022 Aguri Otsuka All Rights Reserved. 書籍化にあたって
24. © 2023 Aguri Otsuka All Rights Reserved.
25. © 2023 Aguri Otsuka All Rights Reserved. ・ 台割（全体の構成）の作成 ・ リライト、トーン＆マナーの調整 ・ インタビューを元にしたコラム原稿作成 書籍化にあたって
26. © 2023 Aguri Otsuka All Rights Reserved. 書籍化に関するエピソードはこちらでもお読みいただけます 入社半年だから書けた、ちいさくはじめるデザインシステム 私たちはいつだって、Work in Progress https://note.com/aguri/n/ndedb58e0ec1f https://note.com/47178/n/n67341b10343a
27. Confidential - Not to be disclosed or distributed to third parties. Copyright © 2022 Aguri Otsuka All Rights Reserved. 最後に
28. We Are Hiring!
29. © 2023 Aguri Otsuka All Rights Reserved. https://open.talentio.com/r/1/c/smarthr/pages/45059 一緒に働きたい！ という方 お待ちしております