ブログで画面操作の説明をする時に文章は、前?あと?どっち?

プラグインを導入したり、ソフトをインストールする時に、ネットであまり情報がなかった場合は、そのコツをキャプチャーしてブログで記事にすることもあるかと思います。

そういう時に悩むのが、説明は、キャプチャーした画面の前にするか、後にするか、あるいは両方組み合わせるか、悩むことはありませんか?

ここではその方法を説明します。

 

スポンサーリンク
//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js (adsbygoogle = window.adsbygoogle || []).push({});

 

きっかけ

きっかけは、自分でブログの記事を作る時に、画面の前に説明をするか、後ろにするか時々悩むからです。

また、前で説明しても、後ろで補足することもありました。このタイプの説明方法が、ブログ上では一番多いと思います。

つぎに、思い出しましたが、以前プラント関係の仕事で画面や写真を含めた手順書を作成したことがありました。

その方法は人間工学的に、あるいは操作ミスを減らすことも考慮されてつくられたものです。

よって、それらを元に、やり方を決めようと考えた次第です。

(よって私の今までの記事は画面の説明について一貫性がなかったです....)

 

理想的な説明方法

まず、説明要素としては、以下があります。

  1. 具体的なアクション
  2. アクションの目的
  3. 注意事項
  4. 補足事項
  5. 画面

2の目的は、自明な場合は入れなくても良いですが、アクションの意図を理解させる必要がある場合は、入れるとわかりやすくなります。自分が当然と思っても相手は自分と同じ知識をもってないので、うまく入れると操作の意味もわかってきます。

そして、まず、疑問だった説明(1~4)と画面の位置関係をどうするかですが、説明はすべて画面の前にします。画面のあとには、一切入れません。

なぜかですが、そうすることにより、画面を見て操作を考えるときに、必要情報をすべて事前に認識できるからです。

画面のあとにあると、見落とすかもしれないからです。

画面のあとに入れては絶対にいけない、ということはありませんが、この方法に統一したら、文章や補足事項をどこに書くかということを、少なくとも悩まなくなります。

そして各項目毎の書き方を説明します。

  1. 具体的なアクション
    アクションは、簡潔に、実施する動詞(アクシヨン)を最初に持ってきてください。そうするとやることのイメージがわきます。そして、そのアクションの行には番号を振ってください。番号がわかると、あとで振り返る時も探しやすいです。必要な場合は、同じ目的の作業の番号を2ケタで使用してください。(1->1.1等)
  2. アクションの目的
    目的は、必要な場合は、アクションのすぐあとに簡潔に記入しましょう。アクションの前にしないのは、目的が長いと、アクションがわかりにくくなるからです。
  3. 注意事項
    アクションを起こす前に、認識しておくべき、注意事項は、アクションの前に記載してください。そうすると注意してアクションを実施でき、ミスが少なくなるからです。その部分を赤字か、赤字のBOXで記入すると目立って分かりやすくなります。
  4. 補足事項
    アクションに関する補足事項やちょっとした追加情報は、1,2の後に記載してください。これもその部分を赤字か、黄色のBOXで記入すると目立って分かりやすくなります。
  5. 画面
    そして最後にキャプチャーした画面を入れます。
  6. そして、次のアクションで同様に繰り返します。

 

説明例

説明例でずか、私の書いた記事「Windows VISTAから7へのアップグレード最短時間で!これでランサムウェア対策を」の一部分を見え消しにして改善していきます。

変更部分は赤字です。以下からです。

 

ファイアウォールと、更新プログラムの設定です。

ファイアウォールは、スタートボタンと、コントロールパネルを選んで

1.ファイウォールの設定

1.1 スタートボタンとコントロールバネルを選びます。ファイアオールの設定画面に行くためです。

 

1.2 すると、以下の表示を確認し、が表示されるので、「システムとセキュリティ」を選びます。

1.3 すると、以下の表示を確認し、が表示されるので赤丸部分を選んでください。

1.4すると、以下の表示を確認し、が表示されるので、左側の赤丸部分を選んで、「推奨設定を使用します」を選定します。するとファイアウォールの設定が終わります。

 

「推奨設定を使用します」を選定します。

2. 次にWindowsのUpdateを設定します。

2.2 先の画面を戻って行くと、以下の画面になるので確認してください。

2.3 そこで以下の赤丸部分を選択します。手動でUpdateするためです。

 

ここでのコツは自動Updateにしないこと。大量のUpdateをやみくもに実施すると、フリーズしてしまう可能性が大きいからです。

 

2.4 すると、以下の画面が出るので赤丸の通りに設定します。

 

時間がかかりますので、何か本でも読みながら時間をつぶし実施すると良いと思います。

もしも面倒な場合は、自動設定にして数時間~夜中にほったりかしにし、うまくいかなくなったら再起動してやり直すという手もあります。

 

これでマニュアルで設定していきます。何か本でも読みながら時間をつぶし実施すると良いと思います。

もしも面倒な場合は、自動設定にしてうまくいかなくなったら再起動してやり直すという手もあります。

ここまでが改定案です。

「画面がこうなります」->「以下の画面になることを確認してください。」としましたが、その方が作業が明確ですね。

これで説明の方法に一貫性が出ました。また、アクションの目的を入れることで、書き手が当然のことと考えていることも確実に伝わるようになります。

えっ、あまり変わらないって? そういう気もします。でも、これで操作やアクションがより分かりやすくなるし、また書き方が統一するので、書くとき悩まなくてすみますよ。

 

まとめ

ブログで、操作説明などの画面を用いた手順を説明する方法について、標準化を試みました。

同じ悩みを持つ人に少しでもお役にたてれば幸いです。

 

スポンサーリンク
//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js (adsbygoogle = window.adsbygoogle || []).push({});
スポンサーリンク
//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js (adsbygoogle = window.adsbygoogle || []).push({});
  • B!