CIMapエディターの使用方法

CIMap自身の説明は "CIMapとは" を参照。

編集画面

次の画面がCIMapエディターの編集画面の例です。

CIMapエディターの編集画面の例

各ペインの説明

[タブ]

ひとつのタブがひとつのプロジェクト(ファイル)に対応します。前景色/背景色/フォントなどの設定はプロジェクト単位に保持します。”システムのデフォルトとして保存”を選択すると、そのプロジェクトの設定をシステムのデフォルトの設定として保存し、以降、新規作成されるプロジェクトの初期設定として使用します。

なお、タブの移動ボタンはタブ表示を移動しますが、アクティブなタブは変更しません。

[コンポーネント・ツリー]

コンポーネントの階層構造を表示します。原則としてひとつのノード(コンポーネント)がひとつの図と紐付けられ、選択されたコンポーネントの図を[グラフィック・エディタ]に表示します。通常、各図にはそのコンポーネントの境界線を示すベース・エレメントをひとつ作成するようにします。

[グラフィック・エディタ]

選択したコンポーネントのCIMapに対して以下のような編集を行います(主に右クリックで表示されるコンテキスト・メニューを使用)。なお、図を構成する各要素を ”エレメント” と呼んでいます。エレメントの各点は 10pt間隔のグリッドにアラインされます。

エレメントの新規作成/削除/切り取り/コピー/貼り付け
コンポーネント/ユーザー/外部システム/ノート などの矩形領域をもつエレメントを BOXタイプ、インタラクション/リンクなどの線形のエレメントを LINEタイプと呼んでいます。
LINEタイプのエレメントは通常 両端に From/Toのエレメントを持ちますが、エレメントがない場合には警告色のインディケータを表示します。
エレメントの形状(サイズ)変更/移動
単独で選択しているエレメントのハンドルを操作すると形状を変更します。エレメント内部でドラッグを開始するとエレメントを移動します。移動は複数選択の場合も可能です。
エレメントの変更にあわせてインタラクションの位置が自動で変更されます。場合によっては意図しない結果になるかもしれません。(゚◇゚;)
順序の変更(最前面へ/最背面へ)
単独選択したエレメントを最前面または最背面に移動します。ただし必ず、ノートは最前面、次に LINEエレメント、 ノート以外のBOXエレメント、の順番に表示されます。
周辺エレメントの選択
そのエレメントと周辺のインタラクション、およびそのインタラクションを介して接続しているエレメントを選択状態にします。コンポーネントを下位に展開する際に、コピー&ペーストして使用します。

エレメントのない部分をドラッグするとページ全体をスクロールします。エレメントを矩形選択する場合は [Shift]キーを押しながらドラッグすると選択用の矩形領域を表示します。複数選択は [Shift]キー + クリックでも行えます。

<エレメントについて>

CIMapではコンポーネント/ユーザー/外部システム/インタラクションの4つを基本のエレメントとしていますが、エディタとしては便宜上、次のエレメントを追加しています。 なお、”ベース・コンポーネント”、”ノート”、”イメージ" にはインタラクションなどの LINEエレメントが接続しないようになっています。

ベース・コンポーネント
コンポーネントの境界を示すために使用します。通常、"System Context"以外のコンポーネントのベース・エレメントとして、各図の最背面に配置します。また、他のBOXタイプのエレメントはテキストを中央に表示しますが、ベース・コンポーネントは左上寄せで表示します。
ノート
注釈を書き込むために使用します。
イメージ
イメージ用のエレメントです。新規作成の際、クリップボードにイメージがあればイメージの新規エンティティを作成し、それを割り当てます。ない場合はエンティティ未割当のエレメントとして作成します。エンティティ未割当のイメージ・エレメントは領域を破線で示します。
ひし形
CIMapでは使用しませんが、業務フローなどを書く際に使用されることが多いので追加しました。
三角形
同様にCIMapでは使用しませんが、他の用途で使用できるよう追加しました。頂点の方向(上下左右)は [プロパティ]ペインで変更します。
リンク
とりあえず、矢印のない接続線として用意しています。このエレメントはインタラクションと異なり、塗りつぶしを行いません。(次の直線と曲線も塗りつぶしを行いません)
直線−矢印/リンク
インタラクション/リンクは、最初、水平/垂直線から成る折れ線で用意していました(作者の好みです)が、一応、直線で結ぶエレメントも準備しました。直線の場合、両端のBOXエレメントへの接点は各辺の中心に一番近いグリッドにアラインされます。
曲線−矢印/リンク
直線と同様にベジエ曲線を使用したエレメントも追加しました。曲線のエレメントを選択する時は、ちょっとしたコツがあります。曲線のエレメントは最初の水平/垂直線から成る折れ線を流用しているので、見えている曲線を選択するのではなく、直交する線をイメージして選択して下さい。両端付近が成功率が高いです。(^^;)
曲線の選択ポイント

[プロパティ]

[グラフィック・エディタ]で選択しているエレメントのプロパティを表示・編集します。

[プロパティ]は左右2種類のペインに分かれています。左側は単独の選択エレメント、右側は複数の選択エレメントが対象です。

[プロパティ] ペイン(単独エレメント対象)

2つのテキスト入力域は、左が[グラフィック・エディタ]上の表示テキスト、右がデータとして保持される詳細情報となります。

各エレメントには手動でエンティティを割り当てることができます。エンティティが未割当のものはこのペインでプロパティの編集が可能です。エンティティが割り当てられているものは、ここでは直接編集できず、 [エンティティの編集] ダイアログで編集します。

<エンティティについて>

[プロパティ]ペイン(複数エレメント対象)

エレメントの種類
BOXタイプ、LINEタイプの各範囲内でエレメントの種類を変更できます。ただし、変更に伴い、割り当て済みのエンティティとのリンクが切れる場合があります。
線種の切り替え
線種を実線/破線/太線で切り替えます。
複数マーク
エレメントを重ね書きすることで、そのエレメントが複数であることを表現します。( ”ひし形”と”三角形”を除くBOXタイプのみ)
重複マーク
インタラクションが交錯してわかりにくい場合、同じ図の別の場所に重複したエレメントを配置することでわかりやすくできる場合があります。その際は重複しているエレメントに重複マーク(エレメントの右上の三角形)をつけます。(BOXタイプのみ)
方向指定
エレメントの方向を指定します。(三角形エレメントのみ)
色・フォントの設定
エレメント単位に線の色(L)、塗りつぶしの色(F)、塗りつぶしの不透明度(X)、文字のフォント・色(T)を選択できます。
プロジェクトのデフォルトに戻す場合は (D)を選択します。
サイズ調整
BOXタイプのエレメントに対して、幅 or 高さの均一化ができます。選択されているエレメントの最大 or 最小のものに均一化します。
位置調整
BOXタイプのエレメントに対して、左/右寄せ or 上/下寄せ or 中心合わせ/等間隔配置(水平/垂直方向)ができます。等間隔配置は最も左 or 上の 2つのエレメントの左辺 or 上辺の間隔を基準として、その他のエレメントの辺が順番にその間隔となるよう配置します。

その他のダイアログ

エンティティの割当/編集

[プロパティ]ペインで <エンティティ>ボタンを押すと次のようなダイアログが表示されます。
ここでエレメントに割り当てるエンティティを選択します。また、すでに割当済みの場合は内容の編集ができます。なお、エレメントの種類によって、割り当てられるエンティティの種類は固定されています。(LINEタイプのエレメントは、すべてインタラクションのエンティティで対応します。)

エンティティの割当ダイアログ

右下の<使用されているダイアグラム>では選択されたエンティティがどのコンポーネントのエレメントに割り当てられているかが表示されています。

”イメージ" エンティティでは イメージを縮小表示します。また、イメージ表示部分をクリックして表示されるファイル選択ダイアログで、使用するイメージを読み込めます。

なお、このダイアログは<エンティティの編集>メニューから表示することもできます。その場合はエレメントへの割当はできませんが、すべての内容の変更が可能です。

その他の機能

エンティティ・リスト作成

エンティティのレベル番号付リストを CSV形式で出力します。表計算ソフトなどに取り込んで使用できます。

印刷

[グラフィック・エディタ]上ではページ境界を破線で示しています。印刷はその範囲を印刷します。(ページ範囲外へのエレメントの配置も可能ですが、印刷はされません)

なお、エレメントが存在しないコンポーネントは印刷対象とはなりません。([グラフィック・エディタ]では警告色で"No Data"と表示されます。)

その他の使い方

このエディター、もともとは CIMapを作成するために開発したものですが、単なる図形エディタとしてその他の用途にも使うことができます。

ノードなどの配置図

"CIMapを使ったシステム設計” のサンプルで紹介していますが、 ノードなどの配置図の作成に流用できます。

既存資料の上に書き込みながらディスカッション

既存資料をイメージで取り込み、その上にエレメントを書き込みながらディスカッションできます。その際はエレメントの塗りつぶしの不透明度を低く設定することで、下のイメージを透過して見られます。ヘルプ冒頭の ”編集画面” のイメージはその方法で画面ショットに注釈を加えたものです(sample3.cimap)。ディスカッションなどの場合は ”設定” で塗りつぶしの不透明度の初期値を低く設定しておくとよいです。