操作手順の書き方
基本的な考え方
操作手順に関するヘルプページでは、ユーザーがやりたいこと（ゴール）を達成するために、アプリケーションをどのように操作すれば良いのかを説明します。 ユーザーが順を追って操作を把握し、ゴールを達成できることを重視してください。
構成
操作手順に関するヘルプページは、以下のセクションを組み合わせて構成します。
| # | 要素 | 内容 | 必須 |
|---|---|---|---|
| 1 | タイトル | ユーザーがやりたいこと | ○ |
| 2 | リード文 | ユーザーがやりたいことをアプリケーション上の言葉で言い直す | ○ |
| 3 | 見出し＋本文 | 操作に先立つ説明事項 | × |
| 4 | 見出し | 操作手順の要約 | ○ |
| 5 | 本文 | 操作手順の詳細 | ○ |
| 6 | 囲み | 注意点 | × |
| 7 | 囲み | Tips | × |
| 8 | 見出し＋本文 | 操作全体に関わる補足事項 | × |
セクションごとの書き方
各セクションの内容をどのように伝えるかをまとめています。
1. ユーザーがやりたいこと（タイトル）
この操作手順を踏むと、最終的に何が実現できるのかを記載しましょう。
ユーザーが何をしたいのかを念頭に、端的に「XXをXXする」という形で記載します。
2. ユーザーがやりたいことをアプリケーション上の言葉で言い直す（リード文）
タイトルだけで不十分な場合は、このページで何の手順を説明するのかを記載しましょう。
1〜2文を目安として「XXについて説明します。」という形で記載します。「このページでは〜」という導入は不要です。
1〜2文に収まらない場合は、説明事項や補足事項のセクションを設けることを検討してください。
原則として、スクロールしなくても目次が見える状態を意識します。長文、画像、囲みの多用によって、目次が埋もれないようにしてください。
3. 操作に先立つ説明事項（見出し＋本文）
事前に準備をしたり、特定の情報を把握したりしないと、操作が進まない懸念がある場合は、準備事項や注意点を記載しましょう。
ユーザーが操作の前に把握すべき情報がある場合は、見出しを立ててセクションを分けて説明します。事前準備、画面の見方（例：申請一覧画面の見方）など、目的に応じて書きましょう。
リード文に統合できる場合や、内容が自明な場合は不要です。
4. 操作手順の要約（見出し）
各ステップで何をするのかを端的に記載しましょう。
文頭に番号（例：1.）をつけて、H2のスタイルを適用します。ユーザーが「どの画面で何をするのか」を端的に記載し、見出しだけ読んでも操作が完結するように書きます。
5. 操作手順の詳細（本文）
見出しとして書いた要約を補う形で、各ステップで何をするのかを詳細に記載しましょう。
ユーザーが「どの画面で何をするのか」と「その結果、何が起きるのか」をあわせて説明します。
原則として、ユーザーの操作は能動態（XXします）で記載します。
ユーザーの操作で起きる結果はシステムの挙動であり、ユーザーからすると「システムからXXされた」という関係のため、受動態（XXされます）で記載します。
最後のステップでは、ユーザーが正しく操作を完了したことを確認できる方法を記載します。（例：XX画面でXXが最新の情報に更新されたことを確認します。）
また、このステップ固有の注意事項やTipsがある場合は、本文の最後に記載します。
6. 注意点（囲み）
注意喚起しないと、ユーザーが操作を進められなくなったり、データを損失したりしてしまう場合に記載しましょう。
「囲み」のスタイルを参照してください。
7. Tips（囲み）
この手順に関連する内容で、ユーザーに役立つ情報を記載しましょう。
Tipsとして扱うのは、ユーザーが読み飛ばしても、操作を完了できる内容です。読み飛ばしてはいけない内容は、注意点として記載してください。
また、本来の目的である操作手順の説明を妨げないよう、ユーザーにとって本当に必要な内容だけを厳選して記載してください。
「囲み」のスタイルを参照してください。
8. 操作全体に関わる補足事項（見出し＋本文）
特定のステップではなく、操作全体に関わる補足事項や注意点がある場合に記載しましょう。
必要に応じて見出しを立てて、セクションとしてまとめます。
操作の前に確認が必要な情報は、説明事項への移動を検討してください。
複数の操作について説明する場合
「権限の追加」「権限の編集」「権限の削除」など、複数の操作を1ページにまとめる場合は、個別の操作でユーザーがやりたいことをH2、操作手順の要約をH3として記載します。
情報量が増えてきたら、個別の記事に分割することを検討しましょう。
具体的な書き方のヒント
- まずユーザーの目的を明確にし、そこにたどり着くまでに必要なアクションを箇条書きで書き出しましょう。
- アクションは「どの画面で何をする」という単位で切り分けます。
- 目的を達成するために必須のアクションを操作手順とし、その他のアクションや補足情報と区別してください。
- 事前に把握すべき情報や準備することがあれば、別途メモしましょう。
- 操作手順を説明するページでは、ユーザーが順を追って操作を把握できることが重要です。Tipsなど注意を逸らす情報を安易に追加しないようにしましょう。Tipsや注意事項が複数ある場合は、囲みを外して本文に統合するか、複数の囲みを統合することを検討してください。
ライティングパターン
操作手順のライティングパターンをまとめました。 内容に応じて、表現をアレンジしても構いません。
単一の操作のライティングパターン
| # | 内容 | 例1 | 例2 |
|---|---|---|---|
| 1 | ユーザーがやりたいこと（タイトル） | XXを管理する | XXを作成する |
| 2 | ユーザーがやりたいことをアプリケーション上の言葉で言い直す（リード文） | XXのXXを設定する手順を説明します。 | XXで、XXしたいXXをXXする手順を説明します。 |
| 3 | 操作手順の要約（見出し1） | 1. XX画面で［XX］を押す／2. ［XX］ > ［XX］を選択／3. XX画面でXXを確認／補足事項 | XXについて／1. ［XX］メニューで［XX］を選択／2. XX画面で［XX］を押す |
| 4 | 操作手順の詳細（本文） | XX画面で［XX］を押します。XXのメニューが表示されます。 | ［XX］メニューで［XX］を選択すると、XX画面が表示されます。 |
記載例
複数の操作のライティングパターン
| # | 内容 | 例 |
|---|---|---|
| 1 | ユーザーがやりたいこと（タイトル） | XXを編集する |
| 2 | ユーザーがやりたいことをアプリケーション上の言葉で言い直す（リード文） | XXのXXを更新、追加、削除する手順を説明します。 |
| 3 | 個別の操作でユーザーがやりたいこと（見出し1） | XXとは／XXを更新する／XXを追加する／XXを削除する |
| 4 | 操作手順の要約（見出し2） | 1. XX画面で［XX］を押す／2. ［XX］ > ［XX］を選択 |
| 5 | 操作手順の詳細（本文） | XX画面で［XX］を押すと、XXされます。 |