1限目
学科 ユーザーインターフェイス基礎③
デザインラフについて
2限目
学科 ユーザーインターフェイス基礎③
HTML/CSSをイメージしたレイアウト考案について
3限目
学科 ユーザーインターフェイス基礎③
制作に向けての準備
4限目
学科 ユーザーインターフェイス基礎③
制作に向けての準備
5限目
学科 ユーザーインターフェイス基礎③
制作に向けての準備
本日のテーマ
コーディングの準備をしましょう
WEBサイト制作の流れ
ヒアリング、ワイヤーフレーム制作
↓↓↓
◆デザインラフ制作◆
↓↓↓
コーディング
デザインラフとは?
Webサイトの完成見本のことを指します。
ワイヤーフレームで作った骨組みに画像やテキストを挿入したり、色やフォントサイズを指定したりして具体的にデザインしていきます。
ワイヤーフレーム製作前の手書きスケッチ(ラフ)とは別もので、デザインカンプと呼ばれることもあります。
ワンポイントアドバイス
ワイヤーフレームの次はデザインラフを提出する事がよくある制作の流れです。サイトの完成イメージを画像でお客様に見せる為です。
ここでOKが出たらコーディングに進みます。
コーディングでは「デザインラフ通りに再現する事」が求められます。
HTML/CSSをしっかりと意識して作成しましょう。
逆を言えば、デザインラフはしっかりと完成形をイメージして制作する必要があります。