Design and Prototype an iOS8 Mobile App on Illustrator (Udemy.com)
Create beautiful, high-fidelity iOS8 app prototypes with interactions and transitions. No coding skills required.
Created by: Pablo Stanley
Last updated April 2015
Our take
Based on the ratings of 373 students, a sample of their written reviews and the syllabus, as the course stood in April 2015. No course pays to be reviewed.
A free, 5.5 hour walkthrough of building a fashion shopping app from a blank artboard to a tappable prototype on a phone. The design work happens in Illustrator, and the prototype is stitched together in Marvel, so there is no code anywhere. Pablo Stanley, a San Francisco product designer, teaches it in a follow-along style that reviewers describe as natural and on point. It suits designers or founders with an app idea who want to see how a screen design becomes something people can actually tap and swipe.
Students mostly like it. The 4.1 rating across 373 reviews holds up, with 324 of those at four or five stars, and reviewers say the structure is clear and the videos are well made. The complaints are consistent, though. Two reviewers find the background music makes the narration hard to follow. A reviewer who has used Illustrator for years calls the pace slow and wanted more app-specific design thinking; another simply says move faster. Two more grumble that the instructor keeps changing things mid-design. One two-star review lists blurry videos, a missing artboard, and a Marvel interface that no longer matches what's on screen, which points at the real issue: the last update was in April 2015.
Age is the main caveat. iOS 8 patterns, iPhone 6 screen sizes and a Marvel workflow from 2015 look dated next to the Principle and Flinto courses it sits beside in our interaction design list. As a free primer on the mindset of prototyping, and on turning paper sketches into clickable flows, it still earns its place. Treat the specific tool steps as a rough guide rather than gospel, and expect to adapt them to whatever Marvel looks like today.
Pros
- Free, and builds one complete fashion shopping app from blank artboard to a tappable phone prototype
- No coding at all: Illustrator for the screens, Marvel hotspots for the transitions and interactions
- Reviewers call the teaching natural, on point and well organized, with good video quality
- Includes a paper sketch to prototype section, handy for testing an idea in an afternoon
Cons
- Last updated in 2015: iOS 8 patterns and a Marvel interface that no longer matches the videos
- Background music is loud enough that some reviewers struggle to hear the narration
- Too slow for people who already know Illustrator, with little app design theory to make up for it
The course itself is very good, however there is a background song playing that sometimes is quite hard to understand the instructor.
Listed as all levels; one reviewer calls it basic but easy to follow. You need Illustrator CS6 or newer and free Marvel and Dropbox accounts.
What you will learn
- Know how to create iPhone 6 screens and assets
- Prototype complex flows easily
- Simulate iOS8 transitions and interactions
- Put their creations on a phone
Course content
8 sections · 41 lectures · 5.5 hours of video 5 quizzes
- 1Introduction 1 free preview2 lectures · 5 min
- 2Turn paper sketches of a video player into a mobile prototype 2 free previews6 lectures · 1 quiz · 19 min
- 3Designing the layout 2 free previews9 lectures · 2 quizzes · 1.2 hours
- 4Design the content screens8 lectures · 1 quiz · 1.8 hours
- 5Design the user settings screen and final details4 lectures · 27 min
- 6Create Prototype on Marvel6 lectures · 1 hour
- 7Testing your design on your phone and desktop 1 free preview2 lectures · 13 min
- 8Create a signup flow prototype on a whiteboard 1 free preview4 lectures · 1 quiz · 28 min
Who it is for
The instructor says it suits
- Graphic Designers
- UX designers
- Entrepreneurs
- Anyone that has an idea for an app
- UI designers
What you need before you start
- Free Marvel App account
- Free Dropbox account (minimum)
- Illustrator CS6 or higher
- Basic knowledge of Mac/PC operative systems
Course Description
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.
- Design iOS assets from scratch using flat design (so trendy).
- Create complete flows and pixel-perfect screens (so sharp!).
- Prototype your creation on any smartphone (so smooth).
- Reproduce amazing transitions and interactions with no coding at all (so smart).
(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.
Instructor Details
- 4.1 Rating
373 Reviews
Pablo Stanley
Hello, I'm Pablo Stanley. I'm a San Francisco based product designer. I'm the designer and cofounder of a healthcare startup in San Francisco called Carbon Health. 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”.
More courses by Pablo Stanley
UI Animation using Sketch 3, Principle App, and Flinto (2018)
4.6 (1,105 Reviews)
Provider: Udemy
Time: 8.7h
$54.99
Create hand drawn character animations using Photoshop (2016)
4.5 (532 Reviews)
Provider: Udemy
Time: 5.2h
$59.99
More Illustrator courses
Adobe Illustrator Advanced Vector Artwork (2020)
4.8 (1,988 Reviews)
Provider: Udemy
Time: 8.3h
$84.99
Adobe Illustrator - Beginner to Pro Level With New AI (2026)
4.8 (1,368 Reviews)
Provider: Udemy
Time: 13.7h
$89.99
How to create flat design icons in 15 minutes in Illustrator (2023)
4.8 (335 Reviews)
Provider: Udemy
Time: 5.4h
$124.99
【한글자막】 Adobe Illustrator CC - 필수 스킬 모두 마스터하기 (2024)
4.8 (117 Reviews)
Provider: Udemy
Time: 7.5h
$59.99
Reviews
By Jared Neely on 6/30/2018
So far the course is super helpful in making a prototype of a app. I am really enjoying it!
By Moon Lee on 4/24/2018
Hate the Background music watching fast speed, and presentation change here change there, made me sick (like delete icon created @Export and Import). Missed 1 Brands section Artboard in Video. Advertising using Marvel app link screens using Hotspots. But Marvel Prototyping (2 Projects only for Free tested on desktop) Interface procedures different from videos shown. Cannot download project, only can have link (Need to pay). No less 3 minutes or less videos direct to point. Blur videos in some contents.
By Kev Master on 4/1/2018
i know how to pen and paper, move faster pls...
By Musa B sesay on 1/10/2018
thanks for teaching me the basic of prototyping especially the aspect of physical draw and illostration most my work as a developer I just learning to code most time but no knowledge of illustrating ideas simple as u did now I have the concept of designing simple ideas , prototype and programming because most time when u startup new idea or small project u don't have the resource to hire expert to do some work for you as a developer is very important to learn multiple skills thank you
By Bruno Campos on 10/24/2017
The course itself is very good, however there is a background song playing that sometimes is quite hard to understand the instructor. Especially when you like me, are taking the lectures while using the subway public transport.
By Ellaine Escueta on 7/7/2016
This is a great way to understand the basics of building a functional prototype for an app. The tutor occasionally talks low throughout the video, and the background music ends of drowning him out at times, but other than that its a great lesson.
By Kereem Adams on 3/17/2016
This course was very detailed and the first UX to illustrator/Photoshop course I was able to complete properly. Five stars all the way, I am definitely gonna check out your apple watch course now
By Todd Fisk on 3/5/2016
I would recommend this training, but I don't love the class (for style reasons like the background music and the superficiality of the example app -I find both annoying). What I think is good is he takes you through a fairly full app prototype, and it's a useful experience just to go from start to finish. So overall it's a good course.
By Theo Palios on 2/4/2015
I took this course as a web designer who wanted to design a mobile app for the first time and see how it works. It didn't only helped me to achieve that but i also succeeded on an essay for my university using the marvel app for prototyping. Highly recommended course.
By Adam Treister on 11/24/2014
I signed up for this course after seeing a promotion online, and am surprised by how easy it is to pick up some of these skills. I like the pace of the course, especially how it focuses on only the important tactical portions - and skips the theoretical jargon that no one needs to use anyway. I would definitely purchase another course if you launch it.
Quality Score
No CourseDuck member has rated this course yet. Taken it? Give each part a thumbs up or down.
Overall Score : 82 / 100








