Udemy
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
Development
Web Development Data Science Mobile Development Programming Languages Game Development Database Design & Development Software Testing Software Engineering Development Tools No-Code Development
Business
Entrepreneurship Communications Management Sales Business Strategy Operations Project Management Business Law Business Analytics & Intelligence Human Resources Industry E-Commerce Media Real Estate Other Business
Finance & Accounting
Accounting & Bookkeeping Compliance Cryptocurrency & Blockchain Economics Finance Finance Cert & Exam Prep Financial Modeling & Analysis Investing & Trading Money Management Tools Taxes Other Finance & Accounting
IT & Software
IT Certification Network & Security Hardware Operating Systems Other IT & Software
Office Productivity
Microsoft Apple Google SAP Oracle Other Office Productivity
Personal Development
Personal Transformation Personal Productivity Leadership Career Development Parenting & Relationships Happiness Esoteric Practices Religion & Spirituality Personal Brand Building Creativity Influence Self Esteem & Confidence Stress Management Memory & Study Skills Motivation Other Personal Development
Design
Web Design Graphic Design & Illustration Design Tools User Experience Design Game Design Design Thinking 3D & Animation Fashion Design Architectural Design Interior Design Other Design
Marketing
Digital Marketing Search Engine Optimization Social Media Marketing Branding Marketing Fundamentals Marketing Analytics & Automation Public Relations Advertising Video & Mobile Marketing Content Marketing Growth Hacking Affiliate Marketing Product Marketing Other Marketing
Lifestyle
Arts & Crafts Beauty & Makeup Esoteric Practices Food & Beverage Gaming Home Improvement Pet Care & Training Travel Other Lifestyle
Photography & Video
Digital Photography Photography Portrait Photography Photography Tools Commercial Photography Video Design Other Photography & Video
Health & Fitness
Fitness General Health Sports Nutrition Yoga Mental Health Dieting Self Defense Safety & First Aid Dance Meditation Other Health & Fitness
Music
Instruments Music Production Music Fundamentals Vocal Music Techniques Music Software Other Music
Teaching & Academics
Engineering Humanities Math Science Online Education Social Science Language Teacher Training Test Prep Other Teaching & Academics
AWS Certification Microsoft Certification AWS Certified Solutions Architect - Associate AWS Certified Cloud Practitioner CompTIA A+ Cisco CCNA Amazon AWS CompTIA Security+ AWS Certified Developer - Associate
Photoshop Graphic Design Adobe Illustrator Drawing Digital Painting InDesign Character Design Canva Figure Drawing
Life Coach Training Neuro-Linguistic Programming Mindfulness Personal Development Meditation Personal Transformation Life Purpose Emotional Intelligence CBT
Web Development JavaScript React CSS Angular PHP WordPress Node.Js Python
Digital Marketing Google Ads (Adwords) Social Media Marketing Google Ads (AdWords) Certification Marketing Strategy Internet Marketing YouTube Marketing Email Marketing Retargeting
SQL Microsoft Power BI Tableau Business Analysis Business Intelligence MySQL Data Analysis Data Modeling Data Science
Business Fundamentals Entrepreneurship Fundamentals Business Strategy Online Business Business Plan Startup Freelancing Blogging Home Business
Unity Game Development Fundamentals Unreal Engine C# 3D Game Development C++ 2D Game Development Unreal Engine Blueprints Blender
30-Day Money-Back Guarantee
Design Web Design Photoshop

WebデザインのためのPhotoshop実践講座

Webサイト制作における、Photoshopを使用したグラフィックを実践的に学びます。ワイヤーフレームの作成、合計3つの実践的なサイトを作成するなど、全100レッスンの充実した内容です。
Rating: 4.1 out of 54.1 (275 ratings)
1,978 students
Created by NEST online
Last updated 10/2015
Japanese
30-Day Money-Back Guarantee

What you'll learn

  • Webサイト制作のグラフィックデザインができるようになる

Requirements

  • Photoshopの基本的な操作を習得(udemyのPhotoshopの基礎コースを受けてからこのコースを受けるのがおすすめです)

Description

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〜の続きの章になりますので、初めてこの章をご覧になる方は、まず前の章からご覧下さい。


Who this course is for:

  • Photoshopを使用して、Webデザインができるようになりたい人

Course content

11 sections • 100 lectures • 11h 7m total length

  • Preview05:31
  • Web制作のためのワイヤーフレーム作成手順と使用ツール
    05:48
  • 失敗しないWebサイト制作のヒアリングのコツ
    04:37
  • Webサイト制作のためののヒアリング方法
    05:06
  • Webサイトを構成するレイアウトパーツの役割と名称
    05:59
  • 初心者のためのワイヤーフレーム作成方法
    03:37
  • 失敗しないワイヤーフレーム作成方法
    05:46

  • 初心者のためのWebデザインの方法・勉強法
    05:00
  • パンくずリストの作り方
    18:19
  • 押したくなるダウンロードボタンの作り方
    25:00
  • バナーの作り方
    14:33
  • Preview11:06
  • ナビゲーションの作り方
    09:58
  • ガイドを使ったWebデザインのベースを作成する方法
    18:47
  • Webデザインで役立つ参考サイトの探し方
    03:20
  • Web制作でよく使用するツール
    07:37

  • 第一回:デザイン前の環境設定と新規作成をしよう
    05:43
  • 第二回:シェイプを使ってWebサイトのベースを作成してみよう
    16:16
  • 第三回:無料のアイコンを使ってロゴを配置してみよう
    09:28
  • 第四回:整列ツールを使って綺麗なナビゲーションを作ってみよう
    10:05
  • 第五回:色調補正パネルを利用した、メイン画像を作ってみよう
    07:42
  • 第六回:無料のアイコンを利用したバナーを作ってみよう
    15:48
  • 第七回:テキストツールを使って、記事一覧を作ってみよう
    13:48
  • 第八回:レイヤー複製機能を使って、即座にフッターを作ろう
    06:58
  • 第九回:シェイプツールを使って、ページトップへを作ろう
    05:12
  • 最終回:スライスツールを使って、画像を書き出してみよう
    10:41

  • 第1回:Webサイト用のファイルを新規作成しよう
    02:07
  • 第2回:ガイドを使ってWebサイトのレイアウトを作る方法-1
    08:24
  • 第2回:ガイドを使ってWebサイトのレイアウトを作る方法-2
    06:26
  • 第3回:Webサイトに背景画像を設定する方法
    05:30
  • 第4回:無料のアイコンを利用したロゴを作成する方法-1
    06:16
  • 第4回:無料のアイコンを利用したロゴを作成する方法-2
    04:58
  • 第5回:お問い合わせバナーを作成する方法-1
    04:52
  • 第5回:お問い合わせバナーを作成する方法-2
    03:57
  • 第6回:テキストツールでナビゲーションを作成する方法-1
    04:13

  • 第6回:テキストツールでナビゲーションを作成する方法-2
    05:38
  • 第7回:レイヤースタイルを使用したメイン画像を作成する方法
    06:38
  • 第8回:テキストボックスを使って新着情報一覧を作成しよう-1
    08:44
  • 第8回:テキストボックスを使って新着情報一覧を作成しよう-2
    10:03
  • 第9回:写真を使ったバナーを作成する方法-1
    04:29
  • 第9回:写真を使ったバナーを作成する方法-2
    05:54
  • Preview04:19
  • 最終回:コピーライト付きフッターを作成する方法
    02:38

  • 第1回:記事ページ用のファイルの複製と修正
    04:16
  • 第2回:変形ツールで、メインビジュアルを見出しに変える方法
    07:55
  • 第3回:既存のレイヤーを再利用してメニュー一覧を作ろう-1
    05:12
  • 第3回:既存のレイヤーを再利用してメニュー一覧を作ろう-2
    05:56
  • 第3回:既存のレイヤーを再利用してメニュー一覧を作ろう-3
    06:08
  • 第3回:既存のレイヤーを再利用してメニュー一覧を作ろう-4
    04:58
  • 第4回:フッターを調整する方法
    03:02
  • 第4回:ご予約ページ用のファイルの複製と修正
    04:02
  • 第5回:ナビゲーションの修正と小見出しの修正
    03:20

  • 第6回:ご予約フォームの注意文を作成する方法-1
    07:13
  • 第6回:ご予約フォームの注意文を作成する方法-2
    06:39
  • 最終回:ご予約フォームを作成する方法-1
    05:06
  • 最終回:ご予約フォームを作成する方法-2
    04:58
  • 最終回:ご予約フォームを作成する方法-3
    04:04
  • 最終回:ご予約フォームを作成する方法-4
    06:38
  • 最終回:ご予約フォームを作成する方法-5
    12:09
  • 最終回:ご予約フォームを作成する方法-6
    06:19

  • 第1回:Webサイト用新規ファイルの作成方法
    04:22
  • 第2回:ガイドを使ってサイト全体のレイアウト組みをしよう-1
    04:42
  • 第2回:ガイドを使ってサイト全体のレイアウト組みをしよう-2
    03:02
  • 第3回:シェイプツールでヘッダーの背景を作成する方法
    05:20
  • 第4回:無料アイコンでロゴとナビゲーションを作成する方法-1
    04:58
  • 第4回:無料アイコンでロゴとナビゲーションを作成する方法-2
    05:44
  • 第5回:特集記事部分を作成する方法-1
    03:18
  • 第5回:特集記事部分を作成する方法-2
    04:43
  • 第5回:特集記事部分を作成する方法-3
    03:51
  • 第6回:人気記事ランキングを作成する方法-1
    04:17

  • 第6回:人気記事ランキングを作成する方法-2
    06:23
  • 第6回:人気記事ランキングを作成する方法-3
    04:07
  • 第6回:人気記事ランキングを作成する方法-4
    03:38
  • 第6回:人気記事ランキングを作成する方法-5
    04:42
  • 第6回:人気記事ランキングを作成する方法-6
    03:08
  • 第7回:カテゴリー一覧を作成する方法-1
    05:10
  • 第7回:カテゴリー一覧を作成する方法-2
    04:19
  • 第7回:カテゴリー一覧を作成する方法-3
    04:42
  • 第8回:新着記事一覧を作成する方法-1
    04:07
  • 第8回:新着記事一覧を作成する方法-2
    02:44

  • 第8回:新着記事一覧を作成する方法-3
    05:43
  • 第8回:新着記事一覧を作成する方法-4
    05:33
  • 第8回:新着記事一覧を作成する方法-5
    05:04
  • 第8回:新着記事一覧を作成する方法-6
    04:22
  • 第9回:ページネーションを作成する方法
    07:33
  • 最終回:フッターを作成する方法-1
    04:19
  • 最終回:フッターを作成する方法-2
    03:47
  • 最終回:フッターを作成する方法-3
    05:14
  • 第1回:記事ページ用新規ファイルの作成方法
    03:00
  • 第2回:パンくずリストの作成方法
    04:39

Instructor

NEST online
ウェブデザイン / プログラミング
NEST online
  • 4.3 Instructor Rating
  • 11,807 Reviews
  • 62,063 Students
  • 8 Courses

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

卒業生は1000名以上です。


★提供しているサービス

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

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


Webデザインキャンプ

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


Railsキャンプ

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


など


  • Udemy for Business
  • Teach on Udemy
  • Get the app
  • About us
  • Contact us
  • Careers
  • Blog
  • Help and Support
  • Affiliate
  • Terms
  • Privacy policy
  • Cookie settings
  • Sitemap
  • Featured courses
Udemy
© 2021 Udemy, Inc.