Overview
-
Learn how to use Framer in your UX design process. This course shows how to build UX prototypes complete with interactions and animation.
Syllabus
-
Introduction
- Welcome
- Course prerequisites
- Using the exercise files
- UX courses and inspiration
- Our project UX
- Overview of the interface
- The design section
- The code section
- Importing from Sketch
- The story behind the prototype
- Second screen with the Design tool
- Third and fourth screen with the Design tool
- Insert animation with Auto-Code
- General syntax quick start
- Variables and objects
- Functions and code snippets
- Create assets for Hunora screens
- Create assets for Clestik screens
- Challenge: Create final screens of the story
- Solution: Create final screens of the story
- Introduction to interactions
- Introduction to a scrolling component
- Functions for animations and a challenge
- Solution to challenge
- Complex interactions: Initialized states
- Complex interactions: Steer right
- Challenge: Complete interactions
- Solution: Complete interactions
- Next steps
