Back to top
1Introduction
2Solution
3Conclusion
1Introduction

Change Theme

0:00/1:34

Writing

Writing

Gallery

Gallery

Change Theme

Change Theme

indiana university
indiana university

Guiding students to design with Motion and not just Visuals

2 mins read

Timeline

August 2024 - May 2025
(One Academic Year)

Students

40+ Undergrad and Graduate Students in Media Arts and HCI

My Role

Motion Design

Prototyping

Interaction Design

Teaching

Tools

Figma and FigJam

Adobe Creative Suite

Lottie

Maya

Blender

MilaNote

Overview

For two years, I co-taught Motion Design at Indiana University with Joshua Berkley, where we taught motion design and guided HCI and Media Arts students to apply it in their own contexts.

My job was to design motion graphic demos and interactive prototypes for class, grade assignments, and give ongoing feedback to students.

Outside of class, I also took extra lectures, and kept a curated playlist for tutorials and inspiration.

I hope through this, I was able to show my students how motion design can strengthen their visual storytelling and help them visualize how their designs flow.

Challenge

Designing for Two Audiences

The course drew students from two very different programs.

HCI Student

You love hover effects,

don’t you?

HCI Student

You love hover effects,

don’t you?

HCI Student

You love hover effects, don’t you?

Comfortable with UX and research, but unfamiliar with motion design and animation principles.

Media Arts Student

Bet you’re here for the

animations.

Media Arts Student

Bet you’re here for the

animations.

Media Arts Student

Bet you’re here for the animations.

Knows animation and visuals, but has little awareness of UX or Product Design.

Our challenge was to run a single course where both groups could grow in areas they weren’t familiar with.

approach

Hands-On, Resource-Driven Teaching

To bridge this gap, we designed the course around hands-on practice, accessible resources and continuous feedback.

Motion Graphics demo showcasing storytelling through animated visuals and transitions.

After Effects demo showcasing puppet illustration, rigging, and animation to teach animation principles.

Each week, I built prototypes in Figma and motion demos in After Effects to show how motion connects visuals, usability, and interaction. These gave HCI students visual references, and showed Media Arts students product-focused use cases.

Figma demo showcasing screen transitions and animated UI elements for interaction design.

Lottie demo showcasing an animated logo for seamless integration in products.

I also took extra classes on Interaction Design, and gave continuous feedback through grading, regular check-ins and critiques to keep students steadily improving.

Motion Graphics Tutorials

Inspiration for Motion Design

And finally, I curated two ongoing playlists, one with tutorials for learning more tools and tricks, and one with examples to spark ideas, so students could continue learning beyond class.

result

Progress You Could See

Over two semesters, I taught 40+ students through this approach.

HCI students became more confident with After Effects and adding motion to their designs, while Media Arts students started exploring and applying their animation skills to product design.

Below is some of

takeaways

What I learned

Teaching is also designing

Designing learning experience for students with different skill sets taught me the value of understanding diverse user needs.

Explaining motion made me better at it

Breaking down tools and workflows for students pushed me to rethink how I use motion to communicate ideas.

Meet people where they are

Teaching students from two very different backgrounds showed me the value of empathy and adaptability.

Good documentation scales impact

The demos, playlists, and guides I created ended up helping multiple classes, proving how important good documentation is for lasting impact.