Design and Prototype an iOS8 Mobile App on Illustrator
4.7 (76 ratings)
Instead of using a simple lifetime average, Udemy calculates a 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.
4,174 students enrolled
Wishlisted Wishlist

Please confirm that you want to add Design and Prototype an iOS8 Mobile App on Illustrator to your Wishlist.

Add to Wishlist

Design and Prototype an iOS8 Mobile App on Illustrator

Create beautiful, high-fidelity iOS8 app prototypes with interactions and transitions. No coding skills required.
4.7 (76 ratings)
Instead of using a simple lifetime average, Udemy calculates a 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.
4,174 students enrolled
Created by Pablo Stanley
Last updated 4/2015
English
English
Price: Free
Includes:
  • 5.5 hours on-demand video
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
What Will I 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
View Curriculum
Requirements
  • Free Marvel App account
  • Free Dropbox account (minimum)
  • Illustrator CS6 or higher
  • Basic knowledge of Mac/PC operative systems
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.

Who is the target audience?
  • Graphic Designers
  • UX designers
  • Entrepreneurs
  • Anyone that has an idea for an app
  • UI designers
Students Who Viewed This Course Also Viewed
Curriculum For This Course
41 Lectures
05:32:15
+
Introduction
2 Lectures 04:50
Introduction
03:14

Quick tips on how to take this course
01:36
+
Turn paper sketches of a video player into a mobile prototype
6 Lectures 18:45

You're going to need a piece of paper, a pen/pencil, and your phone. That's it. Let's get drawing!

Introduction—What you'll learn and what you need for this section
01:28

Let's start drawing our wireframes
07:26

Understanding Marvel App
01:43

Taking pics of the sketches with Marvel App
01:28

Creating your prototype—Linking screens with hotspots and adding transitions
05:56

Some easy questions for a smart person like you. A piece of cake, I'm sure ;)

Let's see how good you got!
5 questions

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 ;)

Congratulations - You finished your first section!
00:44
+
Designing the layout
9 Lectures 01:10:59
Setting up your file
02:32

Setting colors
05:25

Fonts and logo
01:57

First image background
05:02

First screen and buttons
09:18

Let's see how good you are!
2 questions

Introduction flow
05:23

Signup flow
10:26

Onboarding flow
23:20

Tabbed navigation
07:36

Let's test your skills!
2 questions
+
Design the content screens
8 Lectures 01:49:15
Feed Section
23:09

Feed Section - Hot
07:46

Discover Section
11:14

Product Detail
19:43

Product Detail - Image Slider
04:38

Product Options Panel
09:26

Quick quiz!
1 question

Search Section
17:21

Brands Section
15:58
+
Design the user settings screen and final details
4 Lectures 27:25
Let's check those artboards!
01:28

User Section
09:01

Settings Section
09:50

Icon and Details
07:06
+
Create Prototype on Marvel
6 Lectures 01:00:34
Export and Import
12:11

Adding Actions and Transitions
08:54

Hotspots on intro
02:03

Setting up the signup flow
07:45

Hotspots on Feed Section
06:57

Setting up Discover, Product, and Brands
22:44
+
Testing your design on your phone and desktop
2 Lectures 12:34
Testing on Desktop
08:35

Testing on iPhone
03:59
+
Create a signup flow prototype on a whiteboard
4 Lectures 27:53
Introduction—What you'll learn and what you need for this section
01:32

Drawing your signup flow on a whiteboard
11:18

Creating the prototype with Marvel App
07:22

Creating the prototype with Marvel App (detail screen)
07:41

Let's see how good you got!
3 questions
About the Instructor
Pablo Stanley
4.4 Average rating
2,956 Reviews
41,014 Students
6 Courses
Product Designer

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”.