Connecta
Connecta is a no-code integration platform built inside Odoo. It connects apps like Shopify, Bol.com, Exact Online and Magento, so businesses can sync their data without writing code. I designed the whole product: dashboards, setup flow, flow builder and marketing site.
Date:
Client:
Connecta
Industry:
No-code integration
B2B SaaS
Services:
Role-based dashboards
Setup wizard design
The problem
"No-code" doesn't mean simple. Behind every connection there is data mapping, sync schedules, retries and conditions between systems that don't naturally agree.
The product showed all of this to everyone, all the time. A tool built to save people time made them feel they needed a developer.
The user's challenge
Connecta has two very different users looking at the same data. Business owners want a quick answer: is everything working? Developers and admins need enough detail to fix what's broken, fast.
And for both of them, simply connecting a new app meant going through the full flow builder, the most complex part of the product.
How I found the problem
Because I worked across the whole product instead of one feature, I could see the same pattern everywhere:
the same data appeared in three overlapping views, and none of them worked well for either user,
a simple task (connecting Shopify) required the most advanced tool in the product,
the setup form had so many fields that it broke the layout it lived in.
The problem wasn't too many features. It was that simple and advanced tasks were mixed together, and everyone saw everything.
Decision 1: Two views of the same data
Different people needed completely different things from the same data. A business owner wants a quick, reassuring check-in: is everything running? A developer or integration admin needs enough technical detail to actually fix what's broken.
Options I considered:
🔴 One dashboard for everyone. It would do both jobs badly: too technical for owners, not detailed enough for developers.
🔴 Keep the technical dashboard and add explanations for owners. Owners would still have to dig through errors and settings they don't need.
🟢 Two views over the same data, each built for one kind of user.
Management view is calm and read-only. It shows whether everything is connected and healthy, with nothing to configure. It's built for someone checking in, not troubleshooting.
Development view is built for the people doing the work. Repeating errors are grouped instead of flooding the list one by one. Records can be filtered, and every issue has retry, retry all and retry selected actions, plus a shortcut to open the source record in Odoo.
When an app doesn't support retries, the button appears disabled instead of hidden, so the limitation is visible instead of mysteriou
Decision 2: Taking setup out of the flow builder
Connecting a new app meant going through the full flow builder. It's powerful, but far too much for someone who just wants to link Shopify and move on.
Options I considered:
🔴 Keep setup inside the flow builder. New users would have to understand the whole platform before creating a single connection.
🟢 A separate four-step wizard that starts with searching the app library.
Now, creating a connection no longer requires understanding the whole platform first.
A problem I found along the way
The connection-details step had too many fields, and it broke the wizard's sidebar layout.
🔴 Show all fields at once. The step became long, and the layout broke.
🟢 Keep only the essential fields, and move the rest into a collapsed Advanced settings section.
The main path stays short by default, and the depth is still there for anyone who needs it.
Decision 3: A canvas you can still read months later
Connecta Studio is where the real logic gets built: a canvas where people connect blocks to define how data moves between systems, how fields map, and what conditions apply.
Small flows were easy to follow. But as flows grew to include several apps, mappings and conditions, the screen became crowded and people had to find the right flow, open it, and understand it again, often weeks later.
The goal: an organized layout that reduces cognitive load, so people can focus on the logic they're building instead of fighting the interface.
Options I considered:
🔴 Open Studio as a full page, taking over the whole product. Users would lose their place every time they edited a flow.
🟢 Open Studio as a slide-in overlay from a quieter button in the top bar, so people can edit a flow and return to where they were.
What I designed:
A Studio start page with Quick Create, Recently Closed tabs, and a browse panel on the left, so people get back to their work in one click.
Redesigned canvas blocks and navigation, with a clear structure so a flow stays readable as it grows.
In the mapping tool, a field picker with drill-down navigation, a back button and required-field markers, and more than 70 functions organized into categories instead of one long list.
The result: someone can open a flow they built two months ago and understand it immediately.
Also designed: the marketing website
Alongside the product, I designed Connecta's full public website.
Instead of a standard SaaS landing page, I built the sections around puzzle pieces fitting together, a visual language for what the platform actually does: connecting separate systems into one.
The structure carries the message before anyone reads a word.
The result
Three overlapping views became one dashboard system that adapts to whoever is looking at it.
The setup wizard shipped before a trade fair deadline, giving new users a much faster way to their first working connection.
Studio became easier to navigate and easier to read, even for flows built months earlier.
What I learned
Across every part of this project, the same principle held: show the simple path by default, and keep the complexity one click away.
Making a technical product simple doesn't mean removing its power. It means deciding who needs that power, and when.
