いままで、WordPress、カラーミーショップ、他CMSなどへコーディングする時、実際には複数の工程が存在していますが、一気に考えがちでした。
その方法も大事だと今も思っていますが、見方を変えて、集中できるようにする考え方、つくり方を考えてみました。

CMS系のコーディングで必要な工程は以下の様なものかとおもいます。

・カンプ画像から素材を書き出す
・HTML（html4.01/html5）＋CSS（CSS3）コーディング
・jquery系のフロントエンド的な動き
・CMS側のプログラムに合わせた独自タグへの対応
・CMSにあるDB内のデータを足したり引いたりといった簡単なプログラミング
・CMS側のプラグインファイルを微調整したりといったPHP+HTML+CSSな操作（←WPのみ）

※静的HTMLファイルとするのか、CMS側に入れ込むのか、という課題もありますが
事前の工程や打ち合わせでできるので、除外しています。


一気にすべて実装する場合、デザインの崩れ、コードの調整、動きの確認がすべて同時に確認できて、仕上がったときには納品物になっている、という理想の形です。
同時にテストできるので、効率がよさそうですが、複数の考え方を脳内で走らせるのでパフォーマンスにムラが出やすいです。

長所：
・はじめて触るシステムでは、少しでも形になったほうが「やっている」感が出るのでいいかもしれません。
・すべての知識にすごく自信がある場合にはこの方法が早いかも
・気分はアジャイル♪
・小規模ならこれが一番早いです。

短所：
・どこまで現在進んでいるのかがわかりづらいです。
・プログラミングやプラグイン調整で悩んでいてベースコーディングが進んでいなかった、みたいなことに陥りやすいです。
・全体ができた後にエラーが山積みになっていることがあります。

つい最近まで、この方法を主にやっておりました。
けれど、請け負う案件によっては、短所への処理が大変になってきたので、他の方法も考えてみることにしました。

★この方法が有効な場合もあるので、判断が大切だったりするのですが。。


要は、個人レベルで各フェーズを分業するってことなのです。
偉そうに言うようなことでも無いのです。分業化のいいところを真似してみる、という方法です。

ブレークポイントを分けていくことで、中心となる技術や考え方に集中することができます。各ポイントごとにタスクを切れますし、どこまで進んだか、進行もしやすくなりました。


・カンプ画像から素材を書き出す
・HTML（html4.01/html5）＋CSS（CSS3）コーディング


・CMSに１をのせて、表示ずれが起こった時は微調整をしておきます。


・jquery系のフロントエンド的な動き
・CMS側のプログラムに合わせた独自タグへの対応


・CMSにあるDB内のデータを足したり引いたりといった簡単なプログラミング
・CMS側のプラグインファイルを微調整したりといったPHP+HTML+CSSな操作（←WPのみ）


長所：
・スケジュールがしやすい／無理のないタスクとして切り出しやすい
・各ブレークポイントでテストできるので、どこでエラーがあるのかわかりやすい
・ある程度システムの動きがわかっていると、高速ですすめられます
・どこまで進んだか、クライアントさんにも示しやすいです。
・もし、どこかを誰かに頼むときも、頼みやすいかもしれない

短所：
・ブレークポイントを分けすぎると、逆に時間がかかってしまうかも。


私は、最近この両方のやり方を切り替えて作業をするようになりました。

大切なのは、たぶん、「どこ」に集中するか、ということなんです。
全体を見渡すこと、各ブレークポイントを見ること、その両方が大事。

考え方と感覚の問題なので、まわりからみたら、違いなんてほとんどわからないレベルなんじゃないかなぁと思います。けれど、すこし整理すると脳内がすごくスッキリしたりします。

普段のやり方にとらわれず、
さらにコツコツできるように改善していくのって大事ですねー。
時折はしごとの仕方の見直しをして、より良い仕事ができるようになればいいなと思っています。

ご参考にどうぞ。

関連記事

• 集中と選択のしかたを切り替えて、CMSへすばやくコーディングするヒント
• ネットショップを簡単に設置できるC2Cサービス「stores.jp」と「BASE（ベイス）」
• スマフォ・個別配送決済・カートJSなどカラーミーショップで新規追加されてた新機能！
• CMS: Expression Engine が面白そう