2004年12月08日号

 こんにちは。
 ダイゴ@えとコミです

 「コミー&ダイゴ&えとのリニューアルプロジェクト」
 今回は連載8回目。

 リニューアルを終えた「えとコミホームページ」
 http://www.etocomi.com/
 
 実作業 わずか 1月間という短い期間で、
 どうやって、膨大なコンテンツのサイトを作成できたのか?

 ページリニューアルの過程に起こった出来事を
 えとさん、コミー、私ダイゴの3人の視点から振り返り、
 お伝えしていきます。

 笑いあり、涙ありの物語のなかに、
 皆様のお役に立つ情報もホンノ少し織り交ぜて。

 前回プロジェクトRは、8月13日。
 新サイトの目玉、Flash動画の撮影会。
 江藤さんは、風邪をひいた喉に痛さにも、鼻声にも負けず、
 商品説明ビデオのコメント撮りをこなしてくれました。

 今回は8月17日。
 リニューアルプロジェクトのキックオフから2週間。
 徐々にサイトコンテンツ集めも進んできた頃。
 
 コンテンツそれぞれのボリュームもだいぶ見えてきたので、
 いよいよ実際に、トップページのレイアウトデザインを
 画像として作成していきます。

 ついに、ようやく、なんとか、やっと、デザイン作業
 にたどり着きました。

 長かったなぁ〜。
 いやいや、ここからがもっと長いんですけど。

 ━━━━ もくじ ━━━━━━━━━━━━━━━━━━━━━━
 
 【1】コミー:1ピクセル

 【2】えとコミ新講座 年内、続々登場です!

 【3】ダイゴ:よっ、仕事のできる男!

 【4】2005年 えとコミ講座のご案内!

 【5】あとがき ありがとうプロジェクト

 ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

 ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 【1】コミー:1ピクセル
 ————————————————————– 

 今回はラフ画からMacromedia Fireworksでレイアウトする作業です。
 ここで特に気をつかったことがあります。

 それは、次のコーディング作業で簡単にテーブルが切れるように
 レイアウトを細かく構成したことです。

 これが結構、神経を使います。
 それは1ピクセル単位で高さや幅をそろえる必要があるからです。

 でも、これをすることで次のコーディング作業はとても楽になります。
 またFireworksのスライス機能を使えば、そのままHTMLと画像を
 簡単に書き出してくれます。

 さらに、Fireworksにはグリット、ガイドに吸着という機能があります。
 これがレイアウトする際にはとても便利です。是非おためしください。

 その後、Macromedia Dreamweaverでコーディング作業に入るわけです。
 ここまでくれば、完成のイメージが掴めるようになってきます。

 と完成まであと少しか、と思っていたのは大きな勘違い。

 その後もまだまだ続くのでした。

 ————————————————————– 
 ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 【2】えとコミ新講座 年内、続々登場です!
 ————————————————————– 
 【 プロが教える売れる写真が撮りたい! 】
  ▼ 商品撮影、画像処理 1日入門講座 12/12(日)▼ 残席あと1名!!
  http://www.etocomi.com/seminar/creators_one.html
  あのSDの伊藤さんからデジカメの講義を受けられるチャンスです!
 ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 【 えとコミ 自宅でサイコー!!】12月13日(月)〜全12回
   3ヶ月であなたの売上が10倍になる法則」−通信講座−
   http://www.etocomi.com/seminar/e3month_up.html

  過去の膨大な資料から厳選した最良のノウハウ・情報のほか、
  月商1000万円達成の「疑似体験」を えとコミ初、通信講座で
  自宅にいながら受講することが出来ます。
 ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 【 えとコミのえとうとタミーに会える!飲める! 】12/14(火)
  ▼ えとコミ セミナー無料説明会  2大プレゼント付き▼
   http://www.etocomi.com/consultant/20041214.html
  〜参加料無料です。主要なえとコミ講座を説明します〜

  えとコミは色々講座があるよねぇ。
  いつかは通ってみたいと思っているんだけど・・・

  そんなお客様の声をよく聞きます。
  そんな悩みは、この無料説明会で解決します。
  込山と江藤の二人で、えとコミ講座を詳しく説明します。
  そして目玉は、説明会後の懇親会!!こちらも魅力ですよね♪
 ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 【 売れてるショップの謎とは? 】12/17(金)
  ▼ 開店休業では意味がない! 売りにつなげる通販サイトの黄金律 ▼
    http://www.etocomi.com/seminar/golden.html
  〜「見たい」「買いたい」評価されるショップに見る納得の事例集〜

 2003年ダイレクト・マーケティング・フェア セミナーで
 こみやまたみこさんが講演した内容のリバイバルです。
 ネットショップの基本的で重要な考え方から
 売れているショップ事例を挙げてその秘訣を解き明かしていきます。
 ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 【 写真の撮り方から売れるショップ作りまで 】12月25(土)26日(日)
  ▼ 2日間連続 冬期講習 クリエーターズ!ダイジェスト版 ▼
       〜 ネットショップ構築講座 初登場!!〜
    http://www.etocomi.com/seminar/creators_two.html

 デジカメの撮影方法から画像処理、そしてホームページの製作まで
 売れるショップの製作を一連で体験していただきます。
 ————————————————————– 
 ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 【3】ダイゴ:よっ、仕事のできる男!
 ————————————————————– 
 8月17日

 ようやく、トップページのレイアウトデザインです。

 あれ、今頃?
 レイアウトは完成した!って随分前に書いてなかったっけ?
 と思われた方もいらっしゃるかもしれませんね。

 そう、あなたの記憶は正しい!です。

 ラフデザインは、既に8月3日にホワイトボードに
 手書きのイラストとして完成していました。
 コンテンツに優先順位を付けて、PCをプロジェクターにつないで
 色々なサイトをベンチマークしながら、
 それをホワイトボードに写し取って。。。
 そうやって、レイアウトを完成させました。

 でも、それはあくまでも手書きの白黒イラスト。

 実際のサイトを作るには、このイラストをPCのモニター上に
 表現しなければなりませんね。当たり前ですが。

 手書きイラストをウェブページに変換させる方法は、

 1)Fireworksという画像ソフトを使い、
 トップページ全体を一枚の画像に表現します。
 ↓
 2)この画像を各パーツ毎に細かく、切り分けます。
 ↓
 3)切り分けたパーツを今度は、Dreamweverという
 ホームページ構築ソフトで組立てていきます。

 すごく簡単に言うと、こんな感じです。

 トップページの画像を作るには、
 レイアウトするコンテンツと、その分量を知ることが必要でした。

 この頃になって、ようやく、各コンテンツの具体的な内容の整理が進み、
 サイト全体のボリュームがつかめてきました。

 そこで、ようやく 1)の段階に取り掛かったのです。

 このデザイン作業は、コミーが担当してくれました。
 まず、大まかにコンテンツを配置して、全体のバランスを決めたら、
 次は、それぞれの細かいパーツを作りこんでいきます。

 さすがコミーです。
 なかなか手が付けられなかったデザイン作業ですが、
 始めると早いもので、あっという間の○時間で
 ラフデザインは完成していました。

 よっ、仕事のできる男!

 出来上がったデザインは、
 ベージュを基調にオレンジやグリーンが程よく
 挿し色として使われていて、やわらかな雰囲気。

 新サイトのデザインコンセプトの
 ”優しさ”をしっかりと表現しています。

 言葉で表現されたコンセプトを、目に見える形に表すのは
 簡単そうに見えて、とっても難しいことなんです。

 今回は、時間の制限もあるし、クオリティも求められている。


 それをさらっとやってしまうコミー。
 ”さらっと”の裏にある、確かな技術や経験や表現力。

 そんなものを垣間見た気がしました。

 ようやく白黒の紙から飛び出し、
 カラーになって命を得た、えとコミサイト。
 この後は、ますます加速を付けて完成に向かっていきます。

 ————————————————————–
 ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 【4】2005年 えとコミ講座のご案内!
 ————————————————————– 
 【 写真の撮り方から売れるショップ作りまで 】1月7(金)〜全5回
  ▼ えとコミ クリエーターズ 〜 ネットショップ構築講座〜 ▼
    http://www.etocomi.com/seminar/creators.html

 5回にわたって、売れるショップの制作から更新作業まで
 初心者から上級者に5回でステップアップすることが可能です。
 ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 【 3ヶ月であなたも売れる店長!!】1月10日(月)〜全24回
 「180日間!売れる店長育成講座」
   http://www.etocomi.com/seminar/tencho-ikusei.html

  「売れる店長」になるための全てを盛り込んだ店長育成講座
  わずか180日という短期間で、あなたを「売れる店長」へ。
 ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 【 夢を実現する!!】1月19日(月)〜全6回
  「”えとコミ的”セルフプロデュース講座」
   http://www.etocomi.com/seminar/positlive01.html

  「このままの自分じゃイヤ!」
  「もっともっと素敵な自分に変わりたい♪」
  「自分の魅力を最大限に引き出したい!でも、私らしさって?」
 ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 【 自立したスタッフを育成したい! 】1月20日(木)
      ▼ コーチング ▼ 初登場!!
  http://www.etocomi.com/seminar/coaching.html
    〜 相手のやる気を引き出す対話法 〜
 ————————————————————– 
 ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 【5】あとがき ありがとうプロジェクト
 ————————————————————– 
 えとコミメルマガでも何度か登場した「ありがとうプロジェクト」
 皆さんは既にご存じですよね!!

 まだの方は是非ご覧ください。 http://www.arigato-p.jp/

 応募は終了していますが、参加店舗より感謝の気持ちを詰め込んだ、
 【 福袋 】が12/11(土)迄、お買い求めいただけます。

 とってもお得内容ですよ。 http://www.arigato-p.jp/

 さて、お待ちかねの最優秀賞1名様 ペアで高知へご招待!
 のありがとうメッセージです。以下引用させて頂きます。
 本当にすばらしいありがとうでした。少し目頭が熱くなってしまって。
 また次回の開催を楽しみにしています。高知の皆様♪

 —–引用開始—–

 なお様

 突然死で子供を亡くしてしまいました。6ヶ月という短い時間でしたが
 私にすごい宝物を置いていってくれました。周囲の人の大切さ。命の尊さ。
 死という現実。純粋な笑顔。仏様のような最後の顔。どれをとっても、
 もう永遠の私の宝物です。この子には、心からありがとうといいたいです。
 こういう気持ちは、どこにも表すことが出来ず自分の中に眠らせていました。
 こうやって、投稿させて頂ける場をくださってありがとうございました。

 —–引用終了—–

 ありがとうプロジェクト http://www.arigato-p.jp/

 ————————————————————–