アプリケーション設計2〜イメージを形にする手順<やるべきことを一覧にする>〜
イントロダクション
前回は、アプリケーションの設計について記載しました。早い話が「夢を形にする作業(ちょっと盛っています)ですよ〜」と言うことでした。
そして「イメージを実現するために何をやるのか?」を明確にする必要があります。そこで「目標ブレーク」(自分が作った言葉ですので一般的ではありません。。。)を行う方法を使えば「夢を形にする」方向に進みやすいのではなかろうか?と考えた次第でございます。
アプリケーションの設計(夢を形にする)については下のリンクを参照ください。
夢を形にする① 目標ブレーク〜じゃんけんゲームの場合〜 – PGボックス
目標ブレーク
目標を決めて、それをブレークダウンする。シンプルな話ですが、なかなかに面倒な作業です。自分の場合はノートがないとリストアップした項目が頭の中に残らないので。。。そんなわけで考え出しました。大雑把に下のような絵で表現できます。
項目名が横に長くなるので、とても見辛く、直感的ではないのでこのままでは使用できません。。。がイメージとしてはこのような感じになります。
基本的に目標(対象項目)に対して、実現するために必要な物・事柄を3つ挙げていきます。なるべく3つ挙げるようにします。
このような形で、目標(夢、イメージ)を形(現実のもの)にするためにやることをリストアップします。これだけで「自分のやるべきこと」=「目標達成」までの道のりが見えると思います。いかがでしょうか?
余談
ちなみに上記のダイアグラムに関しては、Treant.jsを使用して作成しました。
ダイアグラム(ツリー状のグラフ)を作成するのに適した(便利な)JSライブラリのようです。実際に作成した感想を言うと以下のような部分で「とても便利だなぁ」と思いました。
- こんな感じでファイルをダウンロードしなくても使用できる(JSはみんなそうかもしれない。。。)
ヘッダーに下のコードを記載すると使用できる
「<script src="http://fperucic.github.io/treant-js/Treant.js"></script>」 - 簡単にツリーを作成することができる、JS特有の面倒臭さはあるが。。。
とりあえず、使用するプロパティを見つけることができれば簡単に使用できます。Treant.jsのサンプルはこちらです。 - イメージファイル(画像)なども指定してグラフ上に表示できるのでアイディア次第で幅広く使用できる。
こんな感じです。
ちなみに、より詳細なことやTreant.jsでの実装部分に関しては下のページに記載しています。
Treant.js イメージ作成〜ダイヤグラムにイメージを表示する〜 – PGボックス
でわでわ。。。