Mobile Design: Learn UX/UI and Start Your Freelancing Career
course's star rating by considering a number of different factors
such as the number of ratings, the age of ratings, and the
likelihood of fraudulent ratings.
Find online courses made by experts from around the world.
Take your courses with you and learn anywhere, anytime.
Learn and practice real-world skills and achieve your goals.
JOIN OVER 3400 SUCCESSFUL STUDENTS WHO HAVE ALREADY TAKEN THIS COURSE!
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!
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!
Not for you? No problem.
30 day money back guarantee.
Learn on the go.
Desktop, iOS and Android.
Certificate of completion.
|Section 1: Getting Started|
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 ;)
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.
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.
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.
What is User Interface Design?
What is User Experience Design?
UX vs UI
|Quiz 1||4 questions|
In this quiz you are going to rewind your knoledge and try to answer some of those questions of this particular section. Good luck!
|Section 2: Starting From Idea .....|
A Great Imagination and How to Come Up with an App Idea)
Identify Target AudiencePreview
Why Should You Identify Target Audience?
What After That?
Assignment 1: Come Up with Your Own App Idea
|Quiz 2||3 questions|
Let's rewind everything we learned in this section and try to pass the quiz. Good luck, folks!
|Section 3: UX Planning, Research, Storytelling, Sketching, Wireframing|
How to Improve Login Form?Preview
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.
We have a couple of options to change in this checkout form for Mobile Application:
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?
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
I hope you doing fine and maybe want to make something on your own. Right?
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.
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.
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.
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.
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.
|Quiz 3||4 questions|
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 :)
|Section 4: Photoshop for UI Design|
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.
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.
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.
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.
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.
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.
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.
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.
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.
Congratulations! You’re ready for an actual app design!
|Section 5: Visual App Design: Login Screen Design|
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)
Creating Two Fields for Email and Password
Creating Login Button
Adding Icons for Logining with Social Accounts
Login Screen Design (Photoshop File)
|Section 6: Visual App Design: Topics / Categories Screen Design|
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)
|Section 7: Visual App Design: News Screen Design|
Creating Top Bar
Creating Image Box
Finnishing the Work
Main News Screen Design (Photoshop File)
|Section 8: Visual App Design: News Detail Screen Design|
Creating Top Bar
Creating Image Box
Adding Title, Date and Time
News Details Screen Design (Photoshop File)
|Section 9: Visual App Design: Navigation Drawer Screen Design|
Create a background
Add Photo and Name
Filling All Information
Navigation Screen Design (Photoshop File)
|Section 10: Making Money With Your New Skills|
On GraphicRiver you can sell (or buy) a high variety of graphical elements (from Flyer Designs to Web Elements, such as User Interfaces).
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.
I am passionate mobile UX/UI designer and Front-End Developer who firmly believes that a well-designed apps are just as important as well-built apps. User experience design is all about creating relationships between the users and technology because users want more than "pretty" and full of features product. Users need to successfully complete their goals and certain tasks.
Since I do care about how the mobile application works and how it looks I also have over 5 years of experience in front-end development industry. My workflow involves going from initial app idea to the polished and well-developed app. I have developed and maintained various Android apps for clients and for my own projects.