More than the sum of its parts

Linking flows to add value

My Role

Design an end to end userflow, Investigation, refining user experience and supporting developers to realise the end goal.

The Problem

👉 Getting separate products talking

The NovaHub SaaS product includes multiple components that is supplied to our clients.

The complex nature of the individual products means that they are ready at differing times and scales.

These products although architectured to work together are yet to be fully integrated. 

The largest pain point is where the user downloads a list of customer ids from one product and then uploading them back onto the system to use another product on the same platform.

Multiple Flows

💨 With multiple products on the platform each one has its own user flows that lead to an output.

  • Machine Learning product which cluster users together to find how receptive they are.
  • Customer database that filters attributes of the users.
  • Campaign manager product that schedules emails, pop ups, notifications, SMS and incentives.

We also need to take into consideration possible future flows that could be added.

Gathering Information

⛈ I set up workshops with team leaders to understand how the products could talk to each other. 

When designing I like to explore possibilities and generate ideas for near future expansions.
Although this could be dangerous in terms of thinking too far ahead we try to keep it realistic to what can be done in the next 6 months after Minimal Viable Product (MVP) delivery. This helps the teams plan ahead, in the hopes that this could reduce refactoring.

Alongside those sessions, userflows and wireframes are drawn to illustrate the happy paths.

I also used the design system to build out ideas to faciliate and illustrate idea generation.

Scaling Down the Feature

🎁 Incremental feature delivery

The feature is then scaled down and reduced to a MVP. This process is a joint effort between Developers, Product Owners and Design.

We prioritise and trade off features to decide what can bring the most impact to the client in terms of value and shorter timeframes.

In this case we take the filtered user list output and use that information inside the campaign manager.

Rapid Prototyping

🧱Using the Design System

Ideas generated in the brainstorming sessions are then put together into a mid fidelity prototype to test the userflow in further detail. 

Using the design system I am able to rapid prototype and test the idea with peers. 

Breaking & Expanding the User Flows

😰 Stress testing the design

We test the design and flow looking for flaws and possible pain points, refining them and testing again.

End2End flows are now built out to find possible holes in the loops. Possibilities where errors can be happen and how to handle those situations are discussed.

Testing

🔊 High-Fidelity testing

Final UI designs are then made. This stage helped us find potentially unseen problems for our target audience with varying levels of experience.

(Opens Figma Prototype in a new tab)

Refinements, Iterations & Refactoring

💪Teaming up with developers for the next step

After designing the product to a stable agreed vision, I supported the front end development team in refining the interface, repurposing older components. New components that were made had their flows and design patterns built out.

(Opens Figma Prototype in a new tab)

Takeaways

🥡 Using smaller increment releases helped us stay focused on what the needs of the user are. There is a danger in over designing, eg. you could plan out complex products that might not add a lot of value to a user.

The idea is that we continuously build, improve and keep teams in sync. This allows us to react to client demands and market trends.

In this project I learned that it is beneficial for all team members to define the end goal together but also firmly understand that changes can be made along the way to continuously deliver value.

Next Article

Nova futur Ltd

A solution to facilitate team work, transparency and prevent inconsistencies on a large scale SaaS backoffice.

#DesignSystem #MajorProject