きっかけ
リリース手順書等の手順書を作成する際に前の人が使っていた、もしくは別のプロジェクトで作成したExcelのテンプレートをアレンジして手順書作成を行っていたのだが、結局列幅の調整やメリハリを付けたフォントの調整、A1に選択位置を合わせるといったExcelのお作法の微調整をイライラしながら行っていた。
表示形式は他に任せたいと思ったら以下の記事を見つけ、やってみた所感を記載する。
▼エクセルで手順書を作るのはきっとやめた方がいい
https://qiita.com/n_slender/items/2b237c17605372a4b845
完成品
必要なソフト、以下ダウンロードしておくこと
- Visual Studio Code （Atomでも多分OK、インストール済みなので使ってみた）
- MarkDown PDF （Visual Code Studioのプラグイン、PDFやHTMLで出力できる）
手順
0.Visual Studio Code の設定追加
ユーザー設定
"markdown-pdf.convertOnSave": true, //自動保存、MDファイルと同じ箇所に保存される
"markdown-pdf.type": "html"
1.mdファイルを用意
MarkDown.md
# 作業手順書
## 更新履歴
|更新日|更新者|更新内容|
|:-----------|:-----------|:-----------|
|2018.02.27|h2|新規作成|
|2018.02.28|h2|切り戻し手順書追記|
## 前提条件
* 作業するPCに○○のソフトウェアがダウンロード済みであること
* 作業用のアカウントのロック解除されていること
* 不具合発生時に**10分**以上調査に時間がかかり復旧困難な場合、以下の緊急連絡先に連絡すること
## 環境情報
|環境名|URL|ログイン|パスワード|
|:-----------|:-----------|:-----------|------------:|
|本番環境|xxxx.com|Administrator|Password|
## 手順＆タイムテーブル
|No|確認チェック|作業内容|確認手順|作業時間|備考|
|:-----------|:-----------|:-----------|:-----------|:-----------|:------------|
|1||上記の環境にログイン|画面が正しく表示されていること|5分||
|2||画面の管理->ソース管理をクリック|ソース管理画面が正しく表示されていること|3分||
|3||以下のソースファイルを上書きする|●●機能が正しく動作すること|7分|<div style="color:red">ネットワークトラブル等で上書きできない場合は、一度ログアウトを行い手順1から実施し直す</div>|
2.プレビューで確認＆保存すると自動的にHTMLファイルが作成・上書きされる
画面の右上の虫眼鏡アイコンを押すとプレビューが表示される。
使ってみての所感
- 便利！レイアウトを気にせず書くことができ、表がきちんと整形され表示される
- A1にセルを合わせるとかお作法について気を使わないくて良い
- HTMLタグを使えるのでCSSとか使えばある程度レイアウト自由自在
反対にExcelのほうが良いと思った所
-
強調したい箇所の色を変えるのが少し面倒。ワンクリックでいけない。styleを書かないとイケない。（反対にコード指定のため、複数箇所で細かい色を使うとき統一しやすくなったかも）
-
画像を手順書に載せるのも同じ。imgタグを書かないといけなそう。
ただ作業手順書の資料はコマンドの入力等がメインなため、画像の切り張りはいらないかもしれないが反対にユーザ向けの資料（画像が多いもの・図を挿入したいもの）の資料作成にこの方法はむかないかも。 -
作業時間の合計を求めるのが、、、計算式を組めないのが不便かも