Course Information
Registration period
Year-round Recruitment
Course Level
Study Mode
Duration
8 Hour(s) 44 Minute(s)
Language
English
Taught by
Pablo Stanley
Rating
Course Overview
Learn to prototype UI animations and micro-interactions using Sketch, Flinto, Principle, Marvel & Invision Craft Plugin
UPDATE June 2017 - Nested Symbols!
- Creating a Button System with Nested Symbols
- Creating a Left Bar Navigation with Nested Symbols
UPDATE December 27 2016 - New projects!
- Creating an on-boarding parallax animation using Flinto and Sketch
- Drawing Santa on Sketch (Holiday Special)
- The most useful keyboard shortcuts on Sketch
- My Favorite practical Sketch Plugins!
UPDATE July 11th 2016 - New content!
- Added How to add Hover effects on Flinto - Mouse Over / Mouse Out. Great for web design prototypes
- Creating a Parallax UI Animation Using Flinto.
UPDATE July 5th 2016 - New content!
- Added a section covering Principle for Mac.
- 12 videos (over an hour of content)
- How to create character animations
- Parallax Effect using Principle
- Drag And Drop Interaction
- Continuous Interactions like Paging, Scrolling, Dragging.
- Many more!
UPDATE June 18th 2016 - New content!
- Added a section covering Flinto for Mac.
- 9 videos (over an hour of content)
- Connecting Layers, Complex Transitions
- User Interface Cards Flow Animation
- Adding Sound to Your Prototype (and many more)
//////////////////////////////////////
Introduction
Hola, my name is Pablo Stanley. I’ve been a designer for almost 18 years– And I have worked with different startups for quite a while. I want to teach you how to apply the tools I use every day–and I’ll give you some insight into my workflow and process as a product designer.
On this course you'll learn how to design web and mobile products using Sketch 3. We’ll also learn how to prototype full flows and micro-interactions using the most current apps in the industry like Flinto, Principle, Marvel App, and Invision’s Craft Plugin. And the coolest part about this course? We’ll learn how to create detailed UI animations and how to apply them to your projects.
This course is designed in different sections so you can jump around depending on your skill level. You’ll be able to learn how to use the tools to make your own designs from scratch. And we’ll also learn by doing, getting hands-on with more advanced projects.
So, Why Sketch?
Sketch 3 is a design tool focused on user interface and user experience design. Because of its simplicity, it’s really easy to understand; anyone with little to no training can learn Sketch. It’s perfect for designing for multiple mobile devices, working on responsive web design, delivering assets in an easy way, and makes collaboration with developers amazing. It also costs a fraction of the price of Adobe Suite (goodby monthly payment). So yeah, it's pretty cool.
Why Flinto, Principle, Marvel App and Craft by InVision
Principle makes it easy to create animated and interactive user interface designs. Great for Multi-screen app, or new interactions and animations.
Flinto lets designers quickly make interactive prototypes of their mobile, desktop, or web apps.with custom animations, gestures, and Sketch import
This simple editor in Marvel allows you to link all your designs together in seconds, then add gestures and transitions to make your prototype feel just like a real app or website.
This Course
This course covers the basics, but also goes into detail on some advanced features, tricks, and plugins that I use in my daily workflow.
We'll also work on some cool projects that we'll be able to prototype and share on our mobile devices and the web. We'll even do some UI animation and micro-interactions that will make your prototypes look pretty realistic.
Course Content
- 8 section(s)
- 59 lecture(s)
- Section 1 Intro / Promo
- Section 2 Sketch 3 Basics
- Section 3 Sketch 3 Intermediate Level Stuff
- Section 4 Sketch Advanced Stuff
- Section 5 Principle - Simple UI Animation and Prototyping Tool
- Section 6 Flinto - User Interface Animations Tool
- Section 7 Projects
- Section 8 EXTRA: Intro to Design and Prototyping
What You’ll Learn
- Learn the Fundamentals and Some Advanced Tricks on Sketch, Create realistic prototypes for mobile devices and web, Create UI animation and micro-interactions using Flinto, Create UI animation and micro-interactions using Principle, Create simple prototypes using Marvel App
Skills covered in this course
Reviews
-
GGabriel Maldonado
The instructor goes too fast. I have to stop and rewind to figure out what is going on and how the program should work. The lessons are over four years old and some of the plugins and features are out of date or have changed. He also skips over how to do things in a program and does not address them until much later in different lessons. For example, he does not teach you how to align screens in Flinto until lesson 51! Very frustrating!
-
GGuido Baena Wehrmann
Well explained, charismatic person, very useful and practical content, the structure of the course is a bit chaotic though (sometimes it feels like a compilation of different tutorials). Still worth watching!
-
RReed Van Rozeboom
Learned some great animation techniques. There is some content that is less relevant in the course, and I would prefer it if it were a little more distilled and hyper-focused on animation. Good solid content however and an entertaining instructor.
-
SSherri Moss
Instructor is very good. I do have one recommendation. When downloading and using other apps such as Principle and Flinto, please show how to get your work back into sketch. That may seem obvious but it is not to me. Thanks!
