Slide 1

Slide 1 text

© SmartHR, Inc. AIを使ってライティングを楽に! MCP Serverの活⽤ MCP Serverを使ったヘルプページ爆速作成 ⽶⼭ 柚⾹⼦ SmartHR UXライター 2025/12/11

Slide 2

Slide 2 text

⽶⼭ 柚⾹⼦(SmartHR UXライター) ⾃⼰紹介 ● 2024年10⽉に⼊社 ● SmartHRでは主に情シス領域と従業員 ポータル領域を担当 ● ⼊社してからどんな仕事をしていたか はふりかえりnoteにて🙌 ○ SmartHRに⼊社して1年のふりかえり

Slide 3

Slide 3 text

お話しする前に SmartHR Tech Blogで書いた記事がベースです ● MCP Serverのツールを使って、AIにヘルプページを書いても らう取り組みのお話です ● MCP Serverに関して説明を補⾜しながらお話しますが、わか りにくい点‧より聞きたい点があったらslidoやコメントでの 質問をお願いします🙏 3 【SmartHR Tech Blog】MCP Serverで⼤量のヘルプページを爆速で作る

Slide 4

Slide 4 text

本⽇お話すること 1. SmartHRのUXライターの仕事 2. 「MCP Server」を使おうと思ったきっかけ 3. MCP Server 基礎編 4. MCP Server 実践編 4.1. 作ったツールの紹介 4.2. 作り⽅の紹介 5. 得られた結果と学び

Slide 5

Slide 5 text

SmartHRのUXライターの仕事

Slide 6

Slide 6 text

6

Slide 7

Slide 7 text

7

Slide 8

Slide 8 text

8 「⼈事が」使うサービスから、「HRのデータを」使うサービスへ。情シス領 域進出の背景と、⽬指す未来

Slide 9

Slide 9 text

SmartHRにおける「UXライター」 プロダクトのUIテキストだけでなく、サポートコンテ ンツも含めた広義の情報設計を担う。 ● UIテキストの作成‧レビュー‧改善 ● サポートコンテンツの作成‧レビュー‧改善 ● ライティングガイドラインの作成‧管理 ● ユビキタス⾔語の定義‧管理 ● 開発チームへのスキル移譲 9

Slide 10

Slide 10 text

今回取り組んだこと ● 「開発チームへのスキル移譲」に取り組んでいる ○ UXライターは、開発チームがUI⽂⾔やコンテンツを作成できるよう⽀援 (スキルを移譲)する ○ 開発チームの⼈数を絞り、コミュニケーションコストを抑えることで、 開発チームが最速でユーザーに価値を届けられるようにすることが狙い ● 開発チームがスムーズにライティングに取り組める⼿段の⼀ つとして、AIの活⽤にも積極的に取り組んでいる ○ 今回はこのAIの活⽤事例を共有します! 10

Slide 11

Slide 11 text

MCP Serverを使おうと思った きっかけ

Slide 12

Slide 12 text

短期間で ⼤量のヘルプページを 作成する必要が あったから 12

Slide 13

Slide 13 text

SmartHRの「ID管理機能」 SaaSアカウントの管理をかんたんにする機能 ● SmartHRにある最新の従業員情報に基づい て、SaaSアカウントの作成‧削除ができる ● ⾃動で情報が連携されるため、伝達‧⼊⼒ミ スを防げる ● アカウントの保有状況を⼀元管理できるた め、コストとセキュリティリスクを低減でき る 13

Slide 14

Slide 14 text

ID管理機能が連携しているSaaSが多いほど、 ユーザーの価値に繋がる 14

Slide 15

Slide 15 text

リリース時(2025年8⽉)の連携数 15 4件

Slide 16

Slide 16 text

⽬標(2025年11⽉)の連携数 16 50件

Slide 17

Slide 17 text

ID管理の連携先追加に必要なこと ● 連携先の仕様の調査 ● 連携先のSaaSアカウントの取得(検証⽤) ● 開発 ● ヘルプページの作成 ○ 連携先ごとに必要な設定情報や⼿順が異なるた め、連携先ごとにヘルプページを作成している 17

Slide 18

Slide 18 text

18 当時の悩み ● 4か⽉で50件のヘルプページを作成する必要が ある ● UXライターがボトルネックにならないよう に、開発チームができるだけ楽にライティング できるように仕組みも整えたい ● どうしよう…

Slide 19

Slide 19 text

19 MCP Serverを使おう!

Slide 20

Slide 20 text

MCP Server 基礎編

Slide 21

Slide 21 text

MCP Serverとは ● AIと情報をつなぐ仕組み ● 共通規格のため、さまざまなAI開発⽀援ツール で使える ○ GitHub Copilot、Cline、Cursor、Claude Codeなど ● ユーザーが使い慣れてるAI開発⽀援ツールから 呼び出せる 21

Slide 22

Slide 22 text

例:CursorでMCP Serverを使う場合の流れ 1. Cursorに「このMCP Serverの このツールを使ってね」と指 ⽰(プロンプト)を渡す 2. CursorがMCP Serverにツール の中⾝を問い合わせる 3. Cursorがいろいろやって結果 が出⼒される 22 このMCP Serverの このツールを使って ヘルプページを書いて UX Writing MCP Server GitHub MCP Server GitHub GitHubのPRの 情報をリクエス ト GitHubのPRの 情報を返す Cursor GitHubのPRの 情報をください GitHubのPRの 情報を返す ヘルプページの 書き⽅を教えて ヘルプページの 書き⽅を返す ユーザー アウトプット

Slide 23

Slide 23 text

MCP Serverの「ツール」とは ● MCP Serverでは、AI開発⽀援ツールが使える「ツール」単位で機能 を実装する ○ たとえばGitHubのMCP Serverでは「ブランチを作成するtool」「issueを取得す るtool」といった機能単位のtoolが集合している ● 「ツール」とは、特定のワークフローをAIに実⾏させる仕組み ○ AIが踏むべきステップや参照する情報、アウトプット形式などをあらかじめ指⽰ として組み込める ○ AIはワークフローに沿ってステップを踏むため、安定した成果物が得られやすい 23

Slide 24

Slide 24 text

SmartHRの「UX Writing MCP Server」 ● すでにUXライターの桑野さんが作成済 ○ 詳しくはLINE Technical Writing Meetup vol.44の桑野さん のパートをご覧ください ● 下記ツールを持っていた ○ リリースノートを書く ○ リリースノートを検索する ○ SmartHR Design System内のドキュメントを検索する ○ ヘルプページを検索する 24

Slide 25

Slide 25 text

リリースノートを書くツール ● リリースノートを書くための調査‧リリースノートの 作成‧セルフレビューをMCP Serverのツールで実現し ている ● 開発チームからの評判もとてもよい ● SmartHRのヘルプページはリリースノートと同様、 GitHub上にあるmdファイルで管理しているため、AIと の相性もよい 25

Slide 26

Slide 26 text

26 ID管理⽤のMCP Serverのツールを作ったら、 安定したアウトプットが出るのでは?

Slide 27

Slide 27 text

MCP Server 実践編: 作ったツールの紹介

Slide 28

Slide 28 text

1. GeminiやChatGPTを使って調査する ● 連携先SaaSの管理画⾯でAPIトークンなどを取得する⽅法 を、ChatGPTやGeminiに調査してもらい、mdファイルとし て保存しておく ● 連携先SaaSごとにAPIトークン等を取得する⽅法は異なる が、⼀から調査して⼿順に起こすのは⼤変なため、AIに調査 してもらうことで、書き⼿が調べる⼿間を減らす 28

Slide 29

Slide 29 text

2. AIに渡す情報を収集する AIに渡す下記情報を揃える ● 連携の実装をしたGitHubのPull Request ● 連携先SaaSのAPIの仕様書 ● Design Doc(設計ドキュメント) ● ⼿順1で調査した結果 29

Slide 30

Slide 30 text

3. ヘルプページを作成する AI開発⽀援ツール(Cursorなど)に下記プロンプトを⼊⼒する 30

Slide 31

Slide 31 text

4. 出⼒結果を確認し、修正する ● AIのアウトプットが正しいとは限らない ● 必ず⼈間が中⾝を確認し、必要に応じて修正する ● 最後にUXライターがレビューをする 31

Slide 32

Slide 32 text

MCP Server 実践編: 作り⽅の紹介

Slide 33

Slide 33 text

MCP Serverのツールを作ったプロセス 1. ツールの設計を考える 2. ツールを作ってみる 3. ツールを⾃分で使って改善する 4. ツールを開発チームに使ってもらう 33

Slide 34

Slide 34 text

ツールの設計を考える

Slide 35

Slide 35 text

ツールの設計を考える 1. AIにどのような情報を渡すか 2. AIに何を調査させるのか 3. AIにどのようなステップを踏ませるか 35

Slide 36

Slide 36 text

1. AIにどのような情報を渡すか ● 「ライティングを楽にする」がコンセプト なので、できるだけツールを使う⼈の⼿間 は増やしたくない ● AIに⼗分な情報は渡したい 36

Slide 37

Slide 37 text

1. 実際にAIに渡すことにした情報 ● 開発中に出るアウトプット ○ 連携の実装をしたGitHubのPull Request ○ 連携先SaaSのAPIの仕様書 ○ Design Doc(設計ドキュメント) ● 別途AIに調査させた情報 ○ 連携先SaaSの管理画⾯でAPIトークンなどを取得する ⽅法を、ChatGPTやGeminiに調査してもらった結果 37

Slide 38

Slide 38 text

2. AIに何を調査させるか ● AIは実例を読むほど精度が上がる ● すでに存在するID管理のヘルプページや、 Design Systemのライティングガイドライ ンなどをステップの中で調査させることに した 38

Slide 39

Slide 39 text

3. AIにどのようなステップを踏ませるか ● MCP Serverのツールのよいところは、ス テップに分割したワークフローを実⾏でき ること ● どのようなステップを踏むとよさそうか考 えた 39

Slide 40

Slide 40 text

3. 考えたステップ 1. SmartHRとID管理に関する基本情報を把握す る 2. 連携先の情報を把握する 3. 現在あるヘルプページの実例を調査する 4. ヘルプページを作成する 5. AIによるセルフレビューを実施する 40

Slide 41

Slide 41 text

ツールを作ってみる

Slide 42

Slide 42 text

ツール定義をAIに作ってもらう ● AI開発⽀援ツール(今回利⽤したのは Cursor)にツールの元を作ってもらう ● ツール名は「create_idapp_help」 42

Slide 43

Slide 43 text

server.registerTool("create_idapp_help", { description: `SmartHR のIDaaS連携ヘルプページを作成するための toolです。 実行すると指示が与えられるので、指示に従いなさい。 複数のstepから成るため、 step.1からスタートし、それぞれの stepが完了したら、次の stepに移行せよ。 以下のstep実行のルールを厳守せよ。 * かならずstep.1からスタートし、 step.5まで実行すること * step の終了条件を満たしたら、次の stepに進めよ。 * step の終了条件を満たさない場合は、ユーザーの指示を待つこと * step が終了したら、次の stepに移る前に、 **かならず**実行結果をアウトプットすること。 `, inputSchema: createIdappHelpSchema.shape, outputSchema: createIdappHelpOutput.schema, }, async ({ step }) => { try { const result = await createIdappHelp({ step }); return createIdappHelpOutput.success(result); } catch (error) { return createIdappHelpOutput.error(error instanceof Error ? error.message : 'Unknown error occurred'); } }); 43

Slide 44

Slide 44 text

ステップの中⾝を整える ● 各ステップはmdファイル構成されている ● この中⾝を整える 44

Slide 45

Slide 45 text

ステップ1:基本情報の理解 ● ユーザーから渡されている情報 に過不⾜がないかを確認する ● SmartHRとID管理に関する基 本情報を把握する 45

Slide 46

Slide 46 text

ステップ2:連携先の情報の理解 ● 連携先の情報を理解する ● ここまででわかった情報をアウ トプットさせることで、AIが情 報を正しく理解しているかを判 断できるようにしている 46

Slide 47

Slide 47 text

ステップ3:ヘルプページの実例の調査 ● ID管理の過去のヘルプページの 実例を取得して、実際の内容を 把握する ● ヘルプページの検索ツール 「search_help_page」を使⽤ して検索 47

Slide 48

Slide 48 text

ステップ4:ヘルプページの作成 ● ここまでの情報をもとに、ヘル プページを作成する ● ヘルプページの 基 本 のフォー マットや、コンテンツのルール を記載している 48

Slide 49

Slide 49 text

ステップ5:セルフレビュー ● 作成したヘルプをAIがセルフレ ビューする ● ガイドラインを取得するツール 「search_writing_guideline」 を使⽤し、ガイドラインをベー スにレビュー 49

Slide 50

Slide 50 text

ツールを⾃分で使って改善する

Slide 51

Slide 51 text

まずは⾃分⾃⾝で使う 最初の10件の連携先は、UXライターがMCP Serverを使ってヘルプページを作成し、精度 を上げていくことにした 51

Slide 52

Slide 52 text

改善サイクルを回す 1. MCP Serverのツールを実⾏し、AIにヘルプページの初 稿を書かせる 2. 初稿をUXライターが修正する 3. 修正前‧修正後のヘルプページをAIに読み込ませ、「修 正後のアウトプットに近付けるにはMCP Serverのどの 指⽰を修正すべきか?」をAIに提案させる 4. 提案を反映し、ツールを更新する 52

Slide 53

Slide 53 text

AIに提案させることで精度が上がる ● AI⾃⾝にどういう指⽰が不⾜し ているかを考えさせることで、 精度が向上していった ● ヘルプページの作成ステップ や、セルフレビューステップ に、ルールや観点が追加されて いった ● 追加された指⽰に問題がないか は⼈間が念のため⽬を通す 53

Slide 54

Slide 54 text

ツールを開発チームに使っても らう

Slide 55

Slide 55 text

開発チームに使ってもらう ● 使い⽅のドキュメントを作 成し、開発チームに使って もらう ● AIによる開発を積極的に取 り⼊れているチームだった ため、スムーズに導⼊され た💪 55

Slide 56

Slide 56 text

得られた効果と学び

Slide 57

Slide 57 text

開発チームの⼯数削減に貢献できた ● これまでヘルプページの作成にかかっていた作業時間は 1件あたり1〜2時間 ● MCP Serverの導⼊により、作業時間が30分程度に削減 🙌 ● 「AIがヘルプページを作成するのに必要な情報」を洗い 出したことで、⼈間が調査すべきことを明確にしたこと が効いた 57

Slide 58

Slide 58 text

UXライターのレビューコストが下がった ● ID管理のヘルプページはある程度「書くべきこ と」が決まっている ● AIは決められたフォーマットの⽂書を⽣成するの が得意 ○ 指⽰が整っていれば抜け漏れなく書いてくれる ● 「この項⽬の記載が抜けている」といったことが なくなり、レビューコストが下がった 58

Slide 59

Slide 59 text

結果、⽬標の連携数を無事達成🙌 ● 10⽉までに連携先数50件を達成できた🙌 ○ 当初⽬標は11⽉までだったので、前倒して達成🎉 ● 開発チームの努⼒はぜひ下記記事を是⾮ご 覧ください ○ AIとプロセス改善で実現した⾼速開発の裏側 ⸺ 3 か⽉で50件のSaaSと連携 59

Slide 60

Slide 60 text

UXライターとしての学び ● 構成がある程度決まっている、型のあるヘルプページと AIの相性はバッチリ ● AIを効果的に使うためにも、ライターの知⾒はまだ必要 ○ MCP Serverのツール⾃体へのフィードバックには、ライターの⼒ が不可⽋ ● AIのアウトプットをそのまま利⽤することはできない ○ 現時点では必ず⼈間の⽬を通す必要がある👀 60

Slide 61

Slide 61 text

We're hiring! 2つの職種で仲間を絶賛募集中です! 61 UXライター サポートコンテンツ ライター https://open.talentio.com/r/1/c/smarthr/pages/116260 https://open.talentio.com/r/1/c/smarthr/pages/111573