KPB-Case-study-cover

Mobile & Web App Design

Client
5

Attra

Tools used
5

Adobe XD

5

Miro

Deliverables
5

Styleguide

5

Hifi Mockups

5

Prototype

Overview

Attra is a service-based company in the B2B domain. They specialize in the banking, finance, and payments industry. To showcase their expertise in the payment domain, they wanted to launch a payment app for in-house employees. The idea was to integrate their rewards system and provide employees with a more convenient way to make payments to the office vendors in the cafeteria and promote domain expertise and branding.

Challenges

M

Employees rewards platform was difficult to access

M

Failed transaction due to poor network connectivity

Solution

N

QR based payment app

N

Redeem rewards to wallet

N

Pay later option, incase of network issues

My Role

  • User Experience
  • Visual Design

Creative process

Since the project had a short timeline for launch, the process I followed was Double Diamond as it helped to align with stakeholders the work we will be doing in each phase and the value we can have by following the same.

Research

strategy-workshop

After discussing the project requirement with the project manager and business head, I started to interact with our employees to understand what challenges they face to make payments and the issues faced to interact with the rewards portal. The purpose of this research was to figure out the below areas.

  • To deep dive into the user’s actual needs, how they are dealing with the present situation, and what ideas they have to improve the challenge they are facing
  • To understand user’s reactions to integrating a rewards system into a payment app, which could also help them with coupons and offers in day-to-day transactions.

The process I used to conduct my research findings was MVR (Minimum Viable Research) as I needed to validate my hypothesis and have some insights to share with the stakeholders.

During the research, I observed that most of the users were not much interested in using a separate payment system, even though there were instances of failed and delayed transactions. But when they realized that the organization was also planning to integrate our reward system where they can avail of discounts and offers, they seem to like it.

Also, as mentioned, employees were very hurt as they were sometimes failing to redeem their rewards on time, with no reminder.

Define

In this phase, we actually did multiple ideations and brainstorming session with stakeholders. The goals of this process was to figure out the below areas.

  • To define the user’s journey and map out the activities.
  • To understand different tasks user might be willing to perform by creating User stories & HMW (How Might We) questions.

The product was designed for three different roles. One for the employees (user) and the other two for admin, agents with different tasks.

For users
  • Make payment for any purchase
  • Redeem rewards in the wallet
  • Apply coupons/offers in the transactions
  • Users can Pay later if required for situations like poor network or failed transaction
For admin
  • Approval for the vendors onboarding
  • Tracking of all users detail
  • Tracking of any disputes between vendors and employees
For Agents/Vendors
  • Payment accept
  • Offer discount
  • Menu uploading
  • Transaction details

Design

We started with creating the information architect, followed by wireframes to validate the content layout for the app. After creating the hifi mockups I also performed Usability to validate the designs.

Usability findings
Color scheme

The color scheme used was the brand colors.

color palette
Typography

Typography used was Source Sans Pro

KPB-typography

Admin Dashboard

Profile
Homepage
Profile

Usability findings

Q

Unclear, with profile and homepage

Q

Offers from vendors were difficult to find

Q

Transaction details was in side nav

User app (Employees)

Homepage
Homepage
Profile
Profile

Key impact

Once the app was launched, it was observed that there were still disputes in transactions, however, the wait time was reduced for both employees and vendors, as the Pay Later feature eased the transaction. Also, there was a great response due to rewards redemption and discounts.

  • Failed transaction – 55%
  • Wait time – 35%
  • EMPLOYEE SATISFACTION – 75%

Other projects

Jotlines-Works-Cover
Jotlines

UI/UX Design, Web Design

Helped with UI/UX solutions by designing a mobile app for students where notes can be made easily available.

FCI-dashboard-works-cover
FCI Dashboard

UX Design

Helped in designing the dashboard for displaying internal business unit performance in one single platform.

Thanks for viewing

Have a project in mind? Let’s get to work!

I’m here to help. Just answer a few simple questions to help me understand about your requirements and we can take it forward from here.

Join the community

Find me on