Designer & Interface Animation Consultant
Author, "A Pocket Guide to CSS Animations" (2013) & "Designing Interface Animations
" (to be published this year, Rosenfeld Media)
Great UI animation has both purpose and style. In this workshop you’ll learn how to design and prototype interface animations that do both, and do them well.
You’ll learn how to identify where animation can improve the user experience and how to fit animation into your design process. Using hands-on projects we’ll prototype and design animations using CSS animation, then evaluate our designs as a group. By the end of the day you’ll be an animation and UX pro!
This workshop is for product designers, web designers, and UX designers looking add animation to their work in meaningful ways.
What you’ll learn in this workshop
What you'll need for the workshop
- The basics of animating with CSS and using it to prototype animation ideas
- The brain benefits of animation
- Design problems animation can solve
- Storyboarding & prototyping interface animation
- Traditional animation techniques worth stealing
- Principles of interactive animation
A laptop with a text editor and a current version of Chrome or Firefox will be needed to participate in the workshop exercises. A (free) Codepen.io account will be necessary to follow along with the exercises’ starter code and demos.
This is a full-day workshop.
Breakfast and lunch will be provided. Please let us know if you have dietary restrictions. We'll have an "All-American" buffet breakfast in the morning and an assortment of boxed lunches (turkey club/roasted vegetable wrap/roast beef ciabatta).
- 8:45am-9:30am Breakfast and networking
- 11am Morning break
- Noon Lunch break
- 4pm Afternoon break
- 5pm Wrap-up
Red Hat Annex
190 E Davie St
Raleigh, NC 27601
The closest parking decks are Blount Street Deck (the top parking symbol) and City Center Deck. Entrances are indicated with the arrows. Both decks cost $2/hour. On-street metered parking is $1/hour. For more parking info, see Downtown Raleigh Parking