デジタルハリウッド(専門スクール)

STUDIO沖縄

0800-500-0481
沖縄都市モノレール「県庁前」駅から徒歩3分。沖縄のIT業界をリードする企業と共にプロフェショナル育成に取り組むクリエイタースクール。

【デジタルハリウッドSTUDIO 沖縄のライブ授業!~レスポンシブWEBデザイン講座後編~】

2016.02.23

  • このエントリーをはてなブックマークに追加
  • pocket

こんにちは!

本日、デジタルハリウッドSTUDIO 沖縄で、
ライブ授業「レスポンシブWEBデザイン講座後編」を開講しました(^▽^)♪


STUDIO沖縄のライブ授業「レスポンシブWEBデザイン講座後編」



先日はレスポンシブWEBデザイン講座前編を開講し、
レスポンシブWEBデザインの概要と構成している技術についてのライブ授業を行いました。

そして、本日はいよいよレスポンシブWEBデザイン講座の後編として、
実際の制作フローに沿ってレスポンシブWEBデザインを学んでいきます!

レスポンシブWEBデザインのワークフローは、従来のWEB制作ワークフローと比べて
①画面情報設計、②デザイン、③コーディングの工数が増えてくるんです。
とくに、コーディング時の確認・修正の工数が多くなります。



STUDIO沖縄のライブ授業「レスポンシブWEBデザイン講座後編」



 

またライブ授業では、各工程ごとの大切なポイントも教えていますよ!

………………………………………………………………………………

~情報設計のポイント~

・画面変化のブレイクポイントをいくつ持たすかをこの時点で決めます。
・各デバイスごとに必要な情報の優先順位を整理し、設計します。
・スマートフォン表示になった際のナビゲーション見せ方を工夫します。
・ボタンや、ページトップリンクなどのパーツの大きさ、位置を工夫します。
・PCレイアウトを中心に考えていくのではなく、
モバイルファーストの考え方で情報設計をしていきます。

………………………………………………………………………………

~デザインをする上でのポイント~

・情報設計時に決定したブレークポイント分のデザインを用意します。
・コーディングをせず、デザインだけ行う場合は、
コーダーさんと綿密に打ち合わせをしながらデザイン制作をしていきます。
・グリッドシステムを生かしたデザインをします。
・CSS3で代用できるような見せ方(角丸、グラデーション、WEBフォントなど)
は進んで取り入れます。
・スマートフォンに変化した際、指で押しやすいようにボタンの大きさなど
気をつけてデザインをします。
・ナビゲーションの文字の大きさも、スマートフォンでは
少し大きめにしてあげると親切です。

………………………………………………………………………………

こうしたポイントを学びながら、
実際にレスポンシブWEBデザインサイトを制作(コーディング)していくことで、
より自分のスキル・知識として身につけることができるんです!



STUDIO沖縄のライブ授業「レスポンシブWEBデザイン講座後編」



実践と取り入れたライブ授業は、
現場で必要とされるスキル・知識を身につけられる だけでなく、
もし途中でわからなくなったとしても、 トレーナーがいつでも対応する ので、
安心して授業を受けていただけますよ(^▽^)



授業見学&体験してみよう!

【STUDIO沖縄/スクール説明会(無料)】
未経験からIT業界へ就転職!≪友達ご家族ご一緒OK!≫

カリキュラム、業界・就職などのご相談はもちろん、ひとりひとりのお仕事や経験状況に応じ、通い方、学習方法などもアドバイスします。
希望者は見学や体験受講もOK。まずは、お気軽にご参加ください!

無料説明会のお申し込み