「自分の仕事は自分でクリエイト」をコンセプトとしたWebデザイナーのための体験型オンラインスクール。自分の力で生きていくWebデザイナーを目指します。

Webデザイン講座(CS6版)

Webデザイン講座(CS6版)

Webデザイン講座

Webデザイン講座のカリキュラムについて

この講座では「フランス料理専門店」というテーマで架空のWebサイトを作ります。架空のクライアントへのヒアリングを基にコンセプトにあったWebサイトを制作していきます。

続きを読む

Webデザイン講座(CS6版)

学習素材のダウンロード

学習素材のダウンロード

学習素材のダウンロードはこちらからどうぞ!

続きを読む

Webデザイン講座(CS6版)

Step01 ベースの作成

  • Illustrator

Illustrator ロゴ作成 Step01 ベースの作成

新規ファイル作成・環境設定・図形ツール・図形の拡大縮小・オブジェクトの整列・パスファインダ(交差)・回転ツール・アピアランス効果と分割・レイヤーの管理

続きを読む

Webデザイン講座(CS6版)

Illustrator・パスの操作・パスファインダ(合体)・オリジナルブラシの作成・登録・図形の拡大縮小・ペンツール・オブジェクトのグループ化・HSBでの色の指定方法・リフレクトツール

  • Illustrator

Illustrator ロゴ作成 Step02 イラストの作成

パスの操作・パスファインダ(合体)・オリジナルブラシの作成・登録・図形の拡大縮小・ペンツール・オブジェクトのグループ化・HSBでの色の指定方法・リフレクトツール

続きを読む

Webデザイン講座(CS6版)

Illustrator・文字間のカーニング・文字づめ・行送りの設定・文字のアウトライン化・グラデーションツール・透明度・クリッピングマスク

  • Illustrator

Illustrator ロゴ作成 Step03 文字の入力とクリッピングマスク

文字間のカーニング・文字づめ・行送りの設定・文字のアウトライン化・グラデーションツール・透明度・クリッピングマスク

続きを読む

Webデザイン講座(CS6版)

Photoshopでデザインカンプの作成をしていきます。

  • Photoshop

Photoshop Step01 背景・コンテンツベースの作成

Photoshopでデザインカンプの作成をしていきます。新規ファイルの作成・環境設定・ガイドの作成・レイヤーの管理・レイヤースタイル

続きを読む

Webデザイン講座(CS6版)

Photoshop Step02 ヘッダーの作成

  • Photoshop

Photoshop Step02 ヘッダーの作成

ヘッダーの作成・オブジェクトのコピー・移動・グラデーションオーバーレイの編集・ロゴの配置・スマートオブジェクト形式・ナビゲーションメニューの作成・文字の入力・文字パネルを使いこなすコツ・文字調整とショートカットキー

続きを読む

Webデザイン講座(CS6版)

Photoshop Step03 イメージ画像の作成

  • Photoshop

Photoshop Step03 イメージ画像の作成

イメージ画像の作成・画像の配置・レイヤーマスク編集のコツ・画像のレベル補正

続きを読む

Webデザイン講座(CS6版)

Photoshop Step04 キャッチコピーエリアの作成

  • Photoshop

Photoshop Step04 キャッチコピーエリアの作成

キャッチコピーエリアの作成・テキストエリアの作成・両端が透明な罫線の作成

続きを読む

Webデザイン講座(CS6版)

Photoshop Step05 コンテンツの作成

  • Photoshop

Photoshop Step05 コンテンツの作成

コンテンツの作成・効率よく複数画像を正確に配置する

続きを読む

「自分の仕事は自分でクリエイトする」

当サイトは、Webクリエイターズオンラインスクール メンバー専用サイトです。