chevron_left

WebデザインのためのPhotoshop実習

PREMIUM

スライド資料

会員登録して、全てのスライドを見よう

1 / 10

授業の概要

この授業は実際に手を動かしながら、つまりPhotoshopを起動して、受講者の皆様にも実際に制作をして頂くタイプの授業となります(実習は2週目、3週目のみ)。

Webデザインに興味はあるけどやったことはないという方はもちろん、実際の作業を見ることで、既にWebデザイナーとして活躍されている方も新しい発見があるかもしれません。

授業は全3回で構成します。

1週目はWebデザインの基礎知識についてお話しします。2週目は、WebデザインのためのPhotoshopの環境設定と基本操作、Webボタンの制作となり、3週目は広告バナーの制作方法についてお話しします。

PhotoshopによるWebデザインの基本操作は、バナー制作やWebページのデザインカンプ制作はもちろん、iPhoneアプリのデザインなどさまざまな分野で役に立つと思います。ぜひこの機会に身につけておきましょう!

チャプター

play_arrow
自己紹介&アジェンダ
00:51
play_arrow
PhotoShopの起動の仕方
01:35
play_arrow
PhotoShopの環境設定
03:01
play_arrow
pixelとは何か?
03:23
play_arrow
キーボードショートカットを変更する
04:00
play_arrow
新しくカンバスを作成する
03:16
play_arrow
長方形を作ってみる
03:31
play_arrow
サイズを指定して図形を描く
02:35
play_arrow
移動ツールの設定を調整する
02:19
play_arrow
バウンディングボックスの操作
04:11
play_arrow
数値を指定して移動する
03:46
play_arrow
指定した位置に五つの正方形を描いてみる
03:38
play_arrow
複製して移動する
04:10
play_arrow
ドラッグで移動する際の注意
02:40
play_arrow
なぜPhotoshopがWebデザイン制作で使われるのか
04:56
play_arrow
Homeボタンを制作してみる
04:12
play_arrow
グラデーションをかける
03:33
play_arrow
カラーコードを指定する
04:33
play_arrow
表面のざらつきを作る
05:00
play_arrow
境界線をかける
02:42
play_arrow
ボタンの内側に影をつける
02:55
play_arrow
境界線の二重がけ
04:26
play_arrow
テキストをつける
04:03
play_arrow
2つのレイヤーの中央を揃える
04:53
play_arrow
制作したHomeボタンを保存する
06:04
play_arrow
Q:保存の時に訊かれる、互換性を優先のチェックのON/OFFはどんな時ですか
00:35
play_arrow
Q:描写モードの簡単な特徴が知りたい!
00:57
play_arrow
Q:PhotoShopに最初から登録されてる、ボタンのデザインを呼び出すような、機能はありませんでしょうか?
01:35
play_arrow
Q:CS6以外で長方形のサイズを数値で指定するには、どうすればいいでしょうか?
01:19
play_arrow
Q:ノイズを乗せる量に関しては、何か考え方があるのでしょうか?それとも感覚で決めてますか?
00:42
play_arrow
Q:今回は色コードを指定して入力しましたが、実際の色選択はどのようにメインの色やグラデーションの中間色を選択されているのでしょうか?
02:02
play_arrow
Q:覚えておくべきショートカットと、その覚え方の一覧などありますか?
02:21
play_arrow
Q:さきほど紹介していただいた本を参考に勉強すれば、Webデザインの基礎はだいたい学ぶ事ができるのでしょうか?
00:56
play_arrow
Q:フラットデザインって今回やったような立体感は無くなりますよね?実際はどんな感じになるのでしょうか
01:11
play_arrow
Q:html5での制作は増えているのでしょうか?
00:50
play_arrow
Q:書籍や授業のサイトで使われている写真の加工(現像)などはあるんですか?(Web制作用途として)
01:28
play_arrow
課題発表