Zimble is a digital pocket money app that encourages financial literacy at a younger age. Its educational platform comes with a prepaid pocket money card that enables children and youth to take steps toward supervised transactions.
I entered the project half way into the pipeline. Development had already started referencing a base design however the business owners felt it was lacking a theme and didn't represent the vision they had. I was engaged to help revamp the whole look and feel and consult on solutions to better the overall experience.
THE UIUX BRIEF
The way I would describe Zimble is that it is a "Money Parenting App". The whole app needs to center around financial literacy and serve the function of parenting through the creation of tasks where the incentive was monetary or non-monetary. First I addressed the target audience which I strongly felt should be positioned towards parents. I feel the market is already saturated with tons of digital payment solutions especially prevalent in the gaming space. Companies like Razoror or Garena both have digital payment solutions. So the objective was to come into the market positioned as a Parenting app in order to differentiate itself from its competitors.
A product for parenting
No product owner
Agile project workflow
Had many discussions with the product owner to create the foundation information architecture of the project.
After understanding the business flow I began creating personas of the child dashboard and the parent dashboard.
We started doing concept screens of how the menus and ui would look with the UX focusing around a parenting app and the child on budgeting.
Drawing wireframes was not enough to communicate the ideas I had with the product owner. I started employing low fidelity prototypes to simulate solutions for the complex UX problems
With the gifs created in Flinto we then put them in an overflow document with flows and sitemaps for reference.
After documentation during alpha pre launch the business owners still wanted some final touch ups to the design minor small tweaks in the UI.
Initial look and feel doesn't immediately come across as a financial app
Parents User Journey
Updated the navigation in the main menu for the Parents. Some of the core screens could not be accessed from the main dashboard.
Children User Journey
Updated the navigation in the main menu for the Children. Some of the core screens could not be accessed from the main dashboard. Added manage goals segment, chat and saving plans
Here I brainstorm the connection focusing on 4 main categories: Balance/Allowance/Wallets, Admin Account/Top-up/Personal Details, Tasks and Social/Chat/stories.
After I established the objectives and personas, I started punching out the different ideas exploring what we could do to make this experience really fun and fresh.
Below is some of my thought process from prototype gifs to ideas about navigation and what information takes precedence over others.
I rework the placement of UI elements on the screens
Initial Idea 1
The UX felt broken to me. Important navigation links to core pages were missing and the sizes were off. Important information were small and vice versa
Initial Idea 3
Revamped the look and feel completely once i found a good color scheme.
Initial Idea 2
Below are the final production wireframes for the project. (In some projects I cannot showcase all of them due to confidentiality issue).
Here I provide reference documentation to developers required to build the app. Information ranging from type treatment, colour schemes to reused components. These are all online on Zeplin labelled with the url reference links ontop of the overflow sitemaps.
Overall the project was very rewarding. I felt I did a very job cleaning up the message and theme of the app. The finished design is engaging and fun. The navigation experience is very intuitive and hopefully the whole experience translates into a very useful app in the efforts of helping parents teach their kids financial literacy through parenting.
We managed to make all the deadlines but I can't help but feel the project would have been delivered earlier if the UIUX was addressed first before the development started. Ideally in a in-house team I prefer Agile development however taking over a project Agile development proved a very ineffecient process resulting in many delays due to second guessing of requirments. Often times developers would neglect or fail to communicate road blocks which were later discovered to be a miscommunication of some unique feature that was deemed "over-kill" and not needed. All-in-all I am very happy with the design decisions I made and the final UIUX treatment on the product.