DesignCast Motion Design Concept

During my time at Pineapple UX/UI Design Studio, I had the opportunity to create a concept motion video for DesignCast, a podcast app dedicated to the world of design. The app curates content across UX, UI, Motion, Visual, and Interaction Design, offering a tailored listening experience for creative professionals.

Objective

The primary goal was to craft a captivating motion design video to serve as promotional material for Pineapple’s Dribbble page. The focus was on bringing the static UI designs to life, showcasing not just the interface aesthetics across both mobile and tablet form factors, but also demonstrating the sophistication of user flows and delightful micro-interactions.

My Role

While the core UI/UX was handled by the talented design team, my role involved collaborating directly with the design director to fully understand the intended experience and objectives. I was responsible for:

• Storyboarding UI transitions and navigation flows

• Designing and animating nuanced micro-interactions

• Ensuring all elements moved with purpose, enhancing clarity and engagement
  
  

Motion & Interaction Techniques

UI Motion & Transitions

• Smooth page transitions highlighting how users discover and interact with podcasts

• Animated navigations showing flow between “Discover,” episode lists, and episode details

Micro-interactions

• Play/Pause button transitions animated for tactile feedback

• Tab and card selections with gentle scaling, fading, or color transitions

• Subtle feedback for user actions like subscribing or marking favorites

Adaptive Layouts

• Side-by-side showcase of both mobile and tablet aspect ratios, emphasizing responsive design thinking

• Seamless transitions across breakpoints to highlight adaptability

Tools & Workflow

• Adobe After Effects: Animation of UI flows, transitions, and high-fidelity motion mockups

• Adobe XD: Extraction of UI assets and orchestration of individual screens

• Iterative feedback sessions with the design director to ensure alignment with Pineapple’s brand vision

Impact

The resulting motion piece captures not just the look, but the feel of DesignCast, emphasizing Pineapple Studio’s attention to detail and commitment to world-class UX/UI. By focusing on motion and micro-interactions, the video serves as a testament to the studio’s strength in elevating digital products beyond static design — positioning Pineapple as a creative leader in functional, memorable user experiences.