Menu Close

Project Goal

Design a solution for the single page shopping cart experience with Payment Gateway, which will help Merchants to create a single page shopping cart experience, where he can display the details of products along with payment options. The solution should help merchants to customize the page in a way that he can apply his branding theme to make it look like a shopping cart page .

The solution should be for the web, which will help merchants  to set up a single page shopping cart experience (which can be used for various use cases like donations, fee collections, selling tickets, products, goods etc.) with zero coding and minimal effort. Also, provide a solution where merchants can keep track of transactions and refunds for the same.

Role & Duration

Duration : 3 Months

Timeline : Nov 2022 – Jan 2023

Role : UX Designer

Problem Statements

1 Merchant face challenges when it comes to sale product in online
1. Merchant’s experience from within the Acme Payment Gateway Dashboard to configure and set up his Shopping Page with listing
options for his product type (e-commerce goods, donation, fee collections, selling tickets etc.).
2. Merchant’s experience from within the Acme Payment Gateway to view information related to transactions, refunds or any other
information pertaining to his Payment Page.
3. Customer’s experience of the Shopping Page set up by the merchant, and his/her payment checkout experience.
4 Create a single page shopping cart experience
 

How it works

Create Account Payment Gateway
Create a payment page
Share payment page
Receive Payment
Check payment insight

Design Process

DISCOVER

Market research
Competitor Analysis
User Research

DEFINE

Affinity
Analysis
Personas

IDEATE

Brainstorming
Task flows
Information Architecture

DESIGN

Wireframing
Prototype
Hi-Fi

Market Research

India is home to the highest consumer ecommerce growth rate in the world.1 This market has seen explosive adoption of digital money and smartphones over the last five years2 and the Covid-19 pandemic has further accelerated this trend.

The government and private firms are working hard to bring more of Indian’s population online through initiatives like Digital India. These efforts are critical for tapping into India’s young, internet-hungry population and growing middle class. Of India’s 1.4 billion people, 735 million are still lacking Internet access.3 India’s near-term economic growth will be driven by how many people it can bring online.

At A Glance

Population: 1.4 billion1
GDP per capita: $2,015.594
eCommerce market value: $36.5 billion1
Mobile commerce market value: $16.8 billion1
% of population using the internet: 50%5
% of population with mobile phones: 29%6
% of population with bank accounts: 79.9%1
% of population with credit cards: 3%7

India eCommerce Data

eCommerce revenue (2017): US$39 billion3
Projected ecommerce revenue (2020): US$120 billion3
Average annual ecommerce revenue per user: $338.241
% of ecommerce purchases that are cross-border: 74%1
% of population shopping online: 28%9

Top Payment Methods by Percent of Total Online Spending

Card: 29%
Digital wallet: 25%
Bank transfer: 20%
Cash: 17%
Other: 9%

Consumer Online Buying and Payment
Data
 https://www.jpmorgan.com/merchant-services/insights/reports/india
https://qz.com/india/1746910/cashless-payments-growing-faster-in-india-than-almost-anywhere-else/
https://www.cci.gov.in/sites/default/files/whats_newdocument/Market-study-on-e-Commerce-in-India.pdf
https://data.worldbank.org/indicator/NY.GDP.PCAP.CD?locations=IN
https://www.statista.com/statistics/792074/india-internet-penetration-rate/
https://www.statista.com/statistics/257048/smartphone-user-penetration-in-india/
https://www.theglobaleconomy.com/India/people_with_credit_cards/
https://qz.com/india/1743022/upi-now-fulfils-over-half-of-all-digital-payments-in-india/
https://www.statista.com/topics/2454/e-commerce-in-india/
https://www.ibef.org/download/E-Commerce-December-2019.pdf

Key findings

  • After the Unified Payments Interface (UPI) 2.0 launch in 2018, UPI and has become the foundation of eWallet growth stories like Google Pay, WhatsApp Pay, Flipkart’s PhonePe, and even India’s longtime leader Paytm.
  • Cash on delivery remains incredibly popular — so savvy merchants will offer customers a variety of payment options.
  • Consumer preferences indicate a strong demand for digital payment methods
  • A customer is not looking to make a payment. Paying is just a means to complete his primary objective
  • According to Baymard Research — the global average cart abandonment rate currently sits at 68.8%.

Merchant’s problems

  • To set up and operate quick and easy shopping pages sell products
  • High failure rates : Between 40–45% of online transactions fails.
  • Accepting payments online without the overhead of website design
  • Complicated refunds and cancelations
  • Listings or service listings without having to have a website

User’s payment problems

  • Time consuming : Paying with Debit/Credit cards is time consuming because of the 2 factor authentication. Net banking is the same. Wallet’s need recharging. UPI is the fastest of them all but still not fast enough.
  • Security : People are afraid to give any of their bank/card details because of potential fraud. Adding to the complexities that they have to go every time they have to make a payment.
  • Payment failures: User’s are also at the receiving end of the 40–45% of payment failure rates.
  • Refunds and cancelations :User’s have limited transparency on how refunds and cancelations are handled.

Competitor Analysis

While doing research found some Direct competitors who have some strength on there application I used this method to compare other payment application in the market. The analysis helped me to come up with the most important features to add and changes done the app.

Affinity Analysis

Persona

Created a provisional persona for a typical user for Acme payment gateway based on user research

Merchant Persona
Customer Persona

Findings

At Simpl we didn’t want to build something that will just be an improvement to the current payment experience. We wanted to reimagine the whole experience

Single page shopping cart experience can make it simpler and more convenient for your customers to purchase on online platform. Each year, more business shifts to ecommerce stores as customers shop digitally. Instead of stocking shelves and designing aisles, ecommerce need to create an online experience that customers find enjoyable, convenient, and efficient, from easy to checkout.

Benefits of a single page shopping cart experience

Less steps and fewer clicks: Customers want the path of least resistance; reducing steps – and clicks – will keep the checkout process short, simple, and frictionless, making it more appealing to customers.
Speed and efficiency: A single checkout page saves time on load screens between payment pages, reduces navigation time, and removes the need to go back and forth between screens to correct or update information.
Ease of use: By their nature and design, Single-page checkouts are easier to use for customers, with limited steps being required of the customer. All form fields are in one place so you can enter information at your own pace and in your own order.
Clear navigation: Single-page checkouts feature clear navigation as you don’t need to navigate through multiple pages and steps. Whether you’re using a traditional one-page checkout or an accordion style checkout design, navigating the payment process is fluid and guided.
Lower abandonment rate: Optimizing checkout isn’t just about pleasing your customers, it’s also about increasing conversions and revenue. Improving the checkout experience will lead to more conversions and greater revenue, as customers abandon checkout less and finish their checkout more frequently.

Why Business Needs Ecommerce Merchant need single page shopping cart experience

1 Online business presence.
2 Multiple options for payment.
3 Increased need for security and accuracy.

What Services do Ecommerce Merchant Accounts Provide? digital payments are vital to the success of business

1 Payment processing
2 Encrypted payments.
3 Easy-to-use software.
4 A streamlined payment experience.
5 Low fees
6 Customer support.

Task Flow

This is the path that the merchant user follows in order to complete tasks on a user interface – from entry point to the end goal.
I took a look at what path the user will use when using the web application for registration, etc.
Below is a schematic representation of the user flow of the Acme payment gateway

Customer Payment page flow

Sample Wireframe

Dashboard
Payment page expanded view
Products list view
Transaction list
Store product listing
Store product add
Events creation
Product listing
Advanced settings
Select Templates

Rapid Prototype

Sample UI Design

Event payment full banner
Event payment Side banner banner
Event payment Side banner banner
Event payment Side banner banner
Dashboard transaction ui
Dashboard product view ui
Store banner view

Let's Connect

Feel free to reach out for collaborations or just a friendly hello 😀