UI/UX Design,
Prototyping,
Workshops.
Fintech & Personal Growth
The Challenge
Noumena is a platform designed for freelancers, offering a comprehensive set of tools essential for running a business. It simplifies finding clients and investors, live collaboration and meetings, contract signing, invoicing, payment processing, knowledge sharing, and much more. It’s like having multiple apps all in one.
The main challenges were the ongoing investment round and the limited timeframe for the design process, given the project’s scale. The design process needed to be fluid and efficient, with multiple phases, such as ideation and user needs mapping, occurring simultaneously. We successfully managed to achieve this.
The Solution
As a Product Designer, I collaborated with the team to create modular, cross-platform MVP designs (Web RWD and React Native Mobile App), integrated with a tokenized Design System, all built entirely from scratch.
Workshops & Product Discovery
Throughout the entire project, we supported the business team with both on-site workshops (Vienna - Austria & Wrocław - Poland) and remote sessions. We assisted in defining the key product requirements, formulating the MVP scope, and creating the application logic, while simultaneously verifying it with developers in terms of technology and time estimates.
Foundation and Design System
One of the main opportunities and challenges was to create a flexible and scalable Design System from scratch, enabling the development of a cross-platform application.
We started by researching and analyzing existing Design Systems to identify best practices and to select a proven approach to managing the structure, tailored to the nature of the app. This research proved to be extremely valuable, as it enabled us to implement proven solutions in our Design System, minimizing potential setbacks or mistakes and ultimately speeding up the project timeline.
Furthermore, as part of the handoff process, we introduced our developers to the prepared components and explained how the component versioning would be managed.
We also developed a structure for color tokens and spacing, which were regularly exported as a JSON file. At the time we were working on the tokens, Figma did not yet have native token management functionality (variables). We explored the available plugins, but due to concerns about the project’s stability, for such a large project, we decided not to rely on third-party plugins, which are often unstable.
How we optimized the project structure while struggling with
limitations of Figma's beta or missing features…
..and felt (almost) like Figma's QA testers 😎.
While we were working on the project, many of Figma’s current features either didn’t exist yet or were in early beta testing stages (e.g., Tokens, advanced Design System sync, smart, as it is nowadays Auto Layout). This led us to maintain close contact with Figma’s support team, as we reported numerous bugs, where the only solution was often direct intervention from support in the source code of files, which users don’t have access to. It was an extremely valuable lesson, on how to build such advanced and large projects.
Thanks to the invaluable help from the support team, we were able to achieve a file structure that was more RAM-friendly and less resource-intensive. Additionally, we learned several useful workarounds that helped us avoid issues with components, synchronization, and prototyping.
Understanding Figma’s file processing and synchronization principles taught us best practices for building a well-structured project, managing files and components, to achieve the best efficiency and performance.
Customizable Spaces — Noums
Noums are customizable spaces that allow users to manage a variety of tasks, such as working with clients, establishing paid communities, or securing financing for startups. Each Noum functions as a customizable page where users can integrate various tools and content.
Our tokenized Design System has made it possible to design multiple Noum Themes for users, which can be further customized by adjusting the layout, fonts, and more.
Furthermore, freelancers have access to an intuitive dashboard that presents essential insights, such as visit stats, connections, event attendees, and top content creators.
Contracts, Invoicing & Payments
To equip freelancers with a complete set of tools, we designed invoice and contract generators. Invoices can be effortlessly sent to clients inside or outside the app, with payments processed quickly and easily. For contracts, the app offers clear, professional templates crafted by legal experts, giving freelancers peace of mind and letting them concentrate on what matters most—their work.
Mobile App
All features had to be designed for mobile devices as a React Native app. With functions such as video conferencing, payments, and discussion groups available directly from the phone, freelancers can easily run their business in one place without switching between different apps.
From a design perspective, we carefully considered the technological limitations of iOS and Android, while focusing on the challenges of designing for smaller screens. We scaled desktop to mobile screens in such a way that the functionalities are usable and user-friendly.
Contributors
Jarosław Maćków — Team Lead
Bartosz Maryniaczyk — Product Designer
Dawid Maroszek — Product Designer
Paweł Gryglak — UI/UX Designer
Dominika Pawlak — UI/UX Designer
Klara Siewierska — Graphic Designer
