Paprika: The App

UI/UX · Prototyping

OVERVIEW

Nearly 2 years ago, Paprika debuted as a groundbreaking loyalty platform that went on to innovate the way people pay by utilizes Reward Points across offline retailers.

Around mid-2017, the startup pivoted & introduced a cashless, digital payment system at over 300 outlets across Jakarta & Medan. This ranges from restaurants, cafes, and clinics as well as karaoke bars.

OBJECTIVES

In an effort to simplify the development process, we streamlined the design pattern & visual identity across all medium to reinforce the idea of pay effortlessly, with the main goal to simplify payment experience.

The app underwent gradual changes every month - mostly removal of features with low engagements & contents that served little to no purposes in driving conversion rate. In fact, by the time this piece is published, the production version may have been different to a certain extent.

BACKGROUND

Paprika has experienced significant growth in active users within its' first few months, with most marketing effort driven towards merchants partnerships & BTL advertising. 7 months later, the startup began to expand its' operation to the capital of Jakarta - hence presenting an opportunity for us to redefine & refocus the service to a pool of a more tech-savvy, fast-paced audiences.

Highlighting 'Pay Easy' as Paprika's value proposition, the goal of my role is to translate this vision into the digital experience of the payment process. Working tightly with the developer team, the conception interface was mostly aided by data. In this case, we used Mixpanel to learn about general user behaviors.

paprika mobile app

IDENTIFYING ISSUES

During the transition from reward points to cashless payment system, we conducted casual guerilla testing at some shops and approached random customers to identify the general issues of the current app. We found out that the reason people weren't interested to use the app includes: No significant rewards / discounts, lacking physical touchpoints to top up balance, & app onboarding issues.

Internally, developers found it challenging to build UI components efficiently since there design system was pretty much, well, non-existent. Developers have to guess the size of fonts & margins across devices & OS, and there was no shared language between designer & developer on how we can create better digital product in a more effective manner.

image text
image text

SOLUTIONS

Hence, we decided to compile all the key components to display the contents through a unified design system that allows developers to tune its' overall feel throughout Android & iOS. We standardized the typography, margins, color palette, simplified the iconography, as well as introducing style guide / design spec for the sub components within every page.

As for my part, based on the feedbacks from sales team (who were certainly better informed regarding the consumer behavior in qualitative manner) as well as the developers, we reiterated every changes and built rapid prototypes via Adobe XD to clarify the user flow. By providing the general interactive mockup & design spec, the team focused on specific UX issue to be rectified in agile manner. With more structure in terms of visual / UI, course-correcting during the development was much more efficient as components can now be rearranged like lego blocks.

Some rough mockups on how we simulated user flow for certain key features on Adobe XD.

LESSON LEARNED

The app boasted over 70k registered users to date with over 300 outlets accepting Paprika as a method of cashless payment. While the app may have served its' purpose to provide convenience, our biggest challenge so far is to drive & balance the number between partner & customer acquisition. Stay tune.

Check out & download it here

paprika mobile app
← Previous Next →