Design Mobile Apps: UI, UX & Prototyping in Adobe XD & PS

14h 51m 9s
English
Paid
March 8, 2024

Do you want to design outstanding apps? Impressive prototypes that look like the real deal but without any coding? This course is a masterclass – a comprehensive approach to mobile app designing. I’ll teach you everything you need to know, from A to Z. We’ll use Photoshop, Adobe XD, Zeplin. I've taught over 220.000 students on Udemy and I'm a best-selling instructor!

More

You’ll learn about Material Design, the principles of color, spacing, and typography, tips and tricks, how to get design resources, and much much more. Get a life skill that’s high in demand in today’s job market, all for the price of a fancy coffee. Create beautiful apps, interactive prototypes, and supercharge your career.

You'll learn to:

  • Design beautiful mobile apps;

  • Create interactive prototypes without any previous knowledge;

  • Use Photoshop for mobile app design;

  • The principles of Material Design;

  • Learn Adobe XD from scratch;

  • Prepare all the files for developers through a special program called Zeplin;

  • How to size elements correctly on ALL phone types and sizes;

  • Typography best practices;

  • Where to get design resources like icons, custom graphics, photos, and more;

Watch Online Design Mobile Apps: UI, UX & Prototyping in Adobe XD & PS

Join premium to watch
Go to premium
# Title Duration
1 Requirements and your expectations 09:10
2 Join Our Photoshop Community and Download all Resources 02:26
3 Photoshop vs Adobe Experience Design vs Sketch 05:48
4 Don’t design any mobile app without this! 05:25
5 Activity: Design your first app layout – Part 1 07:04
6 Activity: Design your first app layout – Part 2 07:27
7 How much money can you earn as an app designer? 03:10
8 Preview your designs on your phone 04:07
9 Optional - Computer requirements 08:36
10 Discover the differences between Android and iOS apps 04:35
11 Introduction 03:22
12 Set up Photoshop for app designing 04:49
13 Best settings for an Android project in Photoshop 05:37
14 Must-know artboard features in Photoshop 07:03
15 10 Tips to efficiently work with vectors in Photoshop 11:28
16 Best tips for layer alignment 08:21
17 Learn to efficiently select layers in artboards 07:59
18 Exercise: Layer selection and repositioning 02:05
19 Solve the previous exercise 05:50
20 Best typography tips for app designing 10:22
21 Learn how to actually use smart objects 07:54
22 Introduction to Material Design 03:55
23 Android interface components overview 06:41
24 Learn to design the action bar 06:42
25 The simple guide to sizing components in pixels 05:22
26 Sizes in pixels & action bar showcase 07:54
27 Everything you need to know about tabs 08:07
28 Displaying content in cards 05:51
29 Beautiful and effective buttons on Android 06:59
30 Text Fields 05:24
31 Introduction to this section 04:11
32 Understanding the brief and the client's wishes 06:59
33 Analyze the app’s competitors – Part 1 07:44
34 Analyze the app’s competitors – Part 2 07:51
35 Layout for the location (1) and listing (2) screens 07:25
36 Layout for the restaurant details (3) screen 06:15
37 How to make great design choices 06:49
38 Design concepts for the location screen (1) 08:16
39 Design concepts for the restaurant listing (2) 08:49
40 Restaurant listing alternatives (2) 09:55
41 Final restaurant listing variations (2) 06:44
42 Design concepts for the restaurant details (3) screen 09:47
43 Choosing the best typeface 08:10
44 Define and refine our app’s style 09:02
45 Finishing touches screen 1 07:09
46 Finishing touches on screens 2 and 3 05:03
47 Section overview 02:07
48 Section introduction 01:32
49 What do you want to be? A designer or a problem-solver? 06:57
50 Discover the one thing that ruins all your designs 04:37
51 UI Icons in Android apps 07:21
52 Hands-on icons: Create a dashboard panel 09:54
53 Android Icons: Case studies 06:28
54 A guide for app design inspiration 08:07
55 Target audience and the app’s story 04:30
56 Create a mood board 06:18
57 Discover what makes an app beautiful 05:44
58 Android color fundamentals 07:19
59 How to use color appropriately 03:42
60 The principle of color contrast 05:42
61 The best color schemes from top apps 08:22
62 Tools for awesome color schemes 03:21
63 How to implement a color scheme 06:15
64 Android typography fundamentals 06:56
65 7 rules for Android legibility 04:55
66 Guide for perfect font sizing in Android apps 05:46
67 Typography: what the biggest apps are doing 06:22
68 How to make lots of text look great 07:25
69 How to pair fonts correctly 06:12
70 iOS apps – Overview 04:38
71 1x, 2x, 3x, PPI, notch?! iOS artboard size guide 10:21
72 App design comparison: iOS vs Android 04:29
73 My take on the official UI Kit 03:31
74 iOS status bar (with/wo Notch) 02:51
75 iOS Navigation bar 05:04
76 iOS Tab bar 05:48
77 iOS Text Fields 04:24
78 iOS Controls 04:04
79 Running Android apps on Mac OS 09:03
80 The official iOS typeface – should you use it? 06:44
81 iOS conclusions 01:32
82 Section introduction 01:36
83 Preparing the PSD for 20+ screens 08:54
84 Login and registration screens – version 1 10:20
85 Login and registration screens iteration 06:54
86 Design the right menu 09:49
87 Design the left menu 07:13
88 Creating card-based layouts for Addresses and Payments 07:09
89 Add a payment method – Design a credit card 08:04
90 Design the Reviews screens 08:25
91 Create the restaurant’s address and user profile screens 05:29
92 Making the order history screen & success page 04:43
93 Create the order details screen 09:51
94 An overview of our progress 01:49
95 Introduction to Adobe XD (Experience Design) 08:58
96 Learning XD and setting your expectations 04:05
97 An overview of XD’s interface 05:40
98 Getting around in Adobe XD 03:55
99 Selecting layers in XD 06:15
100 Shape fundamentals in Adobe XD 08:49
101 Editing shapes in Adobe XD 05:56
102 Text fundamentals in XD 04:07
103 Grid and smart guides 03:32
104 Pen tool 03:58
105 Working with photos and masks 03:46
106 Adobe XD tips & quirks 08:25
107 Optional - Disable Adobe XD's Recording Message on Windows 01:50
108 From Photoshop to XD 05:56
109 Create real-life mockups in just a few clicks 05:07
110 Lightning speed with the Assets panel 06:11
111 Linked symbols 04:48
112 Preview and device preview 04:35
113 Prototyping overview and sharing your design 05:06
114 Create interactive prototypes 05:21
115 Prototyping tips and tricks 08:00
116 Make your app prototype seem real 04:21
117 The incredible auto-animate and drag 03:38
118 The Libraries panel 02:48
119 Introduction to Zeplin 04:33
120 What the coder gets out of Zeplin 07:57
121 From Photoshop to Zeplin to Android Developers 07:12
122 Anything is possible in Android! Make clients & coders love you 11:04
123 Design specs through XD 04:44
124 Exporting from XD 03:15
125 The best way to work with coders in Zeplin 02:52
126 Introduction 01:21
127 Import and fix the PSD in Adobe XD 06:12
128 Setting up the prototype 03:55
129 Prototyping the login and register screens 04:27
130 Dealing with the City dropdown 03:58
131 Creating the map interaction 08:29
132 Finishing the initial screen interactions 04:20
133 Analyzing our progress 04:41
134 Recover password and create an account 09:34
135 Recreate the restaurant listing in Adobe XD 03:53
136 Creating a search bar 04:33
137 Connecting the left menu 05:21
138 Connecting the filters 03:11
139 Creating an animated tab system for the dish listing 09:19
140 Creating the app’s routes – difficult! 07:37
141 Continuing route 1: user registers at the beginning 06:01
142 Route 2: user registers during checkout 06:33
143 Route 3: user already has an account 07:44
144 Restaurant information and reviews 02:59
145 Fine-tuning and project analysis 03:31
146 Preparing to export to Zeplin 08:16
147 Export to Zeplin 05:36
148 Final Thoughts & What's Next 04:35

Similar courses to Design Mobile Apps: UI, UX & Prototyping in Adobe XD & PS

Digital Asset Designer: Creating and Selling Mockups

Digital Asset Designer: Creating and Selling Mockups

Duration 2 hours 56 minutes 57 seconds
Building awesome Color Schemes for your UI Design Projects

Building awesome Color Schemes for your UI Design Projects

Duration 4 hours 26 minutes 11 seconds
From Zero to Application Designer (Web, mobile, tablet)

From Zero to Application Designer (Web, mobile, tablet)

Duration 10 hours 50 minutes 17 seconds
Create a Personal Portfolio using Angular 2 & Behance

Create a Personal Portfolio using Angular 2 & Behance

Duration 2 hours 8 minutes 10 seconds
Learn Adobe Experience Design CC 2018 by Example

Learn Adobe Experience Design CC 2018 by Example

Duration 1 hour 32 minutes 48 seconds
Graphic Design Masterclass - Learn GREAT Design

Graphic Design Masterclass - Learn GREAT Design

Duration 19 hours 15 minutes 43 seconds
Using Vue 2 to Create Beautiful SEO-Ready Websites

Using Vue 2 to Create Beautiful SEO-Ready Websites

Duration 1 hour 48 minutes 11 seconds
User Experience Design Essentials - Adobe XD UI UX Design

User Experience Design Essentials - Adobe XD UI UX Design

Duration 12 hours 46 minutes 57 seconds
Adobe XD Crash Course

Adobe XD Crash Course

Duration 3 hours 11 minutes 58 seconds