Mobile App Design: Learn UX/UI and Start Freelancing Career
4.1 (101 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
5,783 students enrolled

Mobile App Design: Learn UX/UI and Start Freelancing Career

Mobile App Design Course Using UI / UX Techniques, Become Mobile App Designer and Start Your Freelance Career From Zero
4.1 (101 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
5,783 students enrolled
Last updated 10/2017
English [Auto-generated]
Current price: $34.99 Original price: $49.99 Discount: 30% off
5 hours left at this price!
30-Day Money-Back Guarantee
This course includes
  • 5 hours on-demand video
  • 9 articles
  • 33 downloadable resources
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
Training 5 or more people?

Get your team access to 4,000+ top Udemy courses anytime, anywhere.

Try Udemy for Business
What you'll learn
  • Learn How to Come Up with App Idea
  • Learn User Experience Design
  • Learn User Interface Design Using Adobe Photoshop
  • Design iOS 8 Mobile App from Scratch
  • Effective and Profitable Freelancing Tips
  • Earn Money by Learning
  • Start a New Career as a Mobile App Designer
  • Windows, Mac or Linux Operating System
  • Balsamiq (not required)
  • InVision Online Prototyping Tool (absolutelly free to use)
  • Adobe Photoshop (30 day free trial), but you don't need to know it
  • Paper and pen
  • Be Willing to Learn New Stuff





You're going about your day as usual and BAM! You think of this awesome app idea. It's simple, people would love it and you can't find it ANYWHERE in the app store.

Or maybe you want to develop a highly profitable skill with which you can make a profitable income EVERY DAY by working when you want from where ever you want?

This course is optimized for anyone who is looking to efficiently learn the most important design techniques that will help design perfect apps! Because well designed mobile apps are just as important as well-built apps.

Specifically, you are going to learn how to design user friendly, engaging, beautiful looking mobile apps from scratch, by doing assignments, quizes, and practical work between the lessons.

Mobile App Design is not just about how to design pretty app. It's also about designing an app that looks great and works smoothly.

Although this course mainly covers iOS 8 Mobile App Design, but after completing it, you are going to develop a skill, with which you are going to start designing mobile apps for all major platforms (iOS, Android and Windows Phone) in no time!

Course content:

  • Learn how to start from scratch with your own app idea
  • Go through all the user researching steps on finding your target audience.
  • How to figure out who to target (marketing tips).
  • Learn how to create sketches and wireframes.
  • Learn User Experience Design (UX) techniques which are trending in job market right now.
  • Learn how to use Adobe Photoshop for designing User Interface (UI) Designs.
  • I'm going to show you my workflow and how I'm going to start design my own app idea, News Reader App, from absolute zero to the great looking iOS 8 design style.
  • You are going to implement everything you learned in the previous lessons and in the final section, I'm going to show you a bunch of different tips and resources, how to start making big money with your new skills.
  • Assignments which are going to help you learn UI / UX Design for Mobile App
  • Quizes, which will help you recap what you learned in the previous section

Mobile App Design: Learn To Design The Perfect App is a comprehensive course where you are going to earn exactly those skills and make money instantly.

Mobile App UI / UX Designers typically earns around $100K/per year working for companies and startups.

But if you decide to work as a freelancer online, you can expect to get $100/hour for the work as a UI / UX designer.

Where is no coding or programming required.


After this course, you can go to the world and start seeking for a jobs at the biggest world companies or startups, or start freelancing online on your own and in your own home.

With those freelancing tips applied, you can expect to earn $100/h of your work.

Where is no problem if you don't know Photoshop at all.

Plus you are going to get Adobe Photoshop for free for the first 30 days, so you don't need to buy it.

All in all, you are going to get 5 courses in one:

    How to come up with your own app idea

    User Experience skills to research your target audience and create sketches and wireframes for the app

    Learn Adobe Photoshop from ground zero

    Design your own app in Adobe Photoshop

    How to make money with your new skills, so effective freelancing and job seeking in the companies and startups.

Plus, you are going to get fast and responsive answers from me, your instructor.

Also, if you don't like my course you have 30 days money back guarantee, so you don't lose anything! NO QUESTIONS ASKED!

Who this course is for:
  • No Specific Skills Needed
  • This is not a Programming Course
  • No Prior Knowledge is Needed in Adobe Photoshop
  • No Prior Knowledge is Needed in Balsamiq
  • No Prior Knowledge is Needed in Online Freelancing
  • This course is absolutelly for BEGINNERS
  • Have 5 or More Apps on Your Phone (We are Going to Need Some Inspiration)
Course content
Expand all 93 lectures 05:17:25
+ Getting Started
7 lectures 14:46

I’m going to answer all your questions related to this course or about anything on my Twitter ASAP! Or you just can use Udemy Discussion section ;)

Preview 01:45

In this course we are going to create The Complete iOS8 Mobile App Design.

What this app is going to do is it will help the user to search interesting blogs or news around the web assuming users interests.

This app will search for the news around the globe by receiving all the information the user wants to see in their app feed.

So it’s going to be like those apps in the App Stores where the app will show mostly relevant news or blogs for the specific user needs and wishes.

Firstly, the user is going to see the login page. It has different login options which are log in via FB or Twitter.

Then the user login to the app it’s going to redirect the user to the categories screen there he will choose what topics he wants to read and see in their feed. It’s going to be simple categories page.

After the user sets up all the topics he will be redirected to actual news page (and the app is going to give the user most relevant news for their interests). It’s going to be a grid view this a few additional options for the user.

If the user wants to read more about specific blog item or news item, after he pressed it he will be redirected to blog details page there he can read about it in more details.

The app is going to have a slide menu (or navigation drawer) which will have a few items for the user.

Preview 01:36

If you want to have a full experience with this course, you have to actual design stuff on your own. It’s going to have the best effect with this course for you because you will start to think like a designer and this way you can develop critical thinking which is probably the most important skill you need in Mobile App Design Industry.

But if you don’t understand some topics or want to have a better explanations from me, just use the discussion section to the right and I am going to answer all the questions as soon as possible. And yes, I will keep an eye on it every single day, so it means my course will never get outdated and I will help all the students with their problems.

Don’t hesitate, work and approach new career. I’m here to just assist you and help with hopefully useful content for your next career choice.

And finally, almost after each of the sections or the lessons I’m going to give you assignments for you to make stuff going on ur own, so you can make designs while learning from me.

Preview 01:15

With ps we are going to create our interface design, which is what the user actually sees.

It will include all the buttons, fonts, images, icons and all the stuff the user is going to see on his app screen.

Invison is going to be for app prototyping which is going to simulate our app and we could see how it’s going to work without actually touching the code.

It’s not going to be like our final app which could be published to app store.

It won’t have a backend and all the apps logic but it would be a great thing to present for the developer to make sure u r on the same track.

With Balsamiq we are going to design and create our wireframes for the app.

And finally we are going to use pen and paper. We will use them to sketch our app to get a better understanding about it and this way we could turn our quick ideas to a sketch and only when start designing our beautiful app.

Preview 01:25
What is User Interface Design?
What is User Experience Design?
UX vs UI

In this quiz you are going to rewind your knoledge and try to answer some of those questions of this particular section. Good luck!

Getting Started Quiz
4 questions
+ Starting From Idea .....
6 lectures 09:30
A Great Imagination and How to Come Up with an App Idea)
Why Should You Identify Target Audience?

How to Figure Out Who to Target?
What After That?
Assignment 1: Come Up with Your Own App Idea

Let's rewind everything we learned in this section and try to pass the quiz. Good luck, folks!

Start from Idea Quiz
3 questions
+ UX Planning, Research, Storytelling, Sketching, Wireframing
18 lectures 34:56
Section Overview

Now let’s take a look at this checkout form which is not an actual form for Mobile Application, but where are still many apps on the App Stores that using this kind of checkout form.

How to Improve Checkout Form?

We have a couple of options to change in this checkout form for Mobile Application:

Improving Checkout Form

Let’s brainstorm the topics we already covered in this course and let’s try out and think what could be the top 3 features for the News Reader Application?

Coming up with Top 3 Features for the App
Top 3 Features
Top 3 Features (Notes)

But why do we need personas?

Probablythe most important reason to create personas is to set a common understand of the final user. So that a coherent strategy is defined that will result in a product/service that is user oriented and meet the user goals.

Questions to ask during persona development

Using / Creating Personas
Persona Template

I hope you doing fine and maybe want to make something on your own. Right?

Assignment 2: Create a Persona for Your Own App Idea

In story-centered design, you critique work by looking at dozens of sequential mockups that function like frames in a filmstrip.


Draw how the user is going use your app.

How he or she is going to navigation through all your apps screens.

What he should do to achieve his goal in your app.

It shouldn’t be well designed story.

You don’t need to be good at drawing to design them.

Assignment 3: Create Storyboard for Your Own App

Sketching enables us to explore the problem space and define the solution space at the same time.

It frames our current understanding of the problem, while also helping us to figure out possible solutions.

While we sketch out our thoughts, new ideas will emerge.

Preview 04:52

Yes, now you will have a chance to sketch your app idea by yourself.

Grab pen and paper and start sketch it out.

As always, don’t procrastinate, don’t go anywhere. Just grab pen and paper and start doing stuff.

Assignment 4: Sketch Your App Idea

Go back to the example app, which I am designing for this course, News Reader App, see how they could look like and what you need to include, and try your hands on wireframing.

Create a wireframes for your own app idea, which you have developed in the previous lessons, but, as always, if you don’t have it yet and just want to follow me, you can try to make wireframes for News Reader App.

Assignment 5: Create Wireframes for Your App

I hope you like this Section and learned something new.

I hope that I will see you in the next section, where I will show you the basics of Adobe Photoshop and how to use it in order to create awesome Mobile App Designs.

Final Words on UX

Let's rewind everything what we learned in this section and try to pass the quiz. Good luck and I hope that I will see you in the next section :)

User Experience Quiz
4 questions
+ Photoshop for UI Design
18 lectures 01:03:43
Intro to Photoshop
Learning the Interface

I have added a PSD Photoshop file to the assignments if you want to play a little bit with layers by yourself.


Guides and the grid help you position images or elements precisely. Guides appear as nonprinting lines that float over the image. You can move and remove guides. You can also lock them so that you don’t move them by accident. The Grid is the perfect alignment tool for graphic design, and is very easy to use. By combining the use of the Grid with the “Snap” feature, users can perfectly align objects along grid lines and sudivisions.

Preview 02:35

CTRL + T On Windows, or Command + T if you are using MAC.

Hold down the SHIFT Key if you want to Transform the object without losing shapes / image original proportions.

Hold down SHIFT + ALT (or Option Key on your MAC) and you are going to change the sizing from the center of the shape / image.

Free Transform
Creating the Button
Adding Two Fields

Layer styles are special effects that can be quickly and easily applied to individual layers in Photoshop to drastically change the appearance of something in very little time. They can be preset, customized, or even saved and used for later.

So now, to better demonstrate of what the heck I am talking about, let’s create a simple Rounded Rectangle with rounded rectangle tool.

Intro to Layer Styles
Using Background Image and Overlay to Create a Background for the App
Free Font Lato by tyPoland Lukasz Dziedzic

In this lesson I want to show you how to better use the Type tool to create simple testimonial.

It’s going to an easy one, but you will better understand, type tool options and features in adobe photoshop.

Create a Testimonial

Well, first of all ,what’s masks?

Mainly, it’s the transparency of the layer and how you control it.

It can only have monochromatic colors in grayscale, i.e. between white, black, and the various shades of gray in between.

Preview 03:24

AS we already learnt about layer masks now let’s see what are clipping masks and why do we need them.

So we have our previous amazing picture with superman, but for now, let’s isable our superman visibility.

Grab Type tool and Write something, like SUPERMAN.

Clipping Masks

What’s going on guys and welcome backto my hopefully awesome course.

In this lesson, we are going to create a beatufiul checkbox which can be used for our app design, or, even better, if you create them more and create more GUI elements, which stands for Graphical user interface, you can sell them out in graphic marketplaces like graphicriver.

Alright, also, in this lesson you are going to learn a little bit about paths and how to use a pen tool.

And what a pen tool is with pen tool we are creating a icons or any vector shape which can be used for any graphic creation.

Create a Checkbox

So in this lesson we are going to create a cool looking radial progress bar.

The first thing what we need to do is to grab an ellipse tool right here and drag and create an oval, or circle.

Let’s fill it with a white color.

Create a Radial Progress Bar

Finally, the last lesson in this section for adobe photoshop, is an assignment.

What you see right here is the simple iOS App Screen which looks like an options or settings screen.

So the assignment for you is to recreate this exact screen by yourself in adobe photoshop.

Assignment 6: Re-create this Mobile App Screen
Congratulations! You’re ready for an actual app design!
+ Visual App Design: Login Screen Design
11 lectures 25:55
Searching for Inspiration
Resource for Free Mobile Icons
Finding Free Social Icons on the Web
Starting with our Sketch of the Login Screen
Designing Background for the Login Screen
Adding Status Bar (TeehanLax)
Designing Logo
Creating Two Fields for Email and Password
Creating Login Button
Adding Icons for Logining with Social Accounts
Login Screen Design (Photoshop File)
+ Visual App Design: Topics / Categories Screen Design
6 lectures 25:46
Starting With a Sketch
Creating Top Bar Design
Designing Image for the Topic
Designing Title of the Topic and a Follow Button
Designing Unfollow Button
Add Topics Screen Design (Photoshop File)
+ Visual App Design: News Screen Design
5 lectures 14:29
Creating Top Bar
Creating Image Box
Designing Title
Finnishing the Work
Main News Screen Design (Photoshop File)
+ Visual App Design: News Detail Screen Design
6 lectures 24:09
Creating Top Bar
Creating Image Box
Adding Title, Date and Time
Add Content
Tabs Design
News Details Screen Design (Photoshop File)
+ Visual App Design: Navigation Drawer Screen Design
4 lectures 22:59
Create a background
Add Photo and Name
Filling All Information
Navigation Screen Design (Photoshop File)
+ Making Money With Your New Skills
11 lectures 01:17:13

On GraphicRiver you can sell (or buy) a high variety of graphical elements (from Flyer Designs to Web Elements, such as User Interfaces).

Selling on GraphicRiver
How Does GraphicRiver Work?
How to Promote Your Work on GraphicRiver?
Contests on 99designs (Crowdsourcing Website for Designers)
Winning Tips on 99Designs

Fiverr is a service or a platform, where ordinary people (like us) can sell anything for customers for $5, or even more with extras.

Selling your services on Fiverr (Sell Services for $5 or More)
Selling Tips on Fiverr

Building a successful and well paid freelancing career is easier than you think.

People are thinking that to become a successful freelancer you need to be absolute expert and know everything.

How to Get Started in Freelancing?
Make Money on Elance
Starting a Blog or a Website
$4,000 A Month Guide
3 pages