End to end client project

End to end client project

Animation Flow - creative ecosystem

Animation Flow - creative ecosystem

Overview

Overview

Animation Flow is a learning platform and creative community where aspiring animators learn from industry mentors, grow their skills through guided projects, and showcase work through public profiles.


As the sole designer, I partnered with the educator and developer to build a platform from zero, crafting everything from user flows and dashboards to visual systems and gamification mechanics.

Animation Flow is a learning platform and creative community where aspiring animators learn from industry mentors, grow their skills through guided projects, and showcase work through public profiles.


As the sole designer, I partnered with the educator and developer to build a platform from zero, crafting everything from user flows and dashboards to visual systems and gamification mechanics.

Impact: Beta site active with 30+ active students, 80+ migrating, and 40+ custom pages—boosting engagement through modular learning, a unified dashboard, and gamified features.

Approach

Approach

UX / UI / Research

Interaction Design

UX / UI / Research

Interaction Design

Figma, Miro, Notion

Figma, Miro, Notion

Sole Designer

Sole Designer

The Opportunity: A creative ecosystem

The founder—a widely followed animator—had been teaching across Patreon, YouTube, and Zoom. Students were scattered across clunky platforms and disconnected forums.


Our goal was to build an online space for learning that empowers both students and mentors through structure, creative freedom, and visibility.

The founder—a widely followed animator—had been teaching across Patreon, YouTube, and Zoom. Students were scattered across clunky platforms and disconnected forums.


Our goal was to build an online space for learning that empowers both students and mentors through structure, creative freedom, and visibility.

My Role: End to end platform design

As the sole designer, I led every aspect of design in:

User journeys for students, mentors, and guests

Information architecture across content-heavy flows

Gamification mechanics: coins, rewards, and storefront

Real-time prototyping and iteration with the developer

Design Strategy: Structure Meets Creative Flow

Animation Flow needed to support a nonlinear, iterative learning style while maintaining clarity and motivation. My goal was to build a platform that encourages progress without pressure.

Long-term engagement over streaks

Feedback loops over one-way content

Community visibility over isolated learning

These insights guided the design of a solution that offers real-time feedback and AI-driven recommendations to keep users on track with their goals.

These insights guided the design of a solution that offers real-time feedback and AI-driven recommendations to keep users on track with their goals.

Design Solution and Key Features

✦ Course Experience

Traditional education platforms often force linearity. Animation Flow supports exploration, iteration, and focus.

  • Modular lesson navigation with jump-in-anywhere flexibility

  • Built-in project submissions and mentor feedback tools

  • Distraction-free layouts for deep creative work

✦ Course Experience

Traditional education platforms often force linearity. Animation Flow supports exploration, iteration, and focus.

  • Modular lesson navigation with jump-in-anywhere flexibility

  • Built-in project submissions and mentor feedback tools

  • Distraction-free layouts for deep creative work

User Testing and Iteration

We worked in fast loops to prototype and build to launch our beta version. Feedback from 10 students and 1 mentor helped refine our iterations.

Before

Feedback: Early users looked for past progress or momentum from the main page, which gave me the idea to improve on a dashboard.


Feedback: Users wanted access to updates on courses and reminders on classes.



After

After

Improvement: Based on user feedback, I redesigned the dashboard to include a learning timeline, activity, and course history, making it a hub for creative progress.

Improvement: Created a comprehensive dashboard that included timeline with activity history, as well as dynamic learning path.


Impact

Animation Flow is live with its first cohort of students and mentors. Upcoming features include:

  • Live mentor Q&As

  • Advanced critique tools

  • Expanding the storefront into a creative marketplace

Future Considerations


  • Simplicity & Transparency: By focusing on clear communication and simplicity, we made complex financial data accessible, empowering users to make informed decisions.

  • AI-Driven Personalization: This project demonstrated the power of personalized AI to offer users a proactive, adaptive experience that adapts to their unique financial behaviors, leading to better financial outcomes.

  • Fintech Competitiveness: In an increasingly competitive fintech industry, this solution stands out by offering a truly dynamic, AI-powered assistant that evolves with users’ needs and provides real-time, actionable insights.

© 2024 Pamela Hsiung