Qiitaのユーザー体験を良くするために新しい部署を立ち上げた話

この記事は[Qiita株式会社 Advent Calendar 2021](https://qiita.com/advent-calendar/2021/qiita)の18日目の記事で、Qiita株式会社 CX向上グループの綿貫（@xrxoxcxox）が担当します！

https://qiita.com/advent-calendar/2021/qiita

## 概要

5日目の記事である[Qiitaの体験最大化を目指した組織体制の紹介](https://qiita.com/getty104/items/02c4d01c55cf9c5375e1)でも触れているように、今のQiitaにはCX向上グループという部署があります。

設立から約4ヶ月、一体どんなことを何のために行っているのかを記載します。

## 伝えたいこと

### CX向上グループ設立の意図と実施していること

Qiitaはこれまではユーザー体験を重視した運営があまりできていませんでした。
開発はもちろん、日頃のコミュニケーションもそうです。

売上や利益の追求はもちろん大切なのですが、あくまでQiitaでの体験があり、その結果として金銭の流れが発生するという順番です。
そのため、良い体験なくして良い成長は有り得ません。

Qiita社の経営判断としての「顧客体験を良くする」意思の表れとしてグループを新設しました。

### 抽象化してプロダクト開発に活かせそうな箇所

1番伝えたいのは上記の話なのですが、単に私たちのグループが考えていることや実施した施策を共有しても汎用的な知見にはなりづらいです。
せっかくなので、他の組織でのプロダクト開発にも活かせるように少し抽象化した内容もお伝えできればと思います。

## 解決したい課題

Qiitaの課題について、細かいものまで書き出せばキリがありませんが大きく分けると以下のように認識しています。

- サイトの使用体験における課題
    - ページの読み込み速度やエディタの挙動など、各種パフォーマンスが悪い
    - インターフェースの見た目や使用感などが古めかしい
    - サイト上に、広告やお知らせといった技術記事とは関連がないコンテンツの比率が高まっている
- ユーザーの皆さまと運営のコミュニケーションにおける課題
    - せっかく意見をいただいてもそれに応えきれていない
    - SNSでのコミュニケーションなど日々のやり取りが少なく、リアルタイムでの意見を拾いきれていない
    - 過去の発信内容などにより、運営に不信感を覚えている方が多い

:::note
中の人にしては相当あけすけな記載をしていますが、格好つけたり取り繕うべきではないと考えてオープンにしました。
この「オープンにする」姿勢も今私たちが重視していることです。
途中経過や内部的な事情も隠さない方が、最終的に良いコミュニケーションが取れるんだと実感できています。
:::

## 課題の原因

比重として大きいのは「売上利益が上位、顧客体験が下位」のような判断軸です。

営利企業である以上利益を求めるのは絶対に必要で、予算の達成や継続的な成長は常に考えられるべきでしょう。
しかし売上利益と顧客体験をちゃんと天秤にかけられる組織になっていないと、例えば**若干使いづらくなるけど売上が上がる施策**が立案された際、棄却されずどんどんプロダクトに反映されてしまいます。

「**こういった施策は実施してはいけない**」と言い切る役割が不在のまま運営を続けていると、ユーザーの体験を良くするための施策は優先度がなかなか上がりません。

## 課題を解決するために

### 組織的な工夫

冒頭記載した通りではありますが、CX向上グループを創設しました。
私たちのミッションは「KPI向上に繋がるかどうかではなく、ユーザーにとって良いものかどうかだけを考える」ことです。

以下に、簡易的なQiita社の組織図を載せます。

![](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214677/3b6e4bcf-2030-0d51-e7f7-a5e86cdf3371.png)

ここで、CX向上グループを他の組織の**中**ではなく、**並列**で存在しているのが重要です。

どれだけフラットな組織であっても、組織全体の目標が売上アップであればそちらに寄っていってしまうはず。
そのため第一階層に配置して他のグループの動きに引っ張られないような作りにしています。

:::note
体験向上に限らず、社内で新しい取り組みをする際はこういったアプローチはよく紹介されており、有効だと思われます。
例えばCEO直下に完全独立したチームを作るとかそういった具合です。
:::

### 社内コミュニケーションの工夫

ユーザーの使い勝手を上げようと思うと、ときには明らかに売上が下がってしまうこともあります。
その際は「100万円の売上を得るのと、ユーザーに『明日もQiitaを使おう』と思ってもらえるのでは、会社としてどちらを優先すべきでしょう」と投げかけています。

常にユーザー体験を良くする判断に倒すわけではありませんが「ちょっとした売上を得るためだけに多くの信頼を失う」のが目に見えるような施策の場合、より良い案を出すための議論の呼び水になります。

## 具体的に取り組んだ施策の一例

### GitHub Discussionsをオープンする

https://github.com/increments/qiita-discussions/discussions

現在こちらでパブリックベータ版を実施しています。
ユーザーの皆さまと運営のコミュニケーションを良くするための取り組みです。
背景などは[Qiita Blog](https://blog.qiita.com/qiita-discussions-public-beta/)で詳細に説明しているので、よろしければご覧ください。

Discussionが立つ度に確認し、できるだけその日のうちに一次回答を完了するようにしています。
そして、以下に記載している改善はDiscussionで挙がった意見をもとに実施しているものも多くあります。
意見を出して頂いた方達へ、この場を借りてお礼を申し上げます。

:::note
何かの意見に対して賛成・反対がよく見えますし、素早く解消できると嬉しいリアクションをいただけますので、良い取り組みが実施できたと感じています。
できるだけ早く、オープンに情報をお伝えすることはいつでもどこでも大切であると学びました。
:::

### ユーザーインタビューを実施する

これまでのQiitaは社内での検証こそすれど、社外の方にしっかりと意見をいただくことはあまりしていませんでした。
少なくとも直近の3年ほどは実施していないはずです。

できるだけユーザー目線で開発しようと心がけていますが、どうしても運営だからこその偏りは生まれてしまいます。
偏りを0にすることは現実的ではありません。

そのため、ユーザーの皆さまに応募をかけてインタビューを実施できるように予算を組みフローを整えました。

:::note
Qiitaの場合はユーザー数も多いので実際のユーザーの皆さまにインタビューを依頼してしっかり応募していただけます。
しかし、例え小さめのプロダクトであっても自分の知り合いや社内の少し遠い部署の方に協力していただくのでもだいぶ効果があります。
実際に作っている人達「以外」の人にインタビューができれば、きっと思わぬ発見があるでしょう。
:::

### SNSで反応する

主にTwitterの話です。

いいねを押す、リツイートをする、リプライを送るなどなど。
昔のQiitaは割とフランクにメッセージを送っていたそうですが、規模が大きくなってきてからは「公式感」を意識してあまり能動的なコミュニケーションは実施しなくなっていったそうです。

しかし、良いコミュニケーションを実現しようと思ったらそうは言っていられません。

記事を投稿したツイートに反応したり、困っているツイートをしている人にヘルプページをご案内したり、毎日コミュニケーションをとるようにしています。

ちなみに、最近ではQiita表彰プログラムのバッジやトロフィーを受け取った報告がたくさん上がっていて、中の人としては非常に嬉しかったです笑

https://qiita.com/qiita-award

### LGTMボタンにマイクロインタラクションをつける

![](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214677/3c614a5a-0eca-f3b8-0039-e4fdaacc0cd9.gif)

昨日リリースしたての機能です！笑

マイクロインタラクションがあるからといってコアな機能が使いやすくなるわけではありませんが、こういった遊びの要素も積み重なって印象の判断に関わってきます。

過剰に実装してはいけませんが、これまでのQiitaにはほぼ全く存在していなかったため、重要なアクションであるLGTMには完了のフィードバックも含めてマイクロインタラクションを追加しました。

:::note
売上・利益を算出するロジックだけで施策の優先度を決めていると、こういった施策は未来永劫実施されない気がします。
気持ちとしてはやりたい、けど優先度が上げられない……といった施策は、我々のようなグループがあると適宜実施していけるのでバランスの良さを感じています。
:::

### 記事のタグを指定するときに、名寄せされたタグを優先して表示する

今までだと、何かの言語やライブラリを指定しようとするとマイナーバージョンのタグが一番上に表示されるようなこともよくありました。
しかしあくまで一番使うのは言語そのものの名前などである可能性が高いため、順番を入れ替えています。

| 変更前 | 変更後 |
| --- | --- |
| ![](https://camo.qiitausercontent.com/0d70ac1a7469ca9b415510adc4c01e4b7b42c4b4/68747470733a2f2f71696974612d696d6167652d73746f72652e73332e61702d6e6f727468656173742d312e616d617a6f6e6177732e636f6d2f302f38382f62383332326162342d653562642d356261632d333831342d6436663765663138373463312e706e67) | ![](https://camo.qiitausercontent.com/e6f192857b201b15154468fca85e0e5b4f13541b/68747470733a2f2f71696974612d696d6167652d73746f72652e73332e61702d6e6f727468656173742d312e616d617a6f6e6177732e636f6d2f302f38382f62663233386136332d343432372d666263322d353164302d3930643233303965336330382e706e67) |

### 目次に絵文字を表示できるようにする

見た目が華やかになるので見出しに目次をつける方は多いのですが、目次では文字列になってしまっていました。
ちょっとしたことですが、目次が見づらくなってしまいますし、絵文字がある方が楽しげな見た目になるので変更をしています。

| 変更前 | 変更後 |
| --- | --- |
| ![](https://camo.qiitausercontent.com/b13d4f9785504ad0506a6572f5a9a6361c90c06b/68747470733a2f2f71696974612d696d6167652d73746f72652e73332e61702d6e6f727468656173742d312e616d617a6f6e6177732e636f6d2f302f38382f65303731633862352d363738632d633565642d353166322d3763333236353232383734622e706e67) | ![](https://camo.qiitausercontent.com/45caeab70b02caa7344913bdabc042a77b3f4444/68747470733a2f2f71696974612d696d6167652d73746f72652e73332e61702d6e6f727468656173742d312e616d617a6f6e6177732e636f6d2f302f38382f34643436656530332d363537622d303764652d666330622d6432363261343761626263342e706e67) |

### ストック機能のインターフェースの改善

1度リリースして以来なかなか触れていなかったのですが、非常に多くの要望をいただいていたので改善をしました。
1度により多くのカテゴリーが見えるようになったり、新規作成時はチェックが入るようになっています。

| 変更前 | 変更後 |
| --- | --- |
| ![](https://camo.qiitausercontent.com/28953bd12127496cf2210f8d0ff535c591f83917/68747470733a2f2f71696974612d696d6167652d73746f72652e73332e61702d6e6f727468656173742d312e616d617a6f6e6177732e636f6d2f302f38382f30363739643864632d636132632d306232622d636532322d3039383865663839666633342e6a706567) | ![](https://camo.qiitausercontent.com/9079a2de2e1c6dddc91db00b98b9f2b3e949181e/68747470733a2f2f71696974612d696d6167652d73746f72652e73332e61702d6e6f727468656173742d312e616d617a6f6e6177732e636f6d2f302f38382f66373932393732342d653064342d383334372d326163372d3632633839616630376364332e6a706567) |

### オンボーディングの改善

Qiitaには1日3-400人の方が新規登録してくださるのですが、そこで提供しているオンボーディングはお世辞にも良いものとは言えませんでした。

言語のタグやたくさんの記事を書いている人をおすすめして、初日から楽しくQiitaを使えるように意識をした施策です。

:::note
「今も動いている」「そこまで売上が大きくない」そんなページや機能だとなかなか改善の手が入らないかもしれません。
しかし現実世界で初めて会う人とのコミュニケーションを考えると、絶対に「お世辞にも良いとは言えない」ようなやり取りはしないはずです。
分析ツールで数字だけを見るとどうしても過小評価してしまいますが、現実世界だったらどうだろう？という視点で見ると取り組みたい施策も変わってくる気がします。
:::

### コメントのリンクを取得しやすくする

私自身割と気付くまで時間がかかったのですが、以前はコメントのリンクは

- コメントの投稿日時をクリックすると
- URLにパラメーターとしてidが付与されて
- 自分でコピーする

というステップを踏んで取得せねばなりませんでした。
さすがに分かりづらすぎるだろう……と感じ、一般的なUIとしてドロップダウン内にリンク取得のための要素を追加しました。

### アクセシビリティの向上

`div`に`onClick`をつけてボタンっぽい挙動を再現しているものとか、フォーカスリングがない要素とか、そういったものを見つけ次第解消しています。

まだまだ解消すべき箇所は大量にあるのですが……少なくとも「新規に非アクセシブルな要素は生まない」気持ちでいます。

:::note
アクセシビリティに関しては、おそらくしっかり計算しようと思えばROIも出せるような気がします。
しかし、実施すればアクセスできる人が増えると分かっている以上、その試算をしている時間も実装に当てた方が良いよねという空気の醸成はかなり大事かもしれません。
:::

### タグを一個も指定していないときのエラーメッセージを親切に変える

そもそも、タグ無しでも投稿できるようにして欲しいという意見も多いのですが……まずはエラーメッセージを改善しました。

以前は「タグは0より大きい値にしてください」というメッセージで非常に分かりづらかったため、もしかしたらこれで投稿を諦めてしまった人もいるかもしれないと思い改善しています。

:::note
どの条件で動く、動かない、だけのテストだとこういうものは気付きづらいかもしれません。
ユーザーの意見を聞くことも大事ですし、普段から自分がプロダクトを触り倒していることも、ちょっとした「嫌だな」に気付くためには大事だと思います。
:::

### 記事の投稿日を載せる

今までは更新日しか載っていなかったため、かなり昔に書いた記事を少しだけ変更した場合でも「2021年12月17日に更新」と表示されていました。

内容自体は古いままなのに……と申し訳なく感じていらっしゃる方も多いと認識できたため、小さな改善ですが追加しました。

### スパムなどを通報してくださった方に完了報告兼お礼のメールを送る

これまでのQiitaはスパムな記事・ユーザーを通報していただいた場合でも画面端にフラッシュメッセージが出るばかりでした。
ささやかめな表示なので気付かない方も多いかもしれません。

記事を読むだけでなく、時間を使ってスパムの通報などをしてくださっているのに完了報告の1つも無いのは……と思い、お礼のメッセージとともにメールを送信するようにしました。

### 未ログインユーザー向けの会員登録を促すモーダルウィンドウを削除する

今までは、未ログイン状態で記事を読んでいると数記事に一回「ユーザー登録して、Qiitaをもっと便利に使ってみませんか」といったウィンドウが出ていました。

会社のPCの都合上アカウント登録をしようにもできない人も多いと思いますし、たくさん記事を読んでくれている人であればあるほどこのウィンドウに遭遇していちいち消さないといけません。
運営の目線で言えばもちろん会員数は増えて欲しいですが、このやり方は単なるエゴだなと思ったので削除しました。

![](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214677/606e724e-fac0-091c-c538-f4a17bef9d2f.png)

:::note warn
未ログイン状態でLGTMボタンを押すなど、会員登録しないとできないアクションを実行したときのウィンドウはまだ存在しています。
:::

### 売上に影響の出づらいバグ修正

そのままになっていても売上には影響しないようなバグはどうしても優先度が下がりがちです。
しかし、毎日多くの人が触るようなページに存在するバグであれば、例えそれが金銭に関わらなくても絶対に直すべきです。

そのため、私たちのチームではこの手の売上に影響の出づらいバグこそしっかりと対応しています。

### エディタの改善（実施中）

実施中のため詳細には伝えられない部分もあるのですが……普段使っていて使いづらいと感じる部分を解決するために現在動いています。
私はデザイナーですが80記事ほど書いているので、それなり以上にはエディタの使い勝手の良し悪しを実感している自負があります笑

:::note
ユーザーの体験をよくしようと思ったら、相当使い込んでいる人と同等くらいには自社プロダクトを使うのは必須だと思います。
ちょっとしか触っていないものについて良し悪しの判断もできませんし、ユーザーと同じ「感情」を抱くのは無理でしょう。
技術記事としてのレベルは高いものを書けていないかもしれませんが、とにかく定期的に書いて公開するのを生活に取り入れています。
:::

### その他

非常に細かいもの、まだ言えないもの、色々あるのですがまだまだたくさんあります。
発足してすぐのため根幹の部分からアップデートはできていませんが、絶対になし得てみせます。

## まとめ

- Qiitaに新しくできたCX向上グループ
    - KPI向上に繋がるかどうかではなく、ユーザーにとって良いものかどうかだけを考えるようなグループ
- サイトでの体験と、サイト外での体験、両方を考えて施策を実施している
- 今優先すべきは売上か体験か、フラットに判断できるように社内コミュニケーションも実施している

Qiita株式会社 Advent Calendar 2021の19日目は @gilly が担当します、お楽しみに :christmas_tree: