【Web制作の現場】小畑式マークアップ術:モジュール設計の手順
前回は「モジュール設計」をお伝えいたしました。
覚えてますか?
忘れた方は、前回のメールを見返してみてください!
さて、今回は「モジュール設計の手順」について、お話しようと思います。
ひとつ、大事なことを言い忘れていたことがありました!
前回の「モジュール設計」というのは、すべて紙の上での作業です。
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
はい、そうなんです。
「設計」の段階では、まだPCに向かう必要がないんです。
「設計」の作業とは、
- 頭の中で考えたものを
- デザインをプリントアウトして
- 必要要素を書き込んでいく。
ということです。
この手順を覚えておいてください。
「設計」の段階で、PCに向かうほど効率の悪いことはありません。
「設計」とは「考える」作業です。
~~~~~~~~~~~~~~~~~~~~~~~~~~
PCに向かって「考えること」は大変難しいことです。(僕にとってはw)
なので、いったんPCから離れて、「考えること」に集中する。
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
PCの前だと、ネットサーフィンしてしまったり、する可能性がありますからw
邪念を振り払うためにも、PCの前から離れて作業をしてください。
この「設計」で完成した成果物は、マークアップする際の「設計図」となります。
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
この「設計図」があるか、ないかで、今後の作業効率が大きく変わってくるのです。
いつも言っていますが、「準備」に時間をかけること。
「準備」とは「設計図」を作り込むこと。
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
プラモデルを作るときと一緒で「説明書」がないと、
最後の「完成型のイメージ」が湧かなかったり、
作り込んでいく「手順」がわからなかったり。
ここの色はこの色でーとか、ここのネジはあのネジでーとか。
これらを適当にしていると、とんでもない物が出来上がりますw
これが「設計図」が必要な理由です。
理解していただけたでしょうか。
おさらいします。
「モジュール設計」というのは、すべて紙の上での作業です。
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
そして、
「設計」とは「考える」作業です。
~~~~~~~~~~~~~~~~~~~~~~~~~~
この「設計」で完成した成果物は、マークアップする際の「設計図」となります。
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
この「設計図」をもとに、「実装」を行っていくのです。
はじめは難しいと思いますが、慣れてくれば、
逆にこの作業をしないと、サイトが作れなくなります。
それくらいの効果がある作業です。
ぜひ、「設計図」を作ってみてください。