Monese journey from mobile to web app
Here at Monese, we’re committed to providing financial freedom for our customers to live and work anywhere. Listening to our customers’ needs and thinking about the borderless generation with an entrepreneurial spirit, we embarked on a journey to expand Monese products from mobile to web.
Based on the research conducted by our research team, we were able to discover the functionalities our customers desire and one finding stands out: almost 46% of our customers miss the web version of Monese for the following key reasons:
- Users want to be able to access their account without a phone. They wonder how they could manage their account in case they lost their phone or had it stolen.
- Users want to have more complex account management capabilities. Users that need to manage large amounts of data need the capability to simplify how it can be found, downloaded and transferred to other accounting or accountancy software.
- Users want to be able to multitask. Other banking-related activities often happen in a desktop browser, so it would be easier to stay in one device/platform when doing similar tasks. Also, it’s hard to do any concurrent task on your phone, for example, if you are calling your clients or bank and, at the same time, you need to have a look at your statement and bank information. Not all customers are tech-savvy or comfortable enough to manage multi-tasking from mobile.
- Users want to have profile management. Some people would like to give guest access to accountants or family members and they think web could be the best vehicle for that.
Our first goal was to build a simple version of a responsive web app with core online banking functionality, to test how well it resonates with our customers, and learn how they will use it.
We started by planning an MVP with core banking features that would help us validate customer needs for a web app, in order to understand how people interact with our product. As we aimed to deliver the web app MVP in three months, we aimed to design and develop in an agile way using SCRUM with continuous iterations, based on continuous feedback.
The product MVP allow users to:
- See account balance without a mobile device
- Know the total balance across private, business and other accounts
- See private, business and other accounts
- Find transactions with detailed filtering options
- Search for specific transactions more easily
- Sort transactions by date and sum
- Download filtered account statement to computer
One of the main design challenges in this project was designing the solution in a responsive format, so users from mobile, tablet and desktop are able to access it, despite their screen size or device.
Besides that, we also wanted to keep the design consistent with the Monese mobile app and provide customers with solutions for the needs we identified, adding value to specific features that could be more explored with a larger screen size.
Once we had produced our first MVP designs, we decided to test a prototype. The test involved asking users to log-in online to check their balance and perform some basic tasks framed around filtering their transactions. This test included a second mobile prototype that participants had to use to authenticate their first access.
The outcome of this test was the discovery of login design issues in early stages which could be simply fixed with more clear information and explanation of what happens in each step of the flow.
When it comes to navigation filtering, despite the limitations of our prototype, users liked to play around with filter and sorting options. This made the importance of this feature much more clear for us.
Several users also gave good feedback about the simple and clean look and familiarity with mobile app. So, in general, the outcome of this testing was great, as it allowed us to understand the necessary improvements, and confirmed many of our research hypotheses.
The MVP development
The Monese web app was built using a micro-frontend approach, where our different micro-frontends are deployed using dedicated servers and are integrated using web component specifications that keep the solution framework-agnostic.
Our web app is implemented as SPA (Single Page Application) built using React JS framework and the backend services are accessed via web API gateway. All backend data and functionality is exposed through GraphQL endpoints. Services behind the Web Gateway API are responsible for supporting front-end services with data behavior.
It was built for every product team to be able to work independently and separately as the product grows, performing web-related server-side operations and accessing 3rd party services.
One of the biggest challenges that the development team faced was the security for preparing the product for external penetration testing and to prevent any kind of malicious attacks, keeping customers’ data and money secure.
A large part of our company’s mission is to enable our customers to experience financial freedom. Not only to be free from financial worry, and the financial challenges that come with geographical boundaries.
To accomplish that we’re committed to building a seamless online banking experience for our users regardless of device or browser, allowing customers to enjoy Monese wherever they feel more comfortable.
Having the MVP launched for all customers in January of 2020, our next goals are to build a new signup and onboarding flow as well as add relevant online banking features, including account opening, card controls, and payments.
If you would like to try, you can access Monese website to log in or sign up 🙂