Loading Screen

The loading screen features a pour-over sequence as a metaphor for the company’s dedication to deliberate, hands-on craftsmanship and the art of coffee making.

Home Screen

The home screen opens with a handwritten-style greeting, designed to evoke the warmth and personal touch of a note from a barista. This small detail brings the brand’s in-store experience into the digital space, creating an immediate sense of familiarity and connection. I also added a moving gradient to the purchase-related buttons in the Figma file to attract users’ attention.

Confirmation Screen

I designed an animation to visually communicate where an order is within the preparation process. For the case study, the sequence plays at an accelerated pace, but in the actual experience, the cup moves to the espresso machine once the barista takes the ticket and remains there until the drink is marked ready.

Reward Announcement Screen

The 100-Star reward animation was designed to spotlight the experience of earning and enjoying a handcrafted beverage. By framing the scene with coffee plants and beans, the design ties the reward back to the company’s roots in high-quality coffee and intentional craftsmanship.

Review Order Screen

I added animation and visual emphasis to the coupon area to capture attention and guide users toward active promotions, transforming a static element into an engaging moment in the experience.

Pay Screen

I introduced subtle steam animation on the point-of-sale screen to infuse warmth and motion into the checkout experience, transforming a routine transaction into a brief, rewarding moment that reflects the brand’s spirit of hospitality.