Snapp! initially launched as Iran's leading ride-hailing platform, aiming to improve urban transportation. It then evolved into a super app, providing access to a wide range of services, including food delivery, flight and hotel bookings, rides, and doctor appointments.
Snapp! Pay is the first provider of BNPL (Buy Now, Pay Later) in Iran, aiming to create financial inclusion. This popular payment model, especially among the youth, marked a turning point in Iran's payment and microcredit industry and has been widely welcomed by users.
Problem Statement
When we joined the team, we started redesigning the app to provide a new experience for users. The current app only offered a simple credit service, allowing users to access services such as receiving rides or ordering food from Snapp! Super app, and pay for them at the end of the month. The business wanted to launch a new version with a BNPL feature, enabling users to shop and pay for their purchases in four installments.
One of our main challenges was designing the e-commerce sections.
What is the easiest way for Iranian users to find what they desire?
What is the easiest way for Iranian users to find what they desire?
Due to resource restrictions, our first step was benchmarking successful apps like Klarna, AfterPay, Gojek, and Grab to identify best practices and improve our strategy. However, we couldn't access an international number to investigate user experiences, and these apps didn’t operate in Iran. As the first in the country, I watched app reviews online and guessed the user flow. It was like walking in the dark.
To design the e-commerce sections, we met with the super app group to review data on banner click-through rates and components. They aimed to personalize the app for each user using AI. We then categorized their components and listed our desired components.
Categories
items/products/brands/shops
Finding the proper categories and then:
- Maybe the image+name of the product + price x 4
+ name of the specific shop+ the Venture - Lable or tag of the Credit/Installment
- Maybe the image of the specific category+name of it
- The Brand or Store logo + name of it
- A good writing for the name of the campaign category
- a good writing
- search icon
- search result page- with filters and other feature
campaign/shop/product/brands
Search Bar
- a good writing
- search icon
- search result page- with filters and other feature
Then we went through the information architecture, creating early wireframes and prototypes by multiple options.
Options
Option 1 Divar Category-top bar similar to now
Option 2 Divar Category-top bar has changed
Option 3 Divar Category-top bar has changed- banner position
Option 4 Chips Category-top bar similar to now
Option 5 Chips Category-Chips Category-
top bar has changed
Option 6
Chips Category-top bar has changed - banner changed
Interactions
Testing The Alternatives
We wanted to see:
After discussing internet usage and purchasing mental models with test users, we fully explained the new Snappay feature, emphasizing that Snappay is not an e-commerce site but provides installment sales services. We clarified that shipment tracking, after-sales service, and product support are beyond Snappay's responsibilities, focusing solely on payment.
We then demonstrated design options to users in varying orders, asking them to search within the Snappay feature and identify which display method facilitated easier product discovery. Users were encouraged to think aloud during the process to provide insights. Display options were shown in different orders to minimize bias from always displaying an option first or last.
We then demonstrated design options to users in varying orders, asking them to search within the Snappay feature and identify which display method facilitated easier product discovery. Users were encouraged to think aloud during the process to provide insights. Display options were shown in different orders to minimize bias from always displaying an option first or last.
Based on the results we realized for Iranian users, it is important to have a category. We delivered the test results we a sample of user quotes to the business.
Then created our own components (with details, not presented here) and the final UI flow: