はじめに
こんにちは、阿久津と申します。PARTY TECH STUDIO の PY で主にサービス系の新規開発・運用で PM・UX を担当したり、The Chain Museum という会社で運営している ArtSticker というプロダクトで PM を担当しています。
文言の保守って大変
長期間プロダクトを運用していくなかで、プロダクト内で使われる文言やトーン・オブ・ボイスの統一・保守は、一つの大きな課題です。しっかりとしたライティングのルールが明文化されてないケースも多く、また、文言を開発するメンバーがいつも同じとも限りません。
今回は ArtSticker の文言運用において、生成 AI を活用して文言クオリティの向上に挑戦してみましたので、その軌跡を書きます。
文言一覧を準備する
まず、事前の準備として、プロダクト内で扱う文言をコード内にベタ書きするのではなく、key ベースでの実装であることが望ましいです。多言語化を行う Web サイトや Web サービスであれば一般的なやり方ですが、スプレッドシートや専用の SaaS を利用して、文言一覧と実装するための key が対応したデータベースを作成します。
文言の外部ファイル化をすることで多くのメリットがあります。
-
多言語対応の効率化
外部ファイルを利用することで、文言を一箇所で管理できるようになり、プロダクトを多言語対応する際に各言語の翻訳ファイルを用意するだけで済むため、開発・管理の効率が向上します。 -
変更・更新の容易さ
文言がコードに埋め込まれていると、変更のたびにコードの修正とデプロイが必要ですが、外部ファイル化することで、ファイルの編集だけで済む場合が多く、迅速な対応が可能になります。 -
開発者以外でも編集可能
文言がコードから分離されていると、プロダクトマネージャーや翻訳者、ライターなど、技術的スキルがない人でも簡単に文言を編集でき、コラボレーションがスームズになります。 -
コードの可読性向上
文言を外部化することで、コード中に具体的な文字列が散らばることがなくなり、コードの可読性や保守性が向上します。また、ロジック部分と表示部分を明確に分離できます。 -
再利用性の向上
同じ文言を複数箇所で使い回す場合でも、外部ファイル化しておけば、一箇所を変更するだけですべての箇所に反映されるため、効率的です。 -
バージョン管理の容易化
外部ファイルに文言をまとめることで、文言に関する変更がコードの変更とは分離され、変更履歴を追いやすくなります。
プロセス
本格的な実装が開始されるまでに、key と文言の対応が作れているのが理想です。この作業は、文言全体のラインナップを把握している文言を実際に書いているメンバーが担当するのが望ましいかと思います。
- プロダクト内で使用されている文言をスプレッドシートに出力・一覧化する
- 文言に名前(key)をつける
- 重複を共通化する
1. プロダクト内で使用されている文言をスプレッドシートに出力・一覧化する
実際のデザインデータから、文言を抽出して、スプレッドシート化していきます。
デザインデータが Figma で作られている場合は、いくつかのオプションがあります。
- プラグインを活用する: 以下のようなプラグインで簡単にプロジェクト全体のテキストを出力できます。
- コピペする: Figma では、アートボードやレイヤーを選択した状態で、通常のコピー(Cmd + C)すると、クリップボードにテキストがコピーされます。ちょっとした文言であれば、コピペだけでも対応できます。
あとは、出力されたテキストを、スプレッドシート上で重複排除したり、不要なテキストを削除するなどして、整形します。
2. 文言に名前(key)をつける
以下のように、スプレッドシート上で key と 文言を対応させます。
このプロセスは、実装する際のわかりやすさや保守性も考慮する必要があります。
通常私がかかわるプロジェクトでは、 {画面名}_{UI名}_{パーツ名}
といったような一定の命名規則を用いることが多いです。
3. 重複を共通化する
プロダクトのなかで複数使われる文言は、必要に応じて共通化します。
戻る
,次へ
,アップロード中
などのユーティリティとして汎用性が高いラベルや、ホーム
や 設定
など、グローバルメニューのラベルなどは同じ key として共通化しておくことで、無駄な key を作らなくてよくなるのと、万が一変更が入った際にも1箇所を変えればよいので、保守性も上がります。
変数を含む場合
例えば以下のように、文言のなかに、動的に差し込む文言がある場合があります。こういった場合の文言の管理については、エンジニアと仕様をすりあわせのうえ、最適な形で変数を文言に含めます。
-
%{s}
がフォローしているユーザーの一覧が表示されます。 -
{user_name}
さんがあなたの返信にいいね!しました。
生成AIによる校正
文言の一覧ができたら、いよいよ準備完了です。
まず、生成 AI を利用して、全体的な校正をかけてみるとよいでしょう。文言が一覧化され、俯瞰でチェックを行うと、それまで気付きづらかった細かい点が見えてきます。
ChatGPT で、以下のようなプロンプトを利用するとよいと思います。
Webサイト・Webサービス上で利用される文言の改善を行います。
記載したルールに従い、出力してください。
# ルール
- 意味を変えず、できるだけ簡潔にわかりやすくすること
- 文章の意味を変えないように校正を行うこと
- 文章のトーンを変えないように校正を行うこと
- 専門用語や固有名詞はそのままにすること
- 誤字脱字を直すこと
- 表記の揺れを直すこと
- 漢字は、一般的な開く・閉じるのルールに則ること
- 数値表記を統一すること
- 日本語として正確なものにすること
- 全体の整合性をとること
# 出力方法
・テーブル形式で出力してください。原文,変更後,変更したポイントを各列で記載してください。
# 文言
(実際の文言一覧)
出力結果サンプル
以下のように、出力されました。
原文 | 変更後 | 変更したポイント |
---|---|---|
Following Artists | フォロー中のアーティスト | 英語を日本語に統一し、自然な表現に修正 |
注目のアートイベント | 注目のアートイベント | 変更なし |
イベントに参加される方のお名前を入力してください。 | イベント参加者のお名前を入力してください。 | 文章を簡潔化し、「方」を削除 |
購入済みのチケットはありません。 | 購入済みのチケットはありません。 | 変更なし |
チケット使用済み | チケットは使用済みです。 | 文章を自然に「は使用済みです」に修正 |
チケット管理番号 | チケット管理番号 | 変更なし |
チケットに関して、ご不明な点はヘルプセンターをご確認ください。 | チケットについて不明点がある場合は、ヘルプセンターをご確認ください。 | 文章を簡潔化し、「に関して」を「について」に修正 |
チケットの購入に失敗しました | チケットの購入が失敗しました。 | 「購入に失敗しました」を「購入が失敗しました」に変更 |
決済に失敗しました | 決済が失敗しました。 | 「決済に失敗しました」を「決済が失敗しました」に変更 |
以下のチケットについて、ご希望枚数分の在庫を確保できませんでした。 | ご希望の枚数分のチケット在庫を確保できませんでした。 | 表現を簡潔化し、「以下のチケットについて」を削除 |
再度やり直してください。 | もう一度やり直してください。 | 「再度」を「もう一度」に変更し自然な表現に修正 |
文言一覧への取り込み
変更したポイントを確認しながら、改善している文言は、文言一覧に取り込んでいきます。
文言アシスタント化
ここまでのステップで、誤字脱字・表記揺れ・整合性など、基本的な文言のクオリティアップが期待できます。
短期的なプロジェクトであればここまでのプロセスで十分ですが、サービス運用においては、新機能の追加や改善のなかで、新しい文言が必要になるケースも多く、その際に相談できる専用の文言アシスタントを GPTs で作成してみます。
初期作成
手前のステップで作成した文言一覧を CSV 化し、学習データとしてアップロードします。
# 概要
この GPT は XXX という Web サービスで使用される文言をチェックし、トーンやスタイルがブランドガイドラインに沿っているか確認・修正する役割を担います。
# ルール
以下に記載したルールに従い、出力してください。
- 意味を変えず、できるだけ簡潔にわかりやすくすること
- 文章の意味を変えないように校正を行うこと
- 文章のトーンを変えないように校正を行うこと
- 専門用語や固有名詞はそのままにすること
- 誤字脱字を直すこと
- 表記の揺れを直すこと
- 漢字は、一般的な開く・閉じるのルールに則ること
- 数値表記を統一すること
- 日本語として正確なものにすること
- 全体の整合性をとること
# 学習データ
添付する CSV に含まれる文言から、XXX における文言の特徴を学習してください。
追加ルール
さらに、サービス独自で利用する固有名詞や表記揺れが発生しやすい文言などをあらかじめ追加ルールとしてインプットします(Google Spreadsheet などで外部ファイル化できるとなおよかったのですが、現状 GPTs が外部ファイルの参照に対応していないので、一旦 CSV をアップロードするやり方を採用しています)
例えば、以下のようなデータです。
入力 | 変換 |
---|---|
ステッカー | スティッカー |
申込み | 申し込み |
オーディオガイド | 音声ガイド |
チケットのリンク | チケットリンク |
お気にいり | お気に入り |
お気入り | お気に入り |
製作年 | 制作年 |
さらに添付する CSV に含まれる 入力列 に含まれる文言を見つけた場合、強制的に 変換列 の文言に変更するようにしてください。
一旦これで基本的な設定は完了です。
いざ相談
入力
チケットを申込むためには、新規登録・ログインが必要となっています
出力
チケットのお申し込みには、新規登録またはログインが必要です。
サービスのシンプルなトーンオブボイスに沿って、過去の学習データの言い回しと追加ルールを考慮した出力で、よさそうです。
プロモーション的なテキストも
入力
作品購入を希望するユーザーが、作品購入の順番待ちを登録することができる機能です。
希望する作品サイズや価格帯、作家へのメッセージなどをご登録いただけます。
出力1
作品購入の順番待ちを登録できる機能です。
ご希望の作品サイズや価格帯、作家へのメッセージもご登録いただけます。
出力2
気になる作品の購入順番待ちを登録できる機能です。
作品サイズや価格帯、作家へのメッセージも設定いただけます。
出力3
購入したい作品の順番待ちを登録できる機能です。
ご希望のサイズや価格帯、作家へのメッセージをご記入いただけます。
機能的な文言だけではなく、やや情緒的な文言・誘導するための文言も、わりと良い感じに出力してくれました。こういう文言は、チーム横断での合意形成も必要になってくるので、そのための叩きとしていくつか候補を出してもらうのもよさそうです。
まとめ
一覧データがあれば、ほんの数十分でなかなか頼れそうなアシスタントが完成しました。さらにプロダクト独自の言い回しやルールを追加していったりすることで、さらに精度を上げていけそうな期待が持てました。
今後の発展性
プロダクトのなかには、UI の文言だけではなく、例えば SNS 向けのプッシュするための文言や、LP で使うより情緒的な文言など、多くの領域があります。
カテゴリごとでデータを区分けして学習させることで、サービスのトーン・オブ・ボイスは維持しながらも、用途ごとに最適化された文言の出力ができるようなアシスタントに育てることも簡単にできそうです。