1.
Chatwork Tech Talk #2
ChatworkのUXリサーチと
プロダクトへの生かし方
Chatwork株式会社
開発本部 プロダクトデザイン部
仁科智子

2.
自己紹介
2
仁科智子
Chatwork株式会社
開発本部 プロダクトデザイン部
UI/UXデザイナー・UXリサーチャー
@tomokoishida
@ttaggg
● 専門学校で映像を専攻、結婚式のビデオ制作会社に就職
● 社会人スクールでWeb制作を学び、Webデザイナーにキャリアチェンジ
● 2011年 株式会社istyleでUIデザイン、デザインマネジメント、
プロジェクトマネジメントなどを経験
● 2018年 AnyPay株式会社にて1人デザイナー
● 2019年 Chatworkにジョイン、プロダクトデザイン部にて、Chatworkの
UI/UXデザイン、UXリサーチ、サブマネージャー業務をおこなう

3.
今日話すこと
3
1. ChatworkにおけるUX負債
2. 小さな改善での取り組み
3. 今後やっていくこと

4.
01ChatworkにおけるUX負債

5.
Chatworkのプロダクトデザイナーの担当領域
5
プロダクトデザイン部の担当領域 ブランドデザイン室の担当領域
ビジネスチャット「Chatwork」のUI/UX コーポレートサイトやノベルティなど

6.
Chatworkのプロダクトデザイン部のミッション
6
プロダクトにおけるUI/UXに責任を持つ

7.
プロダクトデザイン部の今年のテーマ
7
❌ 最初から大きな改善に取り組む
プロダクトにおけるUXに責任を持つ

8.
プロダクトデザイン部の今年のテーマ
8
❌ 最初から大きな改善に取り組む
プロダクトにおけるUXに責任を持つ
⭕ 小さく改善する
⭕ 新たな負債を生まない

9.
ChatworkにおけるUX負債
9
Functional
Reliable
Usable
Pleasurable
今の機能品質
理想とする品質
UX Debt
品質
今の機能品質
理想とする品質
UX Debt
以前 現在

10.
ChatworkにおけるUX負債
10
抽象
表層
骨格
構造
要件
戦略
具体
UXの5階層モデル

11.
ChatworkにおけるUX負債
11
④ 戦略
体験設計の問題
体験設計が曖昧なまま開
発された機能がある
② 骨格
ユーザビリティの問題
リリース前後のデザイン
の評価をやりきれていな
い
③ 構造
情報構造の問題
初期に設計されたナビ
ゲーション・レイアウト
の構造から拡張しづらい
① 表層
見た目の問題
ベースのデザインが古
く、「変わってる感」が
伝わりづらい

12.
ChatworkにおけるUX負債
12
影響箇所が大きく部分的に進めるのが難しい。
じっくり取り組まないとさらなる負債になりうる
① 表層
見た目の問題
ベースのデザインが古
く、「変わってる感」が
伝わりづらい
② 骨格
ユーザビリティの問題
リリース前後のデザイン
の評価をやりきれていな
い
③ 構造
情報構造の問題
初期に設計されたナビ
ゲーション・レイアウト
の構造から拡張しづらい
④ 戦略
体験設計の問題
体験設計が曖昧なまま開
発された機能がある

13.
ChatworkにおけるUX負債
13
① 表層
見た目の問題
ベースのデザインが古
く、「変わってる感」が
伝わりづらい
② 骨格
ユーザビリティの問題
リリース後のデザイン評
価や改善をやりきれてい
ない
③ 構造
情報構造の問題
初期に設計されたナビ
ゲーション・レイアウト
の構造から拡張しづらい
④ 戦略
体験設計の問題
体験設計が曖昧なまま開
発された機能がある
部分的に進めやすく、
新たな負債を生みにくい

14.
14
大きく2つの開発フロー
① 表層
見た目の問題
② 骨格
ユーザビリティの問題
③ 構造
情報構造の問題
④ 戦略
体験設計の問題
小さな
改善
グロースエンジニアリング室
● 小規模な開発
● 取り組む施策は都度決定
機能追加
ロードマッププロジェクト
● 大きめな機能追加の開発
● 取り組む課題は事前にある程度決定
今日はこちらのお話！

15.
02小さな改善での取り組み

16.
小さな改善での取り組みでやったこと
16
ユーザーフィードバックの可視化とアイデアのスコアリング
チームの調整と施策の実施

17.
小さな改善 - ユーザーフィードバックの可視化とスコアリング
17
以前
PM
収集に
時間がかかる
リスト化＆スコアリング
施策をピックアップし、
PRDを作る
スコアリングに
時間がかかる
フィードバックを収集
施策検討までに
時間がかかる
現在
Airtableに集約し、定期的にPMとデ
ザイナーでスコアリングを行うこと
で、少ない手間で改善リストを作る

18.
小さな改善 - ユーザーフィードバックの可視化とスコアリング
18
傾向分析・把握が簡単に
今できる・やるべきことが
明白に
チャット上での
ディスカッションが可能に
① チャットへの自動通知 ② 機能やデバイスなどをタグ付け
機能
デバ
イス
③ 改善アイデアのスコアリング
工数 インパ
クト

19.
小さな改善 - チームの調整と施策の実施
19
グロースエンジニアリング室ユーザーフィードバック
改善検討チーム
PM デザイナー
PM デザイナー
エンジニア エンジニア
開発してくれるエンジニアを都度
自分たちでアサインしなくてはならない！
実は当初はグロースエンジニアリング室で取り組む予定ではなかった

20.
小さな改善 - チームの調整と施策の実施
20
グロースエンジニアリング室ユーザーフィードバック
改善検討チーム
PM
エンジニア エンジニア
PM デザイナー
デザイナー
実は当初はグロースエンジニアリング室で取り組む予定ではなかった
この体制になったことで、
高速にプロトタイピングが回せて超効率化🎉
PMとデザイナーのみの
チームはいったん廃止

21.
小さな改善 - 気づきと学び
21
企画〜開発まで一気通貫でできる固定チームは強い
デザインを固めている間にプロトタイプ作成、デザインを詰めながらユーザビリティ検証、など
常に施策を動かせるので、リリースまでのサイクルが早い
価値ある施策を超最小に砕かないとテーブルに乗らない
アイデアをスコアリングすることで「今取り組む理由」は明確になった反面、
「やりたい」ベースで取り組みづらくなったり、アイデアの時点で工数がかかりそうと
判断されるとテーブルに乗らない。
大きなことは別の取り組みで
小さな改善を目的としているので当然だが、小さな使い勝手の改善は事業インパクトにはつながりづらい。
小さな改善に絞った取り組みとは別に、大きな負債返却への取り組みは別枠が必要
気づき
学び
学び

22.
04今後やっていくこと

23.
今後取り組むべきUX負債
23
① 表層
見た目の問題
ベースのデザインが古
く、「変わってる感」が
伝わりづらい
② 骨格
ユーザビリティの問題
リリース後のデザイン評
価や改善をやりきれてい
ない
③ 構造
情報構造の問題
初期に設計されたナビ
ゲーション・レイアウト
の構造から拡張しづらい
フィードバック傾向は把握できた＆
よくいただくフィードバックは少しずつ潰せてきている
もっと顕在化しにくい課題を取りに行く
（ユーザビリティテストの定常実施）
④ 戦略
体験設計の問題
体験設計が曖昧なまま開
発された機能がある

24.
今後取り組むべきUX負債
24
① 表層
見た目の問題
ベースのデザインが古
く、「変わってる感」が
伝わりづらい
③ 構造
情報構造の問題
初期に設計されたナビ
ゲーション・レイアウト
の構造から拡張しづらい
④ 戦略
体験設計の問題
体験設計が曖昧なまま開
発された機能がある
案件ごとの体験設計、および
サービス全体の体験設計に取り組んでいく
② 骨格
ユーザビリティの問題
リリース前後のデザイン
の評価をやりきれていな
い

25.
今後取り組むべきUX負債
25
小さな改善の枠組みでは手がつけられないので、
腹を括ってプロジェクトとして取り組む
① 表層
見た目の問題
ベースのデザインが古
く、「変わってる感」が
伝わりづらい
② 骨格
ユーザビリティの問題
リリース前後のデザイン
の評価をやりきれていな
い
③ 構造
情報構造の問題
初期に設計されたナビ
ゲーション・レイアウト
の構造から拡張しづらい
④ 戦略
体験設計の問題
体験設計が曖昧なまま開
発された機能がある

26.
最後に

27.
こういったデザイン職種で仲間を募集しています！
27

28.
ありがとうございました！

29.
働くをもっと楽しく、創造的に