ドキュメントを加速する作画ツール blockdiag 2011/07 #infotalk
TRANSCRIPT
ドキュメントを加速する作画ツール
blockdiag
Sphinx-users.jp小宮健
自己紹介:小宮 健
仕事( 株 ) タイムインターメディア所属テクニカルオフィサ ( 技術責任者 ) として活動
参加コミュニティSphinx-users.jpPython mini hack-a-thon
Sphinx を中心にツールを開発blockdiag シリーズSphinx 拡張機能の開発
sphinxcontrib-googlechart などrst2pdf ( コミッタ )
Twitter: @tk0miya
ドキュメントとは ?
ドキュメント【 document 】1. 資料的な文書。記録。2. 記録映画。記録文学。3. コンピューターで、プログラム開発の際に作る仕様
書や使用説明書。(goo 辞書より )
ドキュメントとは ?
IT 業界では設計書、手順書、利用マニュアルなどを指す
設計書業務の全体像、経緯アーキテクチャやシステム間の連携システム構成、インフラ構成が把握できる
手順書メンテナンス手順、作業手順
利用マニュアル
現代のシステムは複雑でマニュアルは必要不可欠なもの
ドキュメントと図
ドキュメントには図がつきものシステム構成図画面遷移図フローチャートUML 系の図 ( クラス図、シーケンス図など )ネットワーク図
図を更新するのはとても手間がかかる書く内容は決まっていてもレイアウトに苦労する消して、移動して、調整して、の繰り返し
図を作るときの定番ツールブロック図やシーケンス図を作るときに利用する
ツールExcel, VisioCacooastah*PlantUML
多くのツールは要素を自分で並べていく必要がある意図したとおりに要素を並べることができる変更の際は並べ替え作業がメインになる
追加 / 削除が大変
ここに 1 画面追加
追加 / 削除が大変
1 . スキマを作る
追加 / 削除が大変
2 . 不要な矢印を消す
追加 / 削除が大変
3 . 図形を配置する
追加 / 削除が大変
4 . 矢印を調整
ずれる
ずれる
ずれる
ずれる
ずれる
blockdiag シリーズ
blockdiag シリーズ
テキストを図に変換するツール群blockdiag :ブロック図、画面遷移図、フローチャー
トseqdiag :シーケンス図actdiag :アクティビティ図nwdiag :ネットワーク図
blockdiag は定義ファイル ( テキスト ) から画像を生成するレイアウトは自動的に行われる多くの図形作成ツール (GUI ベース ) と異なる考え方
細かく並べ替えたい人には向きません
blockdiag の例このテキストが…
{ トップページ -> ログイン -> マイページ ; トップページ -> 商品一覧 -> 商品詳細 ;}
seqdiag の例このテキストが…
{ A => B => C;}
nwdiag の例
このテキストが…
{ network { web01; web02; } network { web01; web02; db01; }}
blockdiag :三つのキーワードスピード
構成を書くだけで図が生成される配置など余計なことに煩わされない
メンテナンス性自動レイアウトのため並び替えが不要
モチベーション気軽に書いて共有できるスピード感があるので楽しい
サンプル図blockdiag
画面遷移図 : http://bit.ly/lZkszJブロック図 : http://bit.ly/kYpK6Yフローチャート : http://bit.ly/m7fLsM組織図 : http://bit.ly/l6OOhZ
seqdiaghttp://bit.ly/lwvEox
nwdiaghttp://bit.ly/kR5tYFhttp://bit.ly/qZvung (cisco のフリー画像を使用 )
blockdiag の周辺ツールblockdiag の重要な周辺ツール「 Interactive
Shell 」Web ブラウザを利用してリアルタイムに図を作れるSVG を利用しているため IE 非対応高速に情報を共有するのに向いている
Interactive Shell を利用して、 blockdiag をデモします
ドキュメンテーションツールとの連携
SphinxWiki
RedmineTracmoinmoinMediawiki
from Web API
既存のドキュメントに対して簡単に図を埋め込める
今後の展開新たな図、ドキュメントへの対応
システム構成図ネットワーク図 ( ラック、ハブ等の物理層 )画面定義書
他のツールと連携しての自動生成ネットワーク通信のシーケンス図ネットワーク図プログラム構成図
まとめ
blockdiag シリーズを使って図を楽に書こう並び替えや位置調整に手間をかけない図を作るのにスピードを与える
Sphinx や Trac, Wiki と組み合わせると便利
楽するためにはもっと知恵と経験が必要意見やアイディアを集めてもっと楽したい
URL: http://blockdiag.com/Twitter: #blockdiagGoogle グループ : blockdiag-discuss