charmainetolentino-presto-payment
charmainetolentino-presto-payment
charmainetolentino-presto-payment

Presto, A lifestyle convenience at your fingertips.

active, Launched on 2018
Mobile app
B2C
ecommerce
Payment

Role

UX/UI Designer

UX/UI Designer

Team

  • Project Manager

  • Business Analyst

  • QA Engineer

  • Software Engineer

  • Graphic Designer

  • Sales & Marketing

Project Manager, Business Analyst, QA Engineer, Software Engineer, Graphic Designer, Sales & Marketing

Tools

  • Sketch

  • Miro

  • Jira

  • Confluence

  • Zeroheight

  • Adobe Creative Suite (After Effects, Photoshop, Illustrator)

  • App Analytics

  • Slack

Sketch, Miro, Jira, Confluence, Zeroheight, Adobe Creative Suite (After Effects, Photoshop, Illustrator), App Analytics, Slack

Contribution

  • Human Interface Design

  • UI & UX Audit

  • Rapid Prototyping

  • Rapid Testing

  • Design System

  • User Research

  • Workshop Facilitation

UI & UX Audit, Visual Design, Rapid Prototyping, Rapid Testing, Design System, Human Interface Design, User Research, Workshop Facilitation

Overview

Presto is a social marketing mobile app in Malaysia with an eWallet function that offers various lifestyle features from hassle-free payments, booking a hotel room or movie tickets, food delivery, and quick bill payments.


I joined the Presto team during the pivotal stage of the project — overhaul the mobile app. My role as a designer allowed me to wear many hats, act as a bridge between the end-users and cross-functional teams.

Results

  1. Successfully revamped the mobile app on both iOS and Android. This enhanced the brand perception with a new design identity and features.

  1. Boosted user engagement by 30% after strategic design improvements and UX optimization.

  1. Created the Presto Design System for native mobile app (iOS and Android), this made UI components across platforms coherent and minimize development overhead.

  1. Increase of overall eCommerce sales (15.7K Gift Cards Redeemed, RM 1M Mall Transactions, RM 750k Service Transactions, RM60k Grabbit Games played).

  1. Build 0 → 1 features that help customers with their day-to-day purchase (vending machine payment, eKYC, loans, food delivery, gift cards, inbox and push notification, rewards).

CHALLENGES & process

Before diving into design, we embark on a journey of discovery. Just like tackling any business challenge, we start by truly understanding our users. Through market research, UX studies, and insightful interviews, we build empathy, the fuel for impactful design thinking. Process consist of gathering feedback (from Apple and Google store reviews, internal team and end-users interview), heuristic evaluation, as well as empathy mapping.

The app faced a critical roadblock:

  • Low brand recognition coupled with an uninspiring user experience.

  • Struggles to attract users, boasting a mere 2% signup rate.

  • Abandon carts at an alarming 90%, due to a cluttered interface that makes navigation a chore.

charmainetolentino-presto-collab01
charmainetolentino-presto-collab01
charmainetolentino-presto-collab01
charmainetolentino-presto-collab02
charmainetolentino-presto-collab02
charmainetolentino-presto-collab02
case study 1
case study 1
charmainetolentino-presto-collab05
charmainetolentino-presto-collab05
charmainetolentino-presto-collab08
charmainetolentino-presto-collab08
charmainetolentino-presto-collab08
charmainetolentino-presto-collab07
charmainetolentino-presto-collab07

Final designs

charmainetolentino-presto-mobilescreens
charmainetolentino-presto-mobilescreens
charmainetolentino-presto-mobilescreens

Created a design system for native mobile app.

A design system for Presto mobile app (iOS, Android) was created to keep the interface components and experience consistent across platforms. I use Sketch app to create the tokens and Zeroheight as the repository to make it easier for dev team to access it.

charmainetolentino-presto-colours-typeface
charmainetolentino-presto-colours-typeface
charmainetolentino-presto-colours-typeface
charmainetolentino-presto-components
charmainetolentino-presto-components
charmainetolentino-presto-components
charmainetolentino-presto-mobilecomponents01
charmainetolentino-presto-mobilecomponents01
charmainetolentino-presto-mobilecomponents01
charmainetolentino-presto-mobilecomponents02
charmainetolentino-presto-mobilecomponents02
charmainetolentino-presto-mobilecomponents02

Some of the revamped Presto mobile app screens (Home, Arcade, Pay Bills, Reload, PrestoPay, Transfer, Pay Merchant, Inbox, Settings).

Enhanced home screen to have richer info and content.

  • Focused services with specific components (i.e. shop, travel, and food).

  • Personalized recommendations to consumers

  • Find nearby sale to benefit from E-Vouchers.

charmainetolentino-presto-home
charmainetolentino-presto-home
charmainetolentino-presto-home
charmainetolentino-presto-grabbit
charmainetolentino-presto-grabbit
charmainetolentino-presto-grabbit
charmainetolentino-presto-gamecomponents
charmainetolentino-presto-gamecomponents
charmainetolentino-presto-gamecomponents
charmainetolentino-presto-payment
charmainetolentino-presto-payment
charmainetolentino-presto-payment
charmainetolentino-presto-paymerchant
charmainetolentino-presto-paymerchant
charmainetolentino-presto-paymerchant
charmainetolentino-presto-reload
charmainetolentino-presto-reload
charmainetolentino-presto-reload
charmainetolentino-presto-moneytransfer
charmainetolentino-presto-moneytransfer
charmainetolentino-presto-moneytransfer
charmainetolentino-presto-inbox
charmainetolentino-presto-inbox
charmainetolentino-presto-inbox
charmainetolentino-presto-settings
charmainetolentino-presto-settings
charmainetolentino-presto-settings

PrestoPay in action, Users can top up their PrestoPay and use the wallet credit to purchase selected items by selecting PrestoPay as their payment method during checkout process.

charmainetolentino-presto-fridgepay
charmainetolentino-presto-fridgepay
charmainetolentino-presto-fridgepay
charmainetolentino-presto-payinaction
charmainetolentino-presto-payinaction
charmainetolentino-presto-payinaction
charmainetolentino-presto-shop
charmainetolentino-presto-shop
charmainetolentino-presto-shop
charmainetolentino-presto-event
charmainetolentino-presto-event
charmainetolentino-presto-event
charmainetolentino-presto-mart
charmainetolentino-presto-mart
charmainetolentino-presto-mart

All photos in this section are credited to the original owner/photographer.

Recommendation

"Charmaine joined our team at a pivotal moment, when we were iterating on the initial MVP version of our e-wallet app, Presto. One of the major challenges of our product market was the need to expand to multiple service verticals, and cram all of those services into a single app, and Charmaine played a key role in taking on that challenge and optimising our app's UI/UX for such an app."

Jensen Bryan Ching

Project & Tech Manager @Presto

Role

UX/UI Designer

Team

Project Manager, Business Analyst, QA Engineer, Software Engineer, Graphic Designer, Sales & Marketing

Tools

Sketch, Miro, Jira, Confluence, Zeroheight, Adobe Creative Suite (After Effects, Photoshop, Illustrator), App Analytics, Slack

Skills

UI & UX Audit, Visual Design, Rapid Prototyping, Rapid Testing, Design System, Human Interface Design, User Research, Workshop Facilitation