Share Description
In this course, you will learn:
- UX and interaction designers with the skills they need to get up and running with Framer for UX design.
- How to use the visual design tools as well as a little bit of CoffeeScript code to build engaging prototypes.
- How to import assets from programs like Sketch, add animation, and insert interactions.
- New skills and a basic watchOS project you can use as a jumping off point for your own UX prototypes with Framer.
Syllabus:
- Introduction
- Course prerequisites
- Using the exercise files
1. A Refresher on Great UX
- UX courses and inspiration
- Our project UX
2. The Framer UI
- Overview of the interface
- The design section
- The code section
- Importing from Sketch
- The story behind the prototype
3. The Non-Coding Framer Tools
- Second screen with the Design tool
- Third and fourth screen with the Design tool
- Insert animation with Auto-Code
4. Programming Basics and Usage with Framer
- General syntax quick start
- Variables and objects
- Functions and code snippets
5. Finalizing Our Screen Assets
- Create assets for Hunora screens
- Create assets for Clestik screens
- Challenge: Create final screens of the story
- Solution: Create final screens of the story
6. Add Interactions to Our Prototype
- Introduction to interactions
- Introduction to a scrolling component
- Functions for animations and a challenge
- Solution to challenge
7. Add Final Interactions to the Prototype
- Complex interactions: Initialized states
- Complex interactions: Steer right
- Challenge: Complete interactions
- Solution: Complete interactions
