Cashflow

This project allowed me the freedom to create an application of my choice, with a primary focus on developing a native app for both iOS and Android platforms and conducting user testing to gather and implement feedback.

The task was to design versions of the same application for both iOS and Android platforms, adhering to their respective design systems. This enhanced my understanding of native platform UI development and provided a practical application of my skills.

I chose to design a personal finance app aimed at creating a stress-free and enjoyable environment for users managing their finances. The objective was to address the complexity and accessibility issues found in existing budgeting tools, making financial management more accessible and less daunting.

Many of the budgeting applications that exist on the market today are well rounded, but complex for users to begin using with confidence. On the other hand, many personal banking apps provide adequate information on spending trends, but lack the tools to set future budgeting goals. Cashflow will provide the essential functions of the in-depth budgeting apps, albeit basic, providing an easy entry point for users.

Cashflow will be designed specifically for young adults and young professionals who are faced with a greater amount of financial responsibility than ever before in their lives.

In order to ensure that I would meet all the key features that I laid out in the concept proposal, I built a user flow to outline the key tasks that the user would carry out on Cashflow. This first iteration went on to evolve slightly to better fit the user experience.

Developing low fidelity wireframes allowed me to begin identifying not only the structure of primary pages, but the necessary secondary pages and repeating design patterns that I could build upon in the next stages of design. At this point, specific design systems weren’t implemented extensively, rather I was able to begin identifying points of interest that would need extra attention as I built out the app for each respective design system.

Moving into the interface design phase of this project, decisions were primarily guided by the project objective. Personal finances are often an area of stress for many, so my aim with this app was to design an environment where the user would experience peace of mind and control.

I decided to design this app in the style of Neumorphic Soft UI. Finances are often confined to a cluttered and rigid interface of an Excel document, but Cashflow brings the user’s finances into a more accessible and enjoyable space.

Because this app will not be pushed to final development, haptic feedback and sound design were only theoretical. The physical and audible experience would fall in line with the goals of peaceful and controlled design.

Sound design would be similar to meditation apps providing bright and calm responses to actions like recording transactions or marking bills as paid. Haptic feedback would be highly responsive and match the 3D design of the UI elements like buttons and switches.

Gestures too have not been fully developed for the app beyond simple gestures necessary for the prototype. The goal of gesture interactions and app navigation would be in support of the design goal. Navigation and interaction with the app would be organic and natural for the user.

Now came the time to apply the Neumorphic Soft UI design concept to the wireframes and bring the application along with the experience to life. The primary challenge with this stage was to balance the use of soft UI well; too much Neumorphism would clutter the design while too little would appear as a mistake.

I built out both the iOS and Android screens simultaneously applying design differences where necessary. (Note: Only the iOS version is represented below, however the Android prototype is available in the next section.)

In order to bring the design to the fingertips of potential users, I prototyped the high fidelity screens using Figma. This allowed me to convey some of the natural interactions that I was aiming for in the look and feel of the app. Particularly with the buttons, the use of shadows and responsive shades of color allows for a more immersive experience for the user.

Once individual prototypes were built for iOS and Android, I conducted user tests on four iOS users and two Android users. Taking into account feedback and pain points, I was able to apply polishing touches to the final designs.

This project was my first exploration into Neumorphism. I believe that it fit the project objective well, but more than that, I took it on as a challenge to push me out of my comfort zone. In doing so, I was able to build on my use of light and shadow and the use of effect styles.

The two challenges I found with Neumorphism were balance and accessibility. I believe I struck a good balance so that the use of Neumorphism wasn’t overwhelming to the design. Concerning accessibility, Soft UI with it’s use of subtle shades of light, naturally leads accessibility issues. Across my user testing, there were no significant issues with accessibility; however, in future projects with this design style, I plan to take more precaution and provide more accessibility features.

By the final product, this projects required 24 screens, 4 overlays, and 16 components for both iOS and Android. Needless to say, file organization was essential to the success of this project. I experimented with some new organizational techniques here, many of which proved helpful, but I will of course continue to evolve these techniques in future projects.

I am continuing to learn the ins and outs of the UX/UI project journey and where I find more challenges. Taking projects from top to bottom like this one is helpful to show me the parts of the journey that take the most time and energy and which parts come with less effort. This will help me roadmap projects in the future and set more realistic timelines for myself and stakeholders.