Start Course

Photoshop practical course for web design

Course Fee : ¥4,400 or Pay-As-You-Go

Learn practical graphics using Photoshop for website creation. The content is 100 lessons in total, including the creation of a wireframe and a total of three practical sites.

Course Language: Japanese

Course Overview

Photoshopを使用した、Webサイトのグラフィックデザインができるようになるコースです。

ワイヤーフレームの作成や、実際のWebサイトを初級・中級・上級の3つ作成するなど、100レッスンの充実したコースです。

1000名以上の卒業生がいる実績ある日本のWebデザインスクールが提供しています。

 

★こんな人におすすめ★

  • Photoshopを使用したWebデザインができるようになりたい人
  • Photoshopは最低限使えるが、できることの幅を広げたい人

 

★特徴★

  • 実際のサイト制作を行うので、とても実践的なスキルが身につく
  • 1000名以上の卒業生がいる実績ある日本のWebデザインスクールが提供
  • 5分程度の動画が100レッスン 充実した内容ですが、無理せず学べる

 

★内容★

実際のグラフィックデザインをする前に行う、ワイヤーフレームのデザインを学び、基礎的なWebデザインのテクニックを学んだ後、初級・中級・上級に分けて実際のWebサイト制作を学びます。

 

(1)ワイヤーフレーム制作

Webサイトをデザインする前に行うべきサイトの設計図、「ワイヤーフレーム」の制作方法を学びます。 ヒアリングの段階からどのようにワイヤーフレームを制作すれば良いかを学ぶ事が出来ます。 実用的で、目的を達成するためのWebサイトのレイアウト方法を知ることができるので、初めてワイヤーフレームを作成する初心者の方はもちろん、もう一度基礎を学びたい上級者の方にもオススメです。

 

(2)初心者のためのウェブデザインテクニック

photoshopを利用して、実際のウェブサイトのパーツをデザインしていきます。 いきなりウェブサイトを全てデザインするのは難しいと感じる方は、まずこの章の動画から始めてみてください。 簡単な練習課題を通して、どのようにWebサイトデザインを行うのか、といったコツを掴み、本番のWebサイト制作に役立てることができます。

 

(3)【初級】クリニックのWebサイト〜トップページ編〜

Photoshopを使って、仮想のクリニックを紹介するWebサイトをデザインします。 複雑なPhotoshopの機能はあまり使わなくても出来る、シンプルなデザインのWebサイトですので、初心者の方でも気軽に取り組んでいただけます。 この章の目的は、「Photoshopを使ったWebサイトデザインの流れを掴む」ことです。

 

(4)【中級】美容院のWebサイト制作〜トップページ編1〜

Photoshopを使って、仮想の美容院を紹介するWebサイトをデザインします。 Webサイト用のファイル新規作成方法から、ガイドを利用したレイアウトを作成まで、 この章をマスターすることで次回からは「簡単なサイトを自分で作れるように」なります。 作成していただく課題制作は、少し複雑な機能やツールを利用することもありますので、やや中級者向けです。完成版のファイルを一度ご覧頂き、不安な方はまず「初心者向け」の章を受けて頂くことをオススメします。

 

(5)【中級者向け】美容院のWebサイト制作〜トップページ編2〜

Photoshopを使って、仮想の美容院を紹介するWebサイトをデザインします。 レイヤースタイル等を利用したデザインになるため、やや中級者向けです。 4.【中級者向け】美容院のWebサイト制作〜トップページ編〜の続きの章になりますので、 この章を初めてご覧になる方は、まずこの前の章から取り組んで下さい。

 

(6)【中級者向け】美容院のWebサイト制作〜下層ページ編1〜

Photoshopを利用して、仮想を美容院を紹介するWebサイトをデザインします。 トップページのデザインファイルを複製し、下層ページを作成していきます。 5.【中級者向け】美容院のWebサイト制作〜トップページ編2〜の続きの章になりますので、 この章を初めてご覧になる方は、まずこの前の章から取り組んで下さい。

 

(7)【中級者向け】美容院のWebサイト制作〜下層ページ編2〜

Photoshopを利用して、下層の美容院を紹介するWebサイトをデザインします。 シェイプツールを利用した、ご予約フォームのデザインを行っていきます。 7.【中級者向け】美容院のWebサイト制作〜下層ページ編1〜の続きの章になりますので、 この章を初めてご覧になる方は、まずこの前の章から取り組んで下さい。

 

(8)【上級者向け】Webメディア〜トップページ編1〜

Photoshopを使って、様々なコンテンツを提供するWebメディアをデザインしていきます。 たくさんのPhotoshopのツールを駆使してデザイン制作を行っていきますので、上級者向けの章です。 完成版のファイルを一度ご覧頂き、制作に不安のある方は、まず「初心者向け」もしくは「中級者向け」の動画をご覧になってから、この章に挑んで下さい。

 

(9)【上級者向け】Webメディア〜トップページ編2〜

Photoshopを使って、様々なコンテンツを提供するWebメディアをデザインしていきます。 さまざまなPhotoshopのツールを駆使して、デザイン制作を行っていきますので、上級者向けの章です。 8.【上級者向け】Webメディア〜トップページ編1〜の続きの章になりますので、初めてこの章をご覧になる方は、まず前の章からご覧下さい。

 

(10)【上級者向け】Webメディア〜トップページ編3〜

Photoshopを使って、様々なコンテンツを提供するWebメディアをデザインしていきます。 さまざまなPhotoshopのツールを駆使して、デザイン制作を行っていきますので、上級者向けの章です。 9.【上級者向け】Webメディア〜トップページ編2〜の続きの章になりますので、初めてこの章をご覧になる方は、まず前の章からご覧下さい。

 

(11)【上級者向け】Webメディア〜記事ページ編1〜

photoshopを使って、様々なコンテンツを提供する、Webメディアサイトを実際にデザインしていきます。 ここでは、記事本文ページを作成します。 10.【上級者向け】Webメディア〜トップページ編3〜の続きの章になりますので、初めてこの章をご覧になる方は、まず前の章からご覧下さい。

Requirements

  • PC
  • Adobe Photoshop

Course Curriculum

Lesson 1

Duration: 05:31

ワイヤーフレームとは何かを理解しよう

Lesson 2

Duration: 05:49

Web制作のためのワイヤーフレーム作成手順と使用ツー...

Lesson 3

Duration: 04:38

失敗しないWebサイト制作のヒアリングのコツ

Lesson 4

Duration: 05:06

Webサイト制作のためののヒアリング方法

Lesson 5

Duration: 05:59

Webサイトを構成するレイアウトパーツの役割と名称

Lesson 6

Duration: 03:38

初心者のためのワイヤーフレーム作成方法

Lesson 7

Duration: 05:47

失敗しないワイヤーフレーム作成方法

Lesson 1

Duration: 05:00

初心者のためのWebデザインの方法・勉強法

Lesson 2

Duration: 18:19

パンくずリストの作り方

Lesson 3

Duration: 25:00

押したくなるダウンロードボタンの作り方

Lesson 4

Duration: 14:33

バナーの作り方

Lesson 5

Duration: 11:07

Webサイトのメインビジュアルの作り方

Lesson 6

Duration: 09:58

ナビゲーションの作り方

Lesson 7

Duration: 18:48

ガイドを使ったWebデザインのベースを作成する方法

Lesson 8

Duration: 03:20

Webデザインで役立つ参考サイトの探し方

Lesson 9

Duration: 07:37

Web制作でよく使用するツール

Lesson 1

Duration: 05:44

第一回:デザイン前の環境設定と新規作成をしよう

Lesson 2

Duration: 16:17

第二回:シェイプを使ってWebサイトのベースを作成し...

Lesson 3

Duration: 09:29

第三回:無料のアイコンを使ってロゴを配置してみよう

Lesson 4

Duration: 10:06

第四回:整列系のツールを使って、綺麗なナビゲーショ...

Lesson 5

Duration: 07:43

第五回:色調補正パネルを利用した、メイン画像を作っ...

Lesson 6

Duration: 15:49

第六回:無料のアイコンを利用したバナーを作ってみよ...

Lesson 7

Duration: 13:49

第七回:テキストツールを使って、記事一覧を作ってみ...

Lesson 8

Duration: 06:59

第八回:レイヤー複製機能を使って、即座にフッターを...

Lesson 9

Duration: 05:13

第九回:シェイプツールを使って、ページ・トップへを...

Lesson 10

Duration: 10:41

最終回:スライスツールを使って、画像を書き出してみ...

Lesson 1

Duration: 02:08

第1回:Webサイト用のPhotoshopファイルを新規作成す...

Lesson 2

Duration: 08:24

第2回:ガイドを使って、Webサイトのレイアウトを作...

Lesson 3

Duration: 06:26

第2回:(続き)ガイドを使って、Webサイトのレイアウ...

Lesson 4

Duration: 06:17

第3回:Webサイトに背景画像を設定する方法

Lesson 5

Duration: 04:59

第4回:無料のアイコンを利用したロゴを作成する方法...

Lesson 6

Duration: 04:52

第4回:(続き)無料のアイコンを利用したロゴを作成す...

Lesson 7

Duration: 04:52

第5回:お問い合わせバナーを作成する方法-1

Lesson 8

Duration: 03:57

第5回:(続き)お問い合わせバナーを作成する方法-2

Lesson 9

Duration: 04:14

第6回:テキストツールでナビゲーションを作成する方...

Lesson 1

Duration: 05:38

第6回:(続き)テキストツールでナビゲーションを作成...

Lesson 2

Duration: 06:38

第7回:レイヤースタイルを使用した、メイン画像を作...

Lesson 3

Duration: 08:45

第8回:テキストボックスを利用した、新着情報一覧を...

Lesson 4

Duration: 10:03

第8回:(続き)テキストボックスを利用した、新着情報...

Lesson 5

Duration: 04:29

第9回:写真を使ったバナーを作成する方法-1

Lesson 6

Duration: 05:54

第9回:(続き)写真を使ったバナーを作成する方法-2

Lesson 7

Duration: 04:19

第9回:(続き)写真を使ったバナーを作成する方法-3

Lesson 8

Duration: 02:39

最終回:コピーライト付きフッターを作成する方法

Lesson 1

Duration: 04:17

第1回:記事ページ用のファイルの複製と修正

Lesson 2

Duration: 07:56

第2回:変形ツールを使って、メインビジュアルを見出...

Lesson 3

Duration: 05:12

第3回:既存のレイヤーを再利用した、メニュー一覧の...

Lesson 4

Duration: 05:57

第3回:(続き)既存のレイヤーを再利用した、メニュー...

Lesson 5

Duration: 06:09

第3回:(続き)既存のレイヤーを再利用した、メニュー...

Lesson 6

Duration: 04:58

第3回:(続き)既存のレイヤーを再利用した、メニュー...

Lesson 7

Duration: 03:02

第4回:フッターを調整する方法

Lesson 8

Duration: 04:03

第5回:ご予約ページ用のファイルの複製と修正

Lesson 9

Duration: 03:21

第6回:ナビゲーションの修正と小見出しの修正

Lesson 1

Duration: 07:13

第7回:ご予約フォームの注意文を作成する方法-1

Lesson 2

Duration: 06:39

第7回:(続き)ご予約フォームの注意文を作成する方法...

Lesson 3

Duration: 05:06

最終回:ご予約フォームを作成する方法-1

Lesson 4

Duration: 04:59

最終回:(続き)ご予約フォームを作成する方法-2

Lesson 5

Duration: 04:05

最終回:(続き)ご予約フォームを作成する方法-3

Lesson 6

Duration: 06:39

最終回:(続き)ご予約フォームを作成する方法-4

Lesson 7

Duration: 12:10

最終回:(続き)ご予約フォームを作成する方法-5

Lesson 8

Duration: 06:19

最終回:(続き)ご予約フォームを作成する方法-6

Lesson 1

Duration: 04:22

第1回:Webサイト用新規ファイルの作成方法

Lesson 2

Duration: 04:43

第2回:ガイドを使ってサイト全体のレイアウト組みを...

Lesson 3

Duration: 03:02

第2回:(続き)ガイドを使ってサイト全体のレイアウト...

Lesson 4

Duration: 05:20

第3回:シェイプツールでヘッダーの背景を作成する方...

Lesson 5

Duration: 04:59

第4回:(続き)無料アイコンでロゴとナビゲーションを...

Lesson 6

Duration: 05:44

第4回:(続き)無料アイコンでロゴとナビゲーションを...

Lesson 7

Duration: 03:18

第5回:特集記事部分を作成する方法-1

Lesson 8

Duration: 04:43

第5回:(続き)特集記事部分を作成する方法-2

Lesson 9

Duration: 03:52

第5回:(続き)特集記事部分を作成する方法-3

Lesson 10

Duration: 04:18

第6回:人気記事ランキングを作成する方法-1

Lesson 1

Duration: 06:24

第6回:(続き)人気記事ランキングを作成する方法-2

Lesson 2

Duration: 04:08

第6回:(続き)人気記事ランキングを作成する方法-3

Lesson 3

Duration: 03:39

第6回:(続き)人気記事ランキングを作成する方法-4

Lesson 4

Duration: 04:43

第6回:(続き)人気記事ランキングを作成する方法-5

Lesson 5

Duration: 03:08

第6回:(続き)人気記事ランキングを作成する方法-6

Lesson 6

Duration: 05:11

第7回:カテゴリー一覧を作成する方法-1

Lesson 7

Duration: 04:20

第7回:(続き)カテゴリー一覧を作成する方法-2

Lesson 8

Duration: 04:43

第7回:(続き)カテゴリー一覧を作成する方法-3

Lesson 9

Duration: 04:08

第8回:新着記事一覧を作成する方法-1

Lesson 10

Duration: 02:44

第8回:(続き)新着記事一覧を作成する方法-2

Lesson 1

Duration: 05:44

第8回:(続き)新着記事一覧を作成する方法-3

Lesson 2

Duration: 05:33

第8回:(続き)新着記事一覧を作成する方法-4

Lesson 3

Duration: 05:04

第8回:(続き)新着記事一覧を作成する方法-5

Lesson 4

Duration: 04:22

第8回:(続き)新着記事一覧を作成する方法-6

Lesson 5

Duration: 07:34

第9回:ページネーションを作成する方法

Lesson 6

Duration: 04:19

最終回:フッターを作成する方法-1

Lesson 7

Duration: 03:48

最終回:(続き)フッターを作成する方法-2

Lesson 8

Duration: 05:14

最終回:(続き)フッターを作成する方法-3

Lesson 9

Duration: 03:00

第1回:記事ページ用新規ファイルの作成方法

Lesson 10

Duration: 04:40

第2回:パンくずリストの作成方法

Lesson 1

Duration: 05:39

第2回:記事ページのサイドバーの作成方法-1

Lesson 2

Duration: 05:44

第2回:(続き)記事ページのサイドバーの作成方法-2

Lesson 3

Duration: 06:20

第3回:記事ページの本文の作成方法-1

Lesson 4

Duration: 04:55

第3回:(続き)記事ページの本文の作成方法-2

Lesson 5

Duration: 07:12

第3回:(続き)記事ページの本文の作成方法-3

Lesson 6

Duration: 04:45

最終回:関連記事一覧の作成方法-1

Lesson 7

Duration: 06:10

最終回:(続き)関連記事一覧の作成方法-2

Lesson 8

Duration: 07:10

最終回:(続き)関連記事一覧の作成方法-3

Lesson 9

Duration: 21:50

チャレンジ:NESTschool公式サイトをデザインしよう(1...

Lesson 10

Duration: 17:00

チャレンジ:NESTschool公式サイトをデザインしよう(2...

About Expert - nestonline

テクノロジーとクリエイティブのプロを目指す人のためのスクールを運営しています。

卒業生は1000名以上です。

 

★提供しているサービス

2ヶ月のWebデザインコース

2ヶ月で未経験からWebデザイナーへ。 未経験からWEBデザイナーとして働けるレベルになることをゴールとした大学生や若手社会人向けのコースです

 

Webデザインキャンプ

【2日間で全てを学ぶ!】Webデザイン集中講座

 

Railsキャンプ

RailsCamp -2日間集中プログラミング入門講座-

 

など

More Courses by nestonline

User Reviews Write a Review

[[ review.learner_username ]]

[[ review.comments ]]

No Review(s)