Diploma in UI Design

Description

The Diploma in UI Design course teaches you about UI or user interface design. You will learn the procedures of designing modern, intuitive, meaningful, and compelling user interfaces for desktop and mobile devices. To develop UI for machines and software, you must have an active command of Photoshop and colour theory. The course will help you to master the essential tools and functions for designing UI. The course covers the Keyboard shortcuts for Photoshop, Photoshop extension for speeding up your design, using different colour schemes, typography, and other online tools. The course teaches you to design modern HERO or Headers, dashboard graphs and other website elements. You will also learn about Custom Script, Gradients and Patterns for UI design.

Upon completion, you can create a stunning UI for mobile or desktop.

Entry Requirements:

Novice/Beginner Level Designers
Web Designer
Graphic Designer
Web Developers who want to learn UI Design
UI Designer who wants more advanced techniques

Certification

Once you finish the course, you can get a certificate to show your success. The PDF version costs just £3.99, while a printed one is £7.99. If you’d like both, it’s £10. For students outside the UK, there’s an extra £10 for delivery.

Why choose us?

Affordable, engaging & high-quality e-learning study materials;
Tutorial videos/materials from the industry leading experts;
Study in a user-friendly, advanced online learning platform;
Efficient exam systems for the assessment and instant results;
The UK & internationally recognized accredited qualification;
Access to course content on mobile, tablet or desktop from anywhere, anytime;
The benefit of applying for the NUS Extra Discount Card;
24/7 student support via email.

Career Path

After completing this course, you will be able to build up accurate knowledge and skills with proper confidence to enrich yourself and brighten up your career in the relevant job market.

Course Curriculum

Introductions
	1) Promo Intro Video	00:04:00
	1.1) Upload And Review Your Work-1	00:03:00
Setting Up Photoshop for UI Design
	2.2) Setting up Photoshop CC Preferences	00:06:00
	2.3) Color Profile Settings for ui design	00:05:00
	2.5) Creating Custom Shortcut Keys	00:04:00
	2.6) Installing scripts in Photoshop	00:06:00
	2.8) What area Photoshop Extensions	00:07:00
	2.9) Power of Photoshop Extensions	00:09:00
	2.10) How to install Extension in mac and win update	00:16:00
(Optional → Can watch at the end) Color Calibration and Monitors for Designers
	2.5-1 Color Calibration	00:08:00
	2.5-2 Monitor You Need-1	00:02:00
	2.5 – 3 OS Based clor Calibration	00:07:00
Basics of Photoshop for Beginners
	00.Customize Toolbar	00:04:00
	01.how Photoshop interface works	00:05:00
	02.creating photoshop new document	00:04:00
	03.what are artboards	00:06:00
	04.Layers Panel Part 1	00:06:00
	05.Layer Panel Filtering And Finding Part 2	00:06:00
	07.Type tool	00:05:00
	08.Character Panel	00:07:00
	09.Paragraph Panel	00:04:00
	10.New Shape Tool	00:08:00
	12.Deep dive in Pen Tool	00:16:00
	12.selections-april2017 New	00:07:00
	13.pen tool in web design	00:04:00
	14.Alignments	00:06:00
	15.common-shortcuts	00:15:00
	16.Clipping_Masks	00:03:00
	17.exercise_clipping_mask	00:01:00
	18.LayerMasks_HB	00:05:00
	19.smart_objects	00:08:00
	20.linked smart objects_Revised	00:07:00
	21.Layer comps usage	00:06:00
	22 Using Smart Guides In Photoshop-1	00:05:00
Layer Styles Basics for UI Design
	1.Drop Shadow Layer Effect	00:04:00
	2. Inner Shadow UI Design	00:02:00
	3.stroke_effect	00:03:00
	4. Re-using layer styles	00:02:00
Gradients in Web and UI Design
	1.what.are.gradients	00:02:00
	2.uses.of.gradients	00:04:00
	3.3ways-to-create-gradients	00:05:00
	4.how to use gradient editor	00:08:00
	5.using-gradient-overlay	00:06:00
Using Patterns in Web and UI Design
	1.what are patterns	00:02:00
	2. two methods of applying patterns	00:05:00
	3.create Pattern From an Img File	00:03:00
	04. using .pat files in photoshop	00:05:00
Basics of UI Design \| Light, Shadows, Color schemes & Typography
	01. How light and shadow works in UI Design	00:04:00
	2.examples of lightshadow	00:02:00
	3.color schemes for beginners	00:02:00
	4.getting scheme from logo and hsb	00:01:00
	5.online tools for color schemes	00:07:00
	6.how to choose fonts and typography	00:09:00
	7.Using Grids for Web Design	00:06:00
	8.Creating Grids In Photoshop	00:06:00
UI Design Exercises & Challanges with Step by Step solutions
	1.soft-shadow button challange	00:01:00
	2.soft_button_solution	00:13:00
	3.3d Button Challange	00:01:00
	4.Pressed effect in Photoshop	00:07:00
	5.modern pattern part 1	00:09:00
	6.modern header design part 2	00:09:00
	7.moder header design new variation	00:09:00
	8.color overlay header	00:11:00
	09 Gradienteffect Header Design-audiosynced	00:13:00
	9.Actual Exercise Transparent Image Header-1	00:13:00
	10.tabs-intro	00:01:00
	11.tabs-part1	00:14:00
	12.tabs-part2	00:08:00
Image Editing 101 for UI Designers
	1.removing White Bg With Blending Options	00:03:00
	2.Spot Healing brush usage	00:04:00
	3.making Colors Pop in Photohsop	00:07:00
	4.magnetic Lasso Tool to remove background	00:16:00
	5.select And Mask Tool	00:10:00
IOS App Design : Exercise Iphone Food Deals App
	1.Gathering Resources IOS App-Design	00:04:00
	2.Lets Start The IOS App Design	00:05:00
	3.Adding Images To Design the App design	00:06:00
	4.Adding Text On App Screen	00:06:00
	5.Adding Phone And Book Now Buttons	00:12:00
	6.Using Mobile Mockups	00:04:00
	UDEMY ONLY App Design Challane-exercise	00:06:00
BONUS: Dribbble styled Dashboard UI Design (Student Request)
	1.area graph base design	00:04:00
	2area graph grid	00:05:00
	3.adding text to graph area	00:08:00
	4.drwaing area graph with pen tool	00:04:00
	5.designing extras adding dots and hover info	00:06:00
	7.final Adjustments To Area Graph-1	00:10:00
	8.area graph to line graph	00:04:00
	9.circular bar graph base shape.mp4	00:06:00
	10.adding Gradients And Shadows To Circular Graphs-1	00:13:00
	11.designing stats with text	00:09:00
	12.bar Graph Design In Photoshop Pt	00:09:00
	13.Bar Graph Adding Text	00:06:00
	14.Student-request-ciruclar-percentage graph	00:08:00
Wifreframes in UI Design + Ultimate Web Design Challange
	1.what Are Wirefreams	00:04:00
	2.Tools Used For Wireframes	00:12:00
Dribbble Shot Redesign Exercise → Student Request
	dribbble redesig part 1	00:15:00
	dribble shot part 2	00:15:00
Exercises : Form UI Design with Photoshop
	1.Base Of Login Form	00:07:00
	2.Form Fields Design	00:12:00
	3.Finishing Form Design	00:12:00
Pro Secret Tips and Tools for Designers and Developers
	Converting psd to CSS	00:06:00
	Exporting Images from Photoshop	00:07:00
	Tips on Using Grids	00:02:00
Photoshop Features Updates and New Versions
	3.Match Fonts Cc2015.5-1	00:03:00
	Cc2018 Update-1	00:04:00