Zeev: process orchestration and AI agents for more than 350,000 users
How Stoque’s process automation platform was built and evolved, from the design system to the front-end.
- 4.49 ★
- Capterra. Overall satisfaction rose from 3.1 to 4.49 stars.
- 350k+
- Active users. The platform runs operations for Brazilian companies and institutions such as Itaú, Sympla and Inmetro.
- 6×
- Global awards. Recurring recognition at the Global Awards for Excellence in BPM.
- 50+
- Components in the design system, integrated between Figma and production code.
About the product
Thousands of critical operations at large Brazilian companies run on Zeev
Stoque builds digital infrastructure. Zeev, its main product, is an intelligent process automation platform that runs the operations of corporations such as Banco BMG, TIM and PlayKids.
The system works as a BPMS (business process management system) built to orchestrate complex workflows. It supports everything from routine processes, like vacation approvals, to customer service automations integrated with AI agents. The platform is the central engine of thousands of critical operations, with precision, efficiency and traceability, through an accessible interface.
I led the evolution of the user interface throughout this period. The work was to turn a robust but visually fragmented platform into a cohesive, scalable, white-label ecosystem.
The challenge
Moving the product forward with a new design system, refactored modules and a better user experience
Although Zeev’s backend infrastructure remained solid, years of decentralized development had piled up technical and design debt, which resulted in a fragmented, inconsistent interface across more than twenty modules.
This lack of standards, along with missing support for mobile navigation and for the WCAG guidelines, hurt usability and the value customers saw in the product. The disconnect between Figma and code caused constant rework, delays and bugs for engineering.
To close these gaps and lay a scalable technology foundation, the project focused on implementing a new design system and on structural UX optimizations.
The solution
Visual centralization and standardization with a new UI framework
I designed and coded zeev-bootstrap to tackle the architectural debt. We created an abstraction layer on top of Bootstrap, tuned to handle the complexity of enterprise software.
We chose Bootstrap for operational pragmatism, since engineering already knew the technology well. We raised design maturity on a stable foundation to shorten the learning curve and speed up adoption of the system across the sales and product teams.
-
Strategic design tokens
An architecture based on CSS custom properties. Colors, typography and elevation are automated, which made it possible to turn on dark mode without refactoring code.
-
More than 50 scalable components
A library documented in code and in Figma, from modals to high-density data tables, with standardized error, focus and hover states.
-
Parity between Figma and front-end
The layer name in Figma is the class name in the CSS. Standardization cut the noise in the handoff and the time spent on visual QA.
-
Documentation for developers
Engineering-focused guidelines: how to instantiate components, the accessibility rules in force and the versioning process.
UI engineering
Refactoring the platform’s core modules
Once the design system was consolidated, I led the migration of Zeev’s core modules. The scope included the Workflow Builder, the Process Manager and the Analytics Dashboards.
Quality and governance principles
-
WCAG 2.1 (AA) accessibility
A minimum contrast of 4.5:1, defined focus states for keyboard navigation and standardized semantic markup.
-
ARIA attributes
aria-labels, focus management in modals and screen reader support during complex operations.
-
Scalability and responsiveness
A layout built for a range of resolutions, fluid and ergonomic from phones to ultrawide monitors.
-
Validation with data
Critical flows went through usability testing to confirm the efficiency of the new visual architecture and interactions.
DesignOps leadership
Design processes and product impact
Technical excellence requires agile processes. The effort went into designing the interfaces and into how the team delivers value.
-
Design metrics and OKRs
Quarterly audits to measure usability maturity. The data backed the results presentations and the roadmaps for leadership.
-
Continuous improvement
Retrospectives focused on the workflow. The model reduced recurring friction between discovery, prototyping and delivery.
-
Artificial intelligence in the workflow
Claude and Copilot to generate mockups in code, and LLMs to analyze UX data. These integrations raised the productivity of the team’s deliveries.
-
Documented handoff
Technical notes and state specifications in the user stories. Development started moving forward with fewer synchronous check-ins.
Gallery
The prototypes, screen by screen
The refactored modules in detail, with the interface in Portuguese, as Zeev’s customers use it. Tap a screen to enlarge it.
Results
The business impact, in data
Optimized design lowers operating costs and raises the product’s perceived value. The indicators below sum up the result of the implementation.
-
+43%
Capterra rating
User satisfaction took the platform’s overall average rating from 3.1 to 4.49 stars.
-
+150%
Adoption at scale
The modular interface absorbed the influx of new enterprise users without losing stability.
-
+30%
Delivery speed
Tested components cut front-end development time for the interfaces.
-
↓
Fewer UI and UX tickets
Standardization reduced support tickets about basic navigation questions.
-
6×
Global leadership
The product’s maturity contributed to recurring recognition at the Global Awards for Excellence in BPM.
-
✓
Unified brand
The restructuring brought the product in line with the new corporate brand requirements.
Contact
Got a complex product ahead? Let’s talk.
Tell me about the project’s context and timeline. I reply within 48 hours.