構築まですべてに関わっていると、ふとある思いがよぎります。「これ、全行程同時にできるのでは??」なんだか無謀な感じもしますが、できる可能性があるならやってみたくなるのがクリエイターの性ということで、個人的にその1人全行程同時進行を行ったときに分かったことをまとめました。通常の工程は以下のようなものです。完成!これを以下のようにします。消えた工程は頭の中で行う上記の工程は見た目上のものです。実際は、「テンプレ作成」の部分に作業が濃縮しています。それを解体すると以下の様になります。企画(頭の中でワイヤー作成)WPインストール・構築(頭の中でデザイン作成)テンプレート作成(テンプレートにHTMLコーディングで直接デザインを具現化)完成!ワイヤーを作成せずに構築を開始したり、デザインデータを作成せずにコーディングを開始するということは、事前に、頭の中だけで、それらを行うということになります。分業の場合ワイヤーフレームやデザインデータは次の工程の作業者に渡すために作成するわけですが、1人で全行程を行う場合その必要がなくなるということです。それらのデータ作成は、チームの人間やクライアントに見せるために必要なだけでなく、実は自分自身がそれを整理するのにも大変役に立っているのですよね。後に触れますがそこがこの作業方法の大きな障害となります。構築によってデザインを作成していく場合、作業内容が即確認できる必要があります。機能でファイルの保存と同時に本番サーバへファイルをアップするなどの環境が必要になります。クライアントへの確認は、一発目が完成品また、普通の案件ではワイヤーフレームやデザインデータを作成した段階でクライアントに確認をするわけですが、この工程の場合はすべて出来上がった段階で見せることになります。オラ、冷や汗がとまらねえぞ...!!さて、以下より実際に行ってみてわかったことをまとめていきます。メリットデザインやソースに無駄がなくなるよく「コーディングを意識したデザインをせよ」とか「CMSでの動作を意識したコーディングをせよ」といったことが言われます。この作業方法の場合、デザインの時にコーディングを意識するどころか、コーディングによってデザインを確かめていくことになるので、コーディングに即したデザイン以外なりえません。余白一つとっても、コーディングしていて気持ちのいい数値で設定していくので、全体の余白のルール統一などがすんなりと実現できます。よって、無駄なブレの無いデザインが出来上がりやすいです。同じようなことが「CMSでの動作を意識したコーディング」にも言えます。タグを入力していくことになるので、ループで再現しにくいコーディングはどはそもそも行いません。構築が速い一旦完成するまでの速度は速いです。デザイン・コーディングにおけるオペレーションの時間が次の工程と重なっているわけなので当然と言えば当然です。コーダーあるあるとしてデザインがコーディングで再現できなくて悩むということがありますが、それが一切なくなります。悩んだり詰まったりする時間が無くなるのです。再現が難しい場合は自分の判断でデザインを覆すことが容易なのでスムーズです。テンプレートにするのは楽だったりしますので、そのようなポイントは分業するよりもスムーズです。画像データを極力使わなくなるので、現代的な構築になるあらかじめ一枚絵のデザインデータを作らない場合、デザインソフトは極力開きたくありません。グラデーションやドロップシャドウ等の効果も、画像を作成して再現するよりもCSSで記述したほうが圧倒的に楽です。そのため結果的に、極力デザインをCSSで再現する今時の作りになります。アイコンなども、デザインデータがある場合は画像で切り出すかアイコンフォントに置き換えるか悩むところですが、この作業方法の場合は初めからアイコンフォント一択です。使いそうなアイコンをあらかじめ用意しフォントとして読み込んでおいてから作業を開始します。デメリットさて、デメリットです。多くの方の予想に反さずデメリットの方がでかいです。細かいところが雑になるワイヤーとデザインのベースを頭の中で行うわけですが、頭の中では細かいところまではフォローできません。記憶力や想像力の限界があるからです。具体的には、全体の雰囲気とか見出しのデザインとかは難なくできても、ボタンのホバーアクションなどまでは設計が及びません。そのため一旦出来上がったときにホバーアクションが無いなどの、雑な出来になりやすいです。遊びのあるデザインになりにくい構築をしながらのデザインは、数値が統一されスッキリとしたデザインとになるというメリットを述べましたが、裏を返せば挑戦的なデザインは難しいということです。普段あまり作らないタイプのデザインや設計が求められる場合にはやめておいた方が良いでしょう。短期決戦向き人間の記憶力は当てになりません。頭の中だけで行う工程がある以上(メモなどをとったとしても)時間がたつと一度決めたことを忘れていくので、その前に一気に片を付ける必要があります。忘却すると、ワイヤーやデザインのデータが無いために構想の作業をもう一度行うことになります。時間をかかったりボリュームが大きい案件では逆に工数が増えてしまうでしょう。頭が疲れるデザイン、コーディング、テンプレート構築を同時に行うわけなので、脳みそのメモリーをものすごく消費します。タグを思いだすわけです。同じ時間作業しても疲労感が大きいです。暗算が苦手な人は絶対に向いていません。同時にやるので集中しにくい特にデザインに悩みだすと大変です。「確証はないが試しに一旦作ってみる」という作業でいちいちコーディングが発生するので、工数が膨らんでいきます。デザインに悩みそうだったらやめておきましょう。プログラム部分では別の問題が生じます。交互に書くような事態になるわけですが、これは凡ミスを連発することになります。写真データは調整がすごく手間デザイン上に、メインイメージでも記事のサムネイルでも写真を用いる場合、その内容やサイズを後から調整するのがなかなか大変です。設定でサムネイルで使用するサイズを変更し、再生成しなおすなど手間がかなりかかるからです。思い描いているデザインのイメージが数値と直結していない場合はかなり工数がかかってしまうでしょう。まとめこの方法が可能な条件はかなり難しい必要な条件やリスクはまとめると以下のような感じです。他に同時進行すべき仕事がない全技術におけるある程度の熟練度を持っている明確な、完成品のデザインのビジョンが必要です。悩みそうな気がしたらやめておきましょう。デザインと同時にテンプレートが出来上がってしまうので、もしデザインを大幅に変更することになった場合、ロスがすさまじいことになります。出し戻しがない、あったとしてもごく細かい部分、という条件でなければできないでしょう。脳内のメモリーを対象消費するので、作業がこれしかない、という場合にのみ可能でしょう。作業スピードや悩みの少なさは、その技術の経験値が高いからなせる業です。不安な技術があるのなら同時進行はやめておきましょう。苦手な作業のみ分化したり分業したりするのは良い手かもしれません。実際やってみて特に同時進行に無理があるのはやはりデザインです。デザインだけはデータを作るとか、分化する方が無難でしょう。完成品の品質はいまいちになるので、簡易サイトにオススメ上記の条件を満たし、問題なく事が運べば確かにサクッとサイトができる感覚はあります。完成するサイトの品質はやはりあまりよくなりません。同時進行しているので、デザインもコーディングも構築も、どうしても70%くらいの実力しか出せない感覚です。品質はそこまで求めないから、短時間で何かサイトが作りたい、という場合に有効でしょう。そのようなものが求められ、かつ腕に自信があるのあら、試してみてもいいかもしれません。近しい構成やデザインでサイトを量産する場合には良いかももし、同じようなデザインや構成でいくつもサイトを作成する必要がある場合は、2つめ以降を今回の方法で構築するのは有効かもしれません。デザインや構成の見通しがかなり具体的になるために、いくつかのデメリットが解消できるからです。いった場合にも導入を検討できるかもしれません。postsよく読まれている記事です。1MBは何GB?データ容量の単位を整理してみた!決定!2020年の流行色Photoshopで画像の書き出しができない時の対処法!Photoshopで書き出したjpg画像の色が変わる時の原因と対処Webデザインで使用できるフォント徹底解説。いつもインストールしてるプラグインまとめ2016.07.25永久保存版!Webサイト更新マニュアルの作り方。posts1MBは何GB?データ容量の単位を整理してみた!決定!2020年の流行色Photoshopで画像の書き出しができない時の対処法!Photoshopで書き出したjpg画像の色が変わる時の原因と対処Webデザインで使用できるフォント徹底解説。XDイラストお知らせ運用Fireworksクリエーターフォントまとめ初心者サーバ用語PHPスマホアプリjQuery息抜きDreamWeaverWebディレクターJavaScriptプログラミング仕事効率PhotoshopAdobeWordPress作業効率コーディング便利ツールHTML・CSSWEB制作現場デザイン。