We are breaking all the doors towards a digital future, and developing technology is our biggest weapon. Every service is digitized and easy to use these days, whether it is watching the news, playing games, streaming movies, ordering food, or making a payment. Technology has literally changed the way we do everything. Similarly, our transactions have become way easier and convenient through digital platforms.
Undoubtedly, mobile payment app development is one of the essential evolving technologies and is in demand all over the world. People are now accepting the importance of digital payments, during these testing times of the COVID19 pandemic. Apart from all the easiness, convenience, and flexibility offered by mobile payment apps, these digital platforms help us to do contactless payments.
I really like IDEO’s human centered design process as it’s a clear step by step process as it balances creativity and empathy with more rational thinking and analytical thought.
Process for Designing
Project Overview and Duration
Problem and Goal
Role and Responsibility
But while it was important for us to understand the site, we needed to see what other people thought. We did 4 user tests of the present site, asking them to navigate the site on their own as well as complete specific tasks. Each of our users came away confused and frustrated.
User Reserach
After taking interviews, survays, etc. I get some of user problem. And here I am going to mention some of user persona. These users are representing to a vast community.
Naina User Persona
Nora User Persona
Let's going through Naina's user persona.
Naina User Persona
After that Research I get that the problem raised by Naina is not only her problem. The problem is belong to a whole community. And after analysing I get Some Pain Points which are described below...
User Painpoint
User Journey
Goal Statement
Now we gotted everything what is necessary for designing. We have Problem Statement, User Journey, Goal Statement, Persona, etc. Let's create the wireframe and Prototype
Here first I give the storyboard which described the situation for why? and how? use the app. The big-picture storyboard tells that when and why use the app. And the Closeup Story tells that how to use the app
Big-Picture Storyboard
Closeup Story
Paper Wireframe
Now we are going to create these paper wireframe into Digital Wireframe
Homescreen
Send Money
Confirmation Page
Successful transaction
Help Desk
Request Money
Input amount
Receive Money
Well done!!! We created the Digital Wireframe from Paper Wireframe. Now it's time for creating Low-Fidelity Prototype from the digital wireframe
Well we are going to connect every single element to there next workflow and that is called Low-Fidelity Prototype
Footage of Confuse People after seeing multiple connection
Amazing! We did the greate work now it's time Mockups
In Mockups we are going to use Typography, Iconography, Colour Pallets, etc. And transforming our digital wireframe into Mockups
Homescreen Mockup
Send Money Mockup
Confirmation Page Mockup
Successful transaction Mockup
Help Desk Mockup
Request Money Mockup
Input amount Mockup
Receive Money Mockup
!Marvelous, We did that. We created Mockups. Now it's time connect and make it in High-Fidelity Prototype
Well we are going to connect every single Mockup to there next workflow and that is called High-Fidelity Prototype
Footage of People after seeing animated High-Fidelity prototype
Here you can check and review My Payment App Design...
We almost finished Our Design and some considerations are still have to define like Accessibility,Takeaways and Nextstep
Accessibility Considerations
Takeaways
Nextstep
!!Ohh Wow, We finished the design for Payment App. Thanks a lot for giving your precious time
THANK TO YOU
