SmartPay
With numerous IDs and payment cards we carry around on a daily basis, it can be difficult for us to keep track of our own information. SmartPay is a digital wallet & payment app that allows users to send/receive money, view investments, and access their crypto wallet — all in one place. Our goal was to understand the way people may currently use different payment apps and ultimately create a trustworthy, easy-to-use mobile app.
-
Team: 5 UX Designers
Role: User Research, Prototyping, UI Design
Tools Used: Figma, Trello, Maze, Google Sheets
-
To create a financial mobile app for users to send and receive fiat/crypto money to other users, cross border transactions, and small business transactions.
📚Research
User Interviews
Our interviews helped us gain multiple perspectives and uncovered the common pain points needed to address with the ShopTaki Pay app. We interviewed 10 people, between the ages of 25-60, asking the following questions:
How do you currently go about sending or receiving money?
Do you remember how you signed up? How did you verify your identity?
Do you like anything about how you currently send/receive money? If so, what?
What are your main concerns regarding your privacy/security when it comes to sending or receiving money
Through these interviews, we found three important insights:
Competitive Analysis
In order to determine Shoptaki’s position compared to their competitors, we conducted a competitor analysis among three other apps, based on money transfer and cryptocurrency. This helped us to see their strong and weak points, allowing us to come up with solutions to current problems.
Venmo
Wise
Ledger
-
Users can setup their profile as a personal or business account.
The QR code feature makes it convenient for users to send or receive money.
Money transfers take 1-3 business days with no fee.
-
Some users tend to not like the social aspect of the app, mainly because they do not wish to make their transactions public.
-
This is a popular option for users who make frequent international transactions.
A breakdown of fees is provided for transparency and to allow users to compare fees among other apps.
-
There is no option to allow for automatic recurring payments.
Conversion rates must be entered in manually, becoming an extra step users must take.
-
The great visual data representations of assets can be a great way for users to securely view all their cryptocurrencies and buy, sell, or trade crypto.
-
Users are unable to send or receive money to/from others.
User vs. Business Needs
An important aspect we had to consider was not only the needs of the users, but the needs of the business as well. After discovering the needs and pain points of the users, we switched our viewpoints to the business perspective in order to see the commonality of the two. From there, we were able to obtain a better understanding of what needed to be integrated into the app.
❗Problem Statement
Users feel overwhelmed and uneasy about sharing their sensitive financial information online, paying high transaction fees, as well as dealing with slow payment methods.
🎨 Design
Initial User Flows
During our ideation phase, we thought about the different types of information as well as the steps users would need to take in order to successfully send and request money. By empathizing with users, we were able to create a user flow that would allow them to send money in the most convenient manner.
Mid-Fidelity Wireframes
Using our competitive analysis results and our initial user flow, we designed mid-fidelity wireframes to show how users might send or request money through the app. The “Add Recipient” screen prompted users, using a tooltip, to swipe on a recipient of choice to start their pay/request flow.
Initial Usability Test Insights
With our low fidelity prototype, we wanted to get an idea early on of how well our core features worked for users. By obtaining these insights quickly, they would either help validate our design decisions or prove them wrong and allow for us to make iterations before we began finalizing our app. By conducting our initial usability test, we were able to discover a few main issues in our prototype:
Final Prototype
Through observing the behaviors of testers and obtaining feedback for our initial prototype, we were able to make necessary iterations for our final design. Some iterations included changing the “tap and swipe” feature of the payment step to a “tap and tap” function and improving the screens for the payment flow. We also created other features on the digital wallet, taking into account the business goals for a fiat and crypto section of the app as well as a flow for small business owners to track their sales.
Landing Page
When users first open SmartPay, they are able to view their cards at a glance. Users are also able to easily add in new cards or payment methods into their wallet.
In the Accounts section of the landing page, a wheel with interactive filtering is provided for users to see a breakdown of their accounts as well as their recent transactions.
Quick Pay
Inspired by social apps, the quick pay function is a way for users to resend money to those they have made recent transactions with.
Additionally, the search bar was placed at the bottom of the screen for users to easily access the function
International Payments
By taking into account feedback from usability tests, the payment flow was iterated by simplifying the pay/request function.
Users are able to view a fee breakdown and by implementing this in a drop down, it keeps a clean design as it allows them the freedom to show or hide this information.
The recurring payments option provides users with the ability to choose to schedule payments on a timely basis rather than having to go through the hassle of manually sending money.
The cancel button is another way we kept users in front of mind by helping to reduce the hassle of having to recover the money if the wrong amount was sent or if it was sent to the wrong person.
🧐 Testing
Usability Test Results
We conducted our final usability test on the high fidelity prototype and were able to find several important findings using Maze. This included usability scores, heat maps of the different screens, the average duration of the tasks, and the overall satisfaction rate. Our task results were based on a local flow and an international flow for the app, revealing the following information:
As my final project with this program and my first project with a real client, I was excited about where this opportunity would take me as well as the new experiences I would gain throughout this short time period. Working with a client and developers provided me with a new learning experience. Through this partnership, we were able to determine both user and business needs and incorporate them into this app.
Reflecting back on the first few group projects I have participated in, this final project brought me a sense of community as well as what it meant to be a team. The efficiency and excellent dynamic of the group helped me grow as a UX designer as each team member successfully fulfilled their roles and brought their own unique perspectives to weekly team meetings.
Although there were many other aspects and features we would’ve hoped to work on, the limited amount of time given was what prevented us from fully designing this app. Overall, through this experience, we were able to learn more about the world of cryptocurrency and the promising future of Smartchain.