制作の背景
echo.cssは、北海道札幌市のフロントエンドエンジニア、ウェビングスタジオが個人で制作、公開しています。
ウェビングスタジオでは、CMSの組み込みを前提としたコーポレートサイトの制作を中心に受注しています。
発注元の大半はウェブ制作会社で、以下の流れで制作を行うことが多くなっていますが、常にいくつかの課題がありました。
- 基本要件の確認
- ワイヤーを元にCMSでプロトタイプサイトを作成
- 正式なデザインカンプの受け取り
- プロトタイプサイトに正式なデザインを反映
- 制作会社へ引き渡し
課題1: デザイン反映の際の工数
プロトタイプの段階でコーディングに不備があると、デザイナーの細かい意匠を反映できず、大きな手戻りにつながっていました。
Bootstrap等の既存フレームワークを利用することで改善できないかと考えたこともありました(実際、Bootstrapを採用したCMSテーマは多数あります)。
しかし、どのフレームワークも「スタートアップ等ですぐ使えること」を優先しており、UIなどの外観デザインがしっかりと作られています。そのため、デザインを変更しなければならないときの工数が、一から作成するときよりも多くなってしまう状況でした。
課題2: 納品後の改修
CMSはその特性上、納品後にほぼ必ずコンテンツの改修が行われます。その際、まったく想定外(文字数、色、サイズ等)のコンテンツが追加されることがよくあります。CSS側が変更に対応できず、テーマの修正となったりします。
課題3: CMS独自のマークアップ
CMSによっては、システム側がナビゲーション・ウィジェット等のHTMLを自動的に生成することがあります。しかも、同じ機能でもシステムごとにマークアップが異なります。クラス名などはある程度変更可能ですが、CMS側のHTMLをそのまま使用できた方が制作はスムーズです。
このような背景から、いかにこれらの課題を改善するかを考えて制作したのが、echo.cssです。
"echo"プロジェクトについて
echo.cssは、ウェビングスタジオのCMS関連の個人制作プロジェクトの一環です。
このプロジェクトで制作したものにはすべて、名前に"echo"が付けられています。
命名の由来
この単語が好きだから、というのが第一の理由ですが(笑)
- 多くのCMSは、PHPで動作します。必ず使用されるメソッドが、コードを出力する「echo」です。
- 「echo」は日本語で「響く」という意味があります。日本には「打てば響く」ということわざがあります。打てば響くプロダクトにしたいという意味があります。