Slide 1

Slide 1 text

プロダクトデザイン組織の 新しい取り組み プロダクトデザイナー 小野田 純也 #RAKUSMeetup

Slide 2

Slide 2 text

プロダクトデザイン課について What’s Product Design Ka? #RAKUSMeetup

Slide 3

Slide 3 text

課の課題 (約1〜2年前) ・ UIデザイナー不在のプロダクトがある ・ 表層(見た目のところ)だけしか担当できていないプロダクトも ・ 要件定義など上流に関われていない デザイナーの担当領域が表層を綺麗にするだけ!? #RAKUSMeetup

Slide 4

Slide 4 text

mission プロダクト開発の中心となって 顧客課題を解決する 優れたUXを生み出す #RAKUSMeetup

Slide 5

Slide 5 text

mission プロダクト開発の中心となって 顧客課題を解決する 優れたUXを生み出す #RAKUSMeetup

Slide 6

Slide 6 text

つまり、 プロダクト開発の「ハブ」となり 要望や課題を取りまとめ、 最適解を導きだす。 #RAKUSMeetup

Slide 7

Slide 7 text

今回お話するテーマ ハブ 【 hub 】 #RAKUSMeetup ハブじゃない ハブはこっち

Slide 8

Slide 8 text

ハブとして開発の中心となった取り組みの紹介 「東京ハブストーリー」 #RAKUSMeetup

Slide 9

Slide 9 text

新規サービス開発 ユーザーインタビュー ターゲット像の策定 第1話 ※いずれもプロダクトデザイン課メンバーによる活動紹介になります 第2話 第3話 Episode 「新サービスは突然に」 「声を聴かせて」 「あなたを知りたい」 #RAKUSMeetup 東京ハブストーリー

Slide 10

Slide 10 text

新規サービス開発 第1話 #RAKUSMeetup 東京ハブストーリー

Slide 11

Slide 11 text

新サービス開発における背景 電子帳簿保存法改正 2022年1月施行開始 #RAKUSMeetup 1.新規サービス開発

Slide 12

Slide 12 text

#RAKUSMeetup ハブ的取り組み 共通UIライブラリの作成& Storybookの導入・フロントエンドエンジニアとの連携 プロトタイプを用いて様々な関係者との仕様のすり合わせ プロモーション施策への関わり・クリエイティブ課と連携 1 2 3 1.新規サービス開発

Slide 13

Slide 13 text

#RAKUSMeetup 1.新規サービス開発 複数のプロダクトがある中でそれぞれデザインや操作感が異なる。 1-1. 共通UIライブラリの作成

Slide 14

Slide 14 text

#RAKUSMeetup 1.新規サービス開発 デザイナー間でデザインプリンシプルやポジショニングを整理 1-1. 共通UIライブラリの作成

Slide 15

Slide 15 text

1-1. 共通UIライブラリの作成 1.新規サービス開発

Slide 16

Slide 16 text

1-2. Storybookの活用 1.新規サービス開発 デザイナー × フロントエンドエンジニアで連携!

Slide 17

Slide 17 text

2.プロトタイプを用いて関係者との仕様のすり合わせ 1.新規サービス開発 デザイナー × 事業部長 × 企画 × CS × 開発ですり合わせ!

Slide 18

Slide 18 text

3.プロモーション施策への関わり 1.新規サービス開発 プロダクトデザイン課 → クリエイティブ課へ! ロゴカラー LPデザイン案 バナーデザイン案

Slide 19

Slide 19 text

1.新規サービス開発 そしてついに...

Slide 20

Slide 20 text

1.新規サービス開発 リリース !!

Slide 21

Slide 21 text

1.新規サービス開発 結果 リリース開始から約3か月で 1万社のお申込み獲得!

Slide 22

Slide 22 text

1.新規サービス開発 さらに、 楽楽電子保存開発チームで受賞! チャレンジ賞受賞!!

Slide 23

Slide 23 text

第1話 完 #RAKUSMeetup 1.新規サービス開発

Slide 24

Slide 24 text

新規サービス開発 ユーザーインタビュー ターゲット像の策定 第1話 ※いずれもプロダクトデザイン課メンバーによる活動紹介になります 第2話 第3話 「新サービスは突然に」 「声を聴かせて」 「あなたを知りたい」 #RAKUSMeetup Episode 東京ハブストーリー

Slide 25

Slide 25 text

東京ハブストーリー ユーザーインタビュー 第2話

Slide 26

Slide 26 text

実施の背景 #RAKUSMeetup 2.ユーザーインタビュー 新機能を実装したが当初の計画より全体の使用頻度が高くないため PDMからプロダクトデザイン課に「UX改善」の依頼をいただく。 UX改善にあたり実際の声を聴くため「ユーザーインタビュー」を企画。インタビ ュー計画から実施、分析までデザイナー主導で動き出した。

Slide 27

Slide 27 text

デザイナーの役割 #RAKUSMeetup 2.ユーザーインタビュー ・関係各所調整 ・インタビュー設計 ・当日のインタビュー ・インタビュー結果分析 デザイナー カスタマーサクセス PMM PDM

Slide 28

Slide 28 text

PdM、PMM同席のもと、インタビュー実施を重ね… #RAKUSMeetup 2.ユーザーインタビュー

Slide 29

Slide 29 text

2.ユーザーインタビュー 結果 実際に声を聞くことで、有益な情報が得られた。(詳細は割愛) このインタビュー結果を踏まえ、次年度の機能計画を改めて見直すことに。 さらに、PDM、PMM、CS、デザイナー間でプロダクトに対する 目線合わせができ、良い経験となった。

Slide 30

Slide 30 text

#RAKUSMeetup 2.ユーザーインタビュー 第2話 完

Slide 31

Slide 31 text

新規サービス開発 ユーザーインタビュー ターゲット像の策定 第1話 ※いずれもプロダクトデザイン課メンバーによる活動紹介になります 第2話 第3話 「新サービスは突然に」 「声を聴かせて」 「あなたを知りたい」 #RAKUSMeetup Episode 東京ハブストーリー

Slide 32

Slide 32 text

東京ハブストーリー ターゲット像の策定 第3話

Slide 33

Slide 33 text

実施の背景 #RAKUSMeetup 機能が充実してきた中で、過去に立てていたターゲット像と 実際のユーザーとでは、差が生まれる懸念があった。 契約者情報も多く蓄積されてきているため あらためてチャットディーラーのターゲット像を 明確化することになった。 3.ターゲット像の策定

Slide 34

Slide 34 text

調査開始 #RAKUSMeetup ・既存顧客の契約経緯の調査 3.ターゲット像の策定 ・カスタマーサポートによる お客様へのサポート記録(動画など)の 調査

Slide 35

Slide 35 text

関係者とミーティング #RAKUSMeetup 調査・分析結果をもとに デザイナー・企画・カスタマーサクセスで ミーティングを複数回実施し、 ターゲット像のすり合わせ 3.ターゲット像の策定 デザイナー 企画 CS

Slide 36

Slide 36 text

そして、ターゲット像の完成へ #RAKUSMeetup 3.ターゲット像の策定

Slide 37

Slide 37 text

結果 ターゲットを明確化させることでビジネスサイドとの視点がそろい、 打ち合わせがしやすくなった。 資料にまとめたことで開発関係者にも 共有と浸透がしやすくなった。 3.ターゲット像の策定

Slide 38

Slide 38 text

#RAKUSMeetup 3.ターゲット像の策定 第3話 完

Slide 39

Slide 39 text

まとめ #RAKUSMeetup この1年で、新たな仲間も デザイナーが担当する領域も どんどん広がっている。

Slide 40

Slide 40 text

#RAKUSMeetup 新しい仲間募集してまーす おわり うぇーい