Skip to main content
Uber logo

Schedule rides in advance

Reserve a rideReserve a ride

Schedule rides in advance

Reserve a rideReserve a ride
Engineering, Mobile

How the Uber Membership Team Developed the ActionCard Design Pattern to Do More with Less

February 2, 2023 / Global
Featured image for How the Uber Membership Team Developed the ActionCard Design Pattern to Do More with Less
Image
Figure 1: Old membership feature screens
Image
Figure 2: Future membership feature screens
Image
Image
Figure 3: Action models
Image
Image
Figure 4: ActionCard screen
Image
Figure 5: ActionCard screen data/layout structure
Image
Figure 6: Complete set of Cards used to create 16 screens
Image
Figure 7: Membership screens built from cards
Image
Figure 8: Data flow for rendering a card screen
Image
Image
Figure 9: Card screen presenter
Image
Image
Figure 10: Example of MessageCard
Image
Figure 11: Making a purchase 
Image
Figure 12: Maintain a small set of simple cards that are easy to reuse
Image
Figure 13: Dynamic flow
Image
Image
Figure 14: Dynamic card updates
Image
Figure 15: Dynamic flow Part 1
Image
Image
Figure 16: Dynamic flow Part 2CancelMembershipAction->successAction(NavigateBackAction-> successAction(RefreshAction))   
Image
Figure 17: Complete cancel membership flow
Andrew Paul Simmons

Andrew Paul Simmons

Andrew Simmons is a Mobile Product Engineer at Uber and is an architect of the ActionCard design pattern used by the Membership Team.

Posted by Andrew Paul Simmons