ℭ. 𝔅ℜ𝔄𝔗𝔗𝔒𝔑
Product Designer @ Google



Facebook
Real Estate
Collaborative Shopping
Profile Selling
Analytics

Starbucks
Android Mobile Ordering
Android Pay
Android for Material
Starbucks Music | Spotify

Etsy
Design Systems
Brand Product


Chase Bratton —
Bio


A professional software product designer somewhere near Lake Washington, Seattle, Washington, USA. A generalist with a flex towards craft, prototyping, design systems and generative work.

Mark

Starbucks Android Pay


Role
Designer on Starbucks Pay redesign for Android


Collaboration
I was part of a team of 3 designers responsible for define a new design system for Starbucks Android’s update for Google Material Design. All 3 designers contributed to the end to end system, with design leads responsible for different core parts of the experience.

Goal
Update the payments feature within Starbucks Android to leverage a newly established design system.

Design Approach
Starbucks cards and the Starbucks loyalty program are an essential part of the brand and it’s history. Customers collect these cards, gift them, and reload to earn rewards for redeeming in-store. When I was approaching the Pay redesign, preserve the card art will making card management and quick access to payments was key to the design. A few designs I made to ensure the design was simple, enjoble and easy to use...

Quick Payments
Starbucks customers are often in a rush during their commute and were looking to get in and out of the store as quick as possible. This informed how we made it as simple as possible to intiate payment with the app, while also accounting for edges that might slow down the payment process:

Customers can swipe between cards to quickly pay with a preferred card, in the case they might have a low balance.



The payment screen (via barcode) could be triggered by tapping the persistent footer button or shaking the app within any screen. This affording quick access to payments.



We provided increased awareness to Starbucks loyalty program rewards on the payments screen to ensure customers redeemed rewards available. We also provided quick access to swithcing between cards without having to tack back and switch. All in the service of speed and simplicity.



Card Balance & Status
Current card balance and a badging system communicate whether a card would be automatically reloaded whenever the balance was low. This prevented buyer suprise or unwanted charges.



1-to-Many Cards Scalablility
Customers often add more cards over time and prefer to change the primary card seasonally. We worked with our partner engineering team to ensure a flexible amount of cards could be supported.



We enabeld the ability to transfer card balance between cards, rather than the previous method of manual cashing out a card balance in-store and reloading onto a new physical card.



Focusing on the Details
Each payments screen was designed with equal focus and attention. Card management in particular was design to be flesible for a large number of cards and flexible set of input fields.