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.
Are you ready to blow people's minds?
Go from amateur to "iPhone App Design Badass" by using the power of prototypes. Learn to take a blank page and transform it into a complete, high-fidelity, and interactive prototype on your phone.
(Warning: High Risk of Mind Explosions)
I'll walk you through the entire process, while skipping the boring theoretical knowledge. You will go straight to the juicy stuff, and start building the app of your dreams right away. For the prototype, we'll be using the free tool Marvel App (coming soon: InVision) and the design will be build on Adobe Illustrator (free trial available).
So, why did I create this course?
Working as a designer, documentation is often the main deliverable for clients. The problem is that when dealing with complicated interactions, documents get bulky and hard to read (google search: boring). Nobody wants to see an app on paper, they want to play with it on their phone; tap, swipe, scroll, and do a little dance. That’s why I found that creating quick mock-ups and prototypes were a more powerful way of telling a story. People are amazed to see the idea in action and you end up looking like a total champ.
Who is this course for?
This course was made for beginner to advanced designers who want to improve their skill set and want to show how their creations actually feel on a phone. Or for anyone that wants to mock-up their ideas in a realistic way.
Entrepreneurs will find this course useful to bring their dreams to the real world in an easy way. Pitching a prototype to investors will have them writing checks in no time.
This course will also prove valuable for UX and user testing. Upon completion, your designs will be transformed into interactive, high-fidelity products - without the use of expensive programmer$$$.
What you’ll learn
In this course we’ll start from a blank screen until we have a complete iPhone 6 app. You will follow along through the entire process.
We'll build a fashion shopping app following common iOS 8 patterns in navigation, animations, layouts, icons and graphics, buttons, interactivity and even color and typography. We’ll prototype a signup flow, an onboarding screen, discovery flow, search screens, and user settings. We’ll create product detail screens, brand pages, a selection menu, a tabbed menu, an image slideshow, and you'll even be able to put your smiling mugshot as a profile pic. Sweet, right?
Prototyping is powerful
Creating a prototype as a mock-up or final delivery allows for greater interaction with the product and a better understanding of how it works. It's an impactful way to present an experience or tell a story. People know how to interact with products.
Stop documenting. Start prototyping.
Take a look at the introductory video and take my free preview. I look forward to seeing you inside.
Not for you? No problem.
30 day money back guarantee.
Learn on the go.
Desktop, iOS and Android.
Certificate of completion.
|Section 1: Introduction|
Quick tips on how to take this course
|Section 2: Turn paper sketches of a video player into a mobile prototype|
You're going to need a piece of paper, a pen/pencil, and your phone. That's it. Let's get drawing!
Let's start drawing our wireframes
Understanding Marvel App
Taking pics of the sketches with Marvel App
Creating your prototype—Linking screens with hotspots and adding transitions
|Quiz 1||5 questions|
Some easy questions for a smart person like you. A piece of cake, I'm sure ;)
Congratulations! You just finished a whole section. You should be able to create interactive prototypes with simple sketches. Share your work on the discussion board so everyone can see what you accomplished... Oh, yeah. And, here's a little celebration dance just for you ;)
|Section 3: Designing the layout|
Setting up your filePreview
Fonts and logo
First image background
First screen and buttons
Let's see how good you are!
Let's test your skills!
|Section 4: Design the content screens|
Feed Section - Hot
Product Detail - Image Slider
Product Options Panel
|Section 5: Design the user settings screen and final details|
Let's check those artboards!
Icon and Details
|Section 6: Create Prototype on Marvel|
Export and Import
Adding Actions and Transitions
Hotspots on intro
Setting up the signup flow
Hotspots on Feed Section
Setting up Discover, Product, and Brands
|Section 7: Testing your design on your phone and desktop|
Testing on Desktop
Testing on iPhonePreview
|Section 8: Create a signup flow prototype on a whiteboard|
Introduction—What you'll learn and what you need for this sectionPreview
Drawing your signup flow on a whiteboard
Creating the prototype with Marvel App
Creating the prototype with Marvel App (detail screen)
Let's see how good you got!
Hello, I'm Pablo Stanley. I'm a San Francisco based product designer. I love solving design puzzles, making silly illustrations, composing geeky music, creating colorful animated gifs, munching veggie burgers, and writing punny comics.
Mentoring is one of my new found passions. I want to learn and teach as much as I can and Udemy is the best platform for it.
I also write a comic series called “The Design Team”.