2012年7月2日月曜日

課題が完成した人は(3) 配布されているテンプレートを試してみよう!


課題が完成した人は(3) 配布されているテンプレートを試してみよう!

CSSによるWEBデザインのサポートとなるツールを公開しているサイトがたくさんあります。上手く活用してデザインに活かしましょう。

ただし、丸ごと配布物を取って来ただけのデザインでなく自作のデザインパーツを組み込む事。
配布されているテンプレートは臨機応変に適応できるよう多すぎるほどの部品でできている。
使わないパーツを削除し、それが組み込まれていなくても美しく成立するレイアウトにする事。


CSSデザインテンプレート
http://www.shoshinsha.com/hp/template/

pondt
http://pondt.com/

decoboko
http://www.decoboko.jp/

design-template
http://www.design-template.jp/

nuit noie
http://n-noire.com/materials/index.html

フリー素材屋 Hoshino
http://www.s-hoshino.com/

CSS design template
http://www.css-designsample.com/


 0から自分で全てつくる利点

どの ボックスやタグの名前がどのcss内容にあてはまるのかを、
最初から全て把握してデザインをつくって行く事ができる。
(難点 ※ ただし、0からつくる為にたくさんのコードを作成する必要がある)

 配布されているテンプレートから自己流に改造してつくる利点

 全体のイメージを最初に把握してから
 さらに自作のデザインパーツでイメージをつくり込んでゆける。

 (難点1 ※ただし、すでに一定レベルにつくり込まれているため、最初に全てのCSSとボックスやタグの構造や関連性を把握してからはじめないと、全てが自作ではない為に想定外のレイアウト崩れや機能の消失が起きる事がある。)

(難点2 ※ただし、汎用性の高いものとして作成されてつくられている為に、
既視感="すでにどこかで見たことがある" デザインになりやすく、方向性を持ったデザイン目的が明確にない場合、オリジナリティーが感じられないサイトになりやすい)


何故配布テンプレートでも良いの?
「配布のものをダウンロードして来る」と聞くとお手軽に聞こえるかもしれませんが、
WEBデザインではその限りではありません。
WEBデザインは、ビジュアルだけでなく機能性と常に一体化したものです。
配布テンプレートには、自作のCSSテンプレート作成では遭遇しないコードなども使用されている場合が多く、これに適応する事で、より多様なWEBデザインの習得が可能になってゆきます。
また、WEBの仕事の依頼では、0からの作成を依頼される場合よりも「何らかの機能性を持ったシステム」にビジュアルを与えるための仕事としての依頼が多く、既存の仕組みをその都度把握してオリジナリティーあるものを組み込んでゆく作業が主となります。
既存のものにもすでに作成者のクセやパターンが見られます。これらの凡例を多く経験する事で、よりデザイナーの個性を発揮する自由なWEBデザインが可能になります。


課題が完成した人は(1) メニューボタンを作成しよう!

課題が完成した人は(2) CSSの小技を試してみよう!

課題が完成した人は(3) 配布されているテンプレートを試してみよう!