Redesigning a banking app with neumorphism
Revolut App Redesign — Rethink Android and iOS Guideline.
Catering user preference is undoubtedly a never-ending task. End of the day, it takes all sorts to make a world. For that reason, it is deemed important to design with the accent of communicating core business value, and resolving user needs with brand and functional consistency.
User Interface Adventure
Revolut is a virtual banking app that supports payment, currency exchange and fiat money investment.
This redesign was inspired by their motto — Radically Better; aiming to recreate a futuristic yet trustful interface, pop it out from the banking app crowd.
Note to self: If you are struggling to look for a particular UI style for your redesign, consider how you want to deliver user experience and keep in mind that consistency is all the more important.
Despite the controversy over its visual contrast and practicality, I adopted Neumorphism — A trending design that gives clean and minimalistic look. By immersing Neumorphism elements in the app instead of replacing the entire interface design, this spices up the overall look with a relatively modernised and uniform sensation.
User Interface (UI) Redesign Focus:
- Reuse branding elements
- Consolidate button action and usage
- Unify theme colour
Behind The Revolut-ion
1. Simplify is More
Trim down duplicated functions. Gathering things at the right place could sparkle joy and satisfaction to your app experience. The redesign on Accounts Screen focuses on creating a fresh interface for users to navigate through their transaction records and investment accounts. Elements are sorted into money, accounts and transactions related actions.
A. Money-Related
Combined ‘add new money’ and ‘currency exchange’ into the same ‘Top up button’.
B. Accounts-Related
Placed a bold flag icon that emphasises the selected currency account; tap to show account details.
C. Transactions-Related
Transaction timeline carousel gives a quick glance on user’s transaction records.
Another highlighted change is the simplification down to 4 tab bar items. ‘Manage Card Tab’ has been integrated under ‘Dashboard Tab’ for users to locate Revolut card-related information all in one place.
2. No Blank Cheque
Control users’ expectations. In other words, give users what you promise. There are certain key elements that determine whether a Dashboard serves its purpose. Taking references from Josh Johnson— 5 Steps to Effective Dashboard Design, the goal here is to tailor Dashboard Tab to be more dashboard-y; keep it handy, concise yet interactive.
Reuse branding elements plays an important role in cultivating brand image and educating users on the relationship between specific graphics and actions.
For a more personalised experience, decision has been made on consolidating Dashboard screen into two distinctive parts.
A. Top profile section with buttons connecting to sub-informative layers
B. Interactive elements remain in the the natural thumb zone.
Main incremental change is the implementation of progress ring; representing the vaults-saving progress. It’s not only an eye-catching trick but an enticing visual that motivates users as reflected in the user feedback.
3. Hotline Bling
Customer support is particularly essential to banking-related/ money management applications. Improving customer support interface is amongst the most crucial and popular request as it would heavily affect company’s reliability and credibility.
A presentable and friendly FAQs screen reflect a next level of assistance. Instead of bombarding users with overwhelming FAQs sections, How to Create FAQ by Kesi Parker and Design an Effective FAQ page or section with Project faq-beta by PWA Fire by Maye Edwin have shown some critical insights on how to gather and rank information from the users’ perspective.
Here, you might notice a hybrid use of Android Floating Action Button in the bottom right of the screen. Main difference between Android and iOS guideline on navigation design is the spread of navigation destinations and the position of primary action button.
The application of interface elements hence appear to be a practice depending on the screen context and how you want to catch user’s attention.
In this regard, placing a big floating button in the bottom corner adds stimulus to users, which could highlight extended actions in a more effective manner without requiring loads of scrolling on the main information panel.
4. Don’t Hide Your Gem
Why would you put the cool design aside anyways? Show users the unique feature — Additional values. Avoid layering up, more navigations would potentially fuel up confusions, resulting in less engagement 🔥.
Use Payments Tab as an instance— The development of searching nearby payee eases payment transfer between users and boosts connections.
This feature differentiates the app from the rivals, which has more than other reasons to make it the lead instead of sitting inside layers.
On top of that, sometimes being unconventional isn’t a bad idea. It might seem abnormal to include a switch button of this size that actually looks like a switch. However, creative use of interface elements with some degree of customisation often brings surprising effects!
Now you might ask, why mixing Android and iOS elements? This is uncommon and definitely not a good practice. Before justifying that, I have another question for you.
Is Traditional or Hybrid Car Performing Better?
Depends, but driver’s safety always comes first. Similar concept applies when you’re designing with iOS and Android devices, being human-centric is the key. Apple and Google have both developed their native dialect suggesting the best practice for their believers — Human Interface Guideline (iOS) and Material Design Language (Android). They did the best analytics based on their user behaviour research, one should not simply ignore them.
Not limited to designers, in general, we could divide people into two main clique. One that sticks strictly with native guideline, whereas the other feels no harm to be little unconventional. Both acts have their respective advantages and yet — There is no strict rule on following native guideline.
Building an app is like doing face makeup, and native guideline is our makeup foundation.
This metaphor might sound a little feminine but your makeup depends on how well the foundation has been applied prior to other embellishment. In other words, designing with native elements is the basis; following native guideline is a prerequisite. After that, you could put on your creativity and give the app some extra glitters.
One might say, being native is boring; looks no difference with the rest on App Store. Truth is, being native gives higher familiarity to users. Anyhow, users spend more time on other apps than when they are new to yours.
What I’m saying is, design based on native guideline and explore alternatives to customise app experience. Not to forget the main focus of app design is to deliver great palm-size digital experience for users.
Design Humanly is the New and Forever Black.
Rethinking from users’ standpoint offers more perspectives, which somehow requires designer to be innovative and groundbreaking. Disclaimer — I’m not suggesting a casual mix of Android and iOS elements. Best practice is to design upon the given context, style, UI pattern and call for actions; make sure you understand the usage of respective interface elements.
The benefits of rethinking ourselves from the users’ perspective is to bring stimulation and awareness on what could possibly offer greater pleasure and relieve users’ pains. In many instances, we tend to subconsciously lock ourselves in the idea-killing box when we repeatedly design for the same device over time. Being little unconventional is then often being labelled as incorrect or unwise use of design, given that it is not native enough.
However, as long as you could justify the rationale behind the exercise of elements and support the design with interview insights and user testing performance analysis, why not give it a go?
“It is important to remind ourselves to think original when we start to lose ourselves.”
I have learnt one thing about app design. It is an ongoing process of resolving problems with regards to data analytics, reviews and feedbacks. Gives you all the benefits of doubt to stimulate ideation and explore beyond impossibilities. Design is about constantly evolving and embracing the change.
Hope you enjoyed and let me know what you think!
