2/26(Fri)
第1回:2014年5月29日公開
30min
【WEBデザインのためのPhotoshop】全3回の1回目です。
【HTMLとCSSを使って、150分で簡単なWEBサイト制作】で完成した、webページに設置する画像を作っていきます。
Photoshopは、Adobe社が提供する、画像処理ソフトウェアです。Webデザインが初めてでも、写真やデザインに興味がある方であればその名前は一度は聞いたことがあるのではないでしょうか?
もしPhotoshopを使ったことがある方でもWebサイトをデザインする際には、Webデザインをするための設定をしていく必要があります。この授業では、WebデザインのためのPhotoshopの環境webページに設置する画像制作の技術をadobe Photoshopを使って習得します。
■ 授業でデザイン〜コーディングしていっている仕様書
大きなトップ画像3枚は【jQueryの基礎を理解する】の授業で設置するカルーセル(画像がスライドする仕組み)になり、小さなサムネールは、同じく【jQueryの基礎を理解する】で設置するライトボックス(サムネール画像をクリックしたら大きな画像がポップアップする仕組み)のトリガーになります。
webデザイナー科目入門編は、この全3回シリーズの後、「jQueryの基礎を理解する全6回」を経て、最後にの【HTMLとCSSを使って、150分で簡単なWEBサイト制作全6回】の6回目で修了となります。その後「jQueryの基礎を理解する全6回」の6回目でweb制作ワークフロー全行程完了となります。シリーズを通して授業を受けると小規模なwebサイトを制作するスキルを身に付ける事ができます。
2014年5月29日公開
30min.
【WEBデザインのためのPhotoshop】全3回の1回目です。
【HTMLとCSSを使って、150分で簡単なWEBサイト制作】で完成した、webページに設置する画像を作っていきます。
Photoshopは、Adobe社が提供する、画像処理ソフトウェアです。Webデザインが初めてでも、写真やデザインに興味がある方であればその名前は一度は聞いたことがあるのではないでしょうか?
もしPhotoshopを使ったことがある方でもWebサイトをデザインする際には、Webデザインをするための設定をしていく必要があります。この授業では、WebデザインのためのPhotoshopの環境webページに設置する画像制作の技術をadobe Photoshopを使って習得します。
■ 授業でデザイン〜コーディングしていっている仕様書
大きなトップ画像3枚は6月17日より始まる【jQueryの基礎を理解する】の授業で設置するカルーセル(画像がスライドする仕組み)になり、小さなサムネールは、同じく【jQueryの基礎を理解する】で設置するライトボックス(サムネール画像をクリックしたら大きな画像がポップアップする仕組み)のトリガーになります。
webデザイナー科目入門編は、この全3回シリーズの後、「jQueryの基礎を理解する全6回」を経て、最後にの【HTMLとCSSを使って、150分で簡単なWEBサイト制作全6回】の6回目で修了となります。その後「jQueryの基礎を理解する全6回」の6回目でweb制作ワークフロー全行程完了となります。シリーズを通して授業を受けると小規模なwebサイトを制作するスキルを身に付ける事ができます。
スライド資料
2014年6月3日公開
30min.
【WEBデザインのためのPhotoshop】全3回の2回目です。
1回目のビルボード(TOP画像)制作で提出いただいた課題を添削していきます。ここではwebページに設置するビルボードをより効果的に見せる手法を詳しく説明していきます。このビルボードはこの後来る 【jQueryの基礎を理解する】の授業で学ぶ、カルーセル(画像がスライドする仕組み)になります。
webデザイナー科目入門編は、この全3回シリーズの後、「jQueryの基礎を理解する全6回」を経て、最後にの【HTMLとCSSを使って、150分で簡単なWEBサイト制作全6回】の6回目で修了となります。その後「jQueryの基礎を理解する全6回」の6回目でweb制作ワークフロー全行程完了となります。シリーズを通して授業を受けると小規模なwebサイトを制作するスキルを身に付ける事ができます。
スライド資料
2014年6月5日公開
30min.
【WEBデザインのためのPhotoshop】全3回の最終回です。
【jQueryの基礎を理解する】の授業で学ぶ、LightBoxでポップアップする画像と、トリガーになるサムネールを制作する授業になります。最終回ですので、復習をかねて画像加工のポイントを説明します。
サムネール:画像を一覧表示する際に縮小された画像のことを指します。画像を一覧で並べたいけれど、画像が大きくて表示出来ないなどというときにサムネール表示をします。
また、サイトのロゴやマークはPhotoshopを使うべきなのかIllustratorを使うべきなのか迷うところ。それぞれのツールの使い所をお話していきます。
スライド資料