UI Design with Photoshop from Beginner to Expert in 15 days

BY
Udemy

Mode

Online

Fees

₹ 549 3499

Quick Facts

particular details
Medium of instructions English
Mode of learning Self study
Mode of Delivery Video and Text Based

Course and certificate fees

Fees information
₹ 549  ₹3,499
certificate availability

Yes

certificate providing authority

Udemy

The syllabus

Introduction to UI Design and why it matters

  • What this course will cover?
  • Why UI Design Matters?

Setting Up Photoshop for UI Design

  • Photoshop Preferences for UI Design & better performance - Updated
  • Color Proof Settings - Updated
  • Color Profile Settings for UI Design- Updated
  • Creating Custom Shortcuts for Photoshop - Updated
  • Keyboard Shortcut problems on MAC OS → Student Request Lecture
  • Photoshop Workspace(Panels) setup for UI Design → Updated
  • Photoshop Settings for UI Design
  • Which Monitor is best for UI Designers
  • Download all resources and psd source files for this course

Basics of Photoshop for Beginners

  • How Photoshop Interface Works
  • Customizing Photoshop Toolbar→ Student Request Lecture
  • New Document Setup for UI Design
  • What are artboards and how to use them?
  • How layers works and Basics of Layer panel controls
  • Layers Panel → Filtering and finding layers
  • Type Tool
  • Character Panel
  • Paragraph Panel
  • Shape Tool for UI Design (Combine and Subtract Shapes)
  • How to use Pen Tool for UI Design
  • Student Request: How to use pen tool in Icon Design?
  • Using Selections in different ways (Selection + Lasso Tool)
  • Alignments
  • Using Clipping Masks in UI Design
  • Exercise Challenge : Clipping Mask
  • Clipping Mask Simple Design Challenge
  • Layer Masks
  • Smart Objects
  • Linked Smart Objects
  • Layer Comps usage in Photoshop
  • MAC users : Shortcut Key Help for Photoshop
  • Commonly used Keyboard Shortcuts
  • Smart Guides and Smart Snapping in Photoshop
  • Installing and Using Action files in Photoshop → Youtube
  • Creating your own Action set in Photohsop → Youtube
  • Basic Tools Quiz
  • Students FAQ Video → Answered common problems

Layer Styles Basics for UI Design

  • Using Multiple Layer Shadow Effects in UI Design (PSD Excercise File Included)
  • Using Inner Shadow Effect
  • Using Layer Stroke Effect
  • Re-using Layer Styles

Gradients in Web and UI Design

  • What are Gradients?
  • Examples of Gradients usage in Web and UI Design
  • 3 ways to create gradients in Photoshop
  • Using Gradient Overlay Layer Style
  • Gradient Editor Deep Dive

Using Patterns in Web and UI Design

  • What are Patterns and their Usage in UI Web Design?
  • Methods of applying Patterns In Photoshop
  • How to create patterns from an image file in Photoshop
  • Installing and using .PAT pattern files in Photoshop
  • Quiz: What Layer styles are used?

Basics of UI Design | Light, Shadows, Color schemes & Typography

  • Light and Shadow (Important Concept)
  • Example usage of Light and Shadow in UI Design
  • Color Schemes in UI Design for Beginners
  • Getting Color Schemes from Logo and using HSL Basics
  • Using Online Tools for creating Color Schemes
  • Resources : Online Tools for Color Schemes PDF
  • Typography or Font Selection for Beginners
  • Recourse → Typography & Font Pairing for Beginners

Using Grids in Web and UI Design

  • What are Grids in Web and UI Design and how to use Grids
  • How to create Grids in Photoshop (Two methods)
  • Using Bootstrap Grid explained in Photoshop → Student Request Video

Installing and Using Photoshop Plugins and Scripts to automate tasks

  • RESOURCES → Photoshop Scripts for UI Designers
  • Installing Photoshop Scripts and setting Keyboard Shortcuts for them - Updated
  • Installing Photoshop Scripts on MAC OS → Student Request Lecture
  • RESOURCES → Photoshop CC Extensions for UI Design
  • How to Install Photoshop Extensions in CC2018 & CS6 (MAC and Windows)
  • Installing Extensions on MAC OS → Student Request Lecture
  • Photoshop Extensions used by UI Designers - Updated
  • Super Powers of Photoshop Extensions (Demonstration) - NEW
  • Resources CS6 → Scripts & Extensions for Photoshop CS6

(Optional - Can Watch at the end) Color Calibration and Monitors for Designers

  • What color calibration is and what tools are there to do 
  • How to perform Color Calibration on Windows or 
  • Quiz: Color Calibration & Monitors for Designers

UI Design Exercises & Challanges with Step by Step solutions

  • Exercise Challenge : Soft Button
  • Challange SOLUTION: Soft Button (Step by Step)
  • Exercise Challenge : 3D Button
  • Exercise Mastering Pressed or Inset Effect in UI Design
  • Exercise Modern Header/Hero area Design (PART 1)
  • Exercise Modern Header/Hero area Design (Part 2)
  • Exercise Modern Hero Area Design (Variation 2nd)
  • Exercise Modern Header/Hero Design with Color Overlay Technique
  • Modern Header Design: Masked Gradient Effect
  • Tabbed navigation Design Introduction
  • Tabbed navigation Design → Part 1
  • Tabbed navigation Design → Part 2

Image Editing 101 for UI Designers

  • Removing white background from image with blending options
  • Removing any background quickly with Magnetic Lasso and Refine Edge
  • UPDATE: Removing background with Select and Mask
  • Select Subject New feature Photoshop CC2018
  • Removing specific parts of an image using Spot Healing Brush
  • Enhancing Pop effect of your images using Adjustment layers

IOS App Design : Exercise Iphone Food Deals App

  • Fonts and Images used in Iphone App Design
  • Starting Iphone App Design
  • Adding Images to Iphone App Screen
  • Adding text to Iphone App Screen
  • Adding Buttons to Iphone App Screen
  • Using Iphone Mockup to show your designs
  • App Design Challange - Design and Submit your Mobile App Screen

Bonus: Dribbble styled Dashboard UI Design (Student Request)

  • Exercise AREA GRAPH: Design Base
  • Exercise AREA GRAPH: Grid Design
  • Exercise AREA GRAPH: Adding text and Legends
  • Exercsie AREA GRAPH : Design Main Red Graph Shape
  • Exercsie AREA GRAPH: Adding Extra Detials
  • Exercise AREA GRAPH: Alignment and Balance
  • Exercise LINE GRAPH: Desiging Line Graph from Area Graph
  • Exercise Circular Graph: Design Base shapes of Circular graph
  • Exercise Circular Graph: Adding Styles to Circular graph fills
  • Exercise Design Stats with text
  • Exercise Bar Graph Design: Part 1
  • Exercise Bar Graph Design : Part 2
  • Student Request → Custom Percentage Circular Bar Graph

Exercises : Form UI Design with Photoshop

  • Exercise Login Form: Base Design
  • Exercise Login Form: Designing Input Fields
  • Exercise Login Form: Finishing Login Form
  • Exercise Login Form: Base Design
  • Exercise Login Form: Designing Input Fields
  • Exercise Login Form: Finishing Login Form

Exercises: Form UI Design with Photoshop

  • Exercise Login Form: Base Design
  • Exercise Login Form: Designing Input Fields
  • Exercise Login Form: Finishing Login Form

Dribbble Shot Redesign Exercise - Student Request

  • Dribbble Realistic Buttons Redesign Part 1
  • Dribbble Realistic Buttons Redesign Part 2

Wifreframes in UI Design + Ultimate Web Design Challange

  • What are Wireframes ?
  • Online Tools & Softwares to to create Wireframes
  • Rescources for creating Wireframe
  • Convert this Wireframe to an actual Web Design

Student Review Sessions

  • Improve your Designs by looking at other designer's mistakes

Pro Secret Tips and Tools for Designers and Developers

  • Converting PSD to CSS (Tips, tools and Extensions for Web Designers/Developers)
  • Tips for Using Grids while Designing
  • Exporting Images for Web and UI Design

Photoshop Features Updates and New Versions

  • New Features in Photoshop CC2015 for UI Designers
  • Font Match Feature in CC2017
  • CC2018 New Features for UI Designers
  • What to do NEXT?
  • BONUS LECTURE

Trending Courses

Popular Courses

Popular Platforms

Learn more about the Courses

Download the Careers360 App on your Android phone

Regular exam updates, QnA, Predictors, College Applications & E-books now on your Mobile

Careers360 App
150M+ Students
30,000+ Colleges
500+ Exams
1500+ E-books