Noobill App UI Design
To materialise an app that empowers people to take control of their bills and helps them save money on services.
Noobill is an app born from the idea that everyone should be able to easily understand the costs of service providers with full transparency.
In its early days, this app is thriving to change the way people subscribe and pay for services.
– Translate the wireframes into a final pixel perfect interface.
– Create a design library to guide front-end developers when building the app.
I led the design process end-to-end working directly with the startup founder and alongside the UX Designer, supporting them in the early stages of the design process all the way to delivery.
I also, led a talented Junior Designer Ivana Galic who worked on the creation of the design library and the app’s UI.
Mapping Out The App
Once the wireframes were completed, we took the wireframes and mapped them into comprehensive journey flows to understand how each screen fitted into the overall experience.
Colours & Fonts
The design process began by defining a suitable colour palette and a font family to use across the app. In order to ensure we were making the right choices we tested and compared them first before making a decision.
Once the basics were defined, we began by deconstructing elements within the app and its features in order to understand the different assets that needed to be designed and documented in the library.
Once we had defined all the assets to be designed, we began to build the entire library and several of the most important screens.
Keeping in mind the design library would be the guide for developers when building the app, we streamlined the design process by focusing only on assets instead of screens, spending less time in the design phase.
The final step, before handover was to map out all the screens, including wireframes, and the previously designed screens in order to understand which screens were complete and which ones would need to be constructed during development.
In the end, our approach to design gave Noobill the ability to move to development faster, cemented the foundations of the product and helped them reduce friction and challenges often found by developers during the build phase.