Investment-Advisory Platform — Two Role Flows, Team of Five
Advisor and head flows owned end to end across 722 desktop and 764 mobile frames.
An investment-advisory platform spanning fourteen product verticals — consortium, home equity, real-estate credit, FX, wealth, insurance and investment guarantees among them — designed at two breakpoints. In a team of five I owned two of the six role flows end to end, advisor and head, across 722 desktop and 764 mobile frames, and built the head-visibility rule as working UI rather than leaving it as a note. Two flows of six is the claim; the other four and the wider platform belong to the rest of the team.
- Role
- Designer in a team of five — sole owner of two of the six role flows
- Timeframe
- May 2024 – Nov 2024
- Stack
- Figma
- Evidence
- Design file
Custom enterprise CRM for Banco Safra's investment-advisory arm (KAT), spanning 14 financial verticals (Home Equity, Real Estate Credit, Consórcio, FX, Wealth, Life Insurance, and Investment Guarantees). Owned the operator-facing Assessor (Advisor) and Head flows end to end across 722 desktop and 764 mobile frames, including 11 Head vertical dashboards, 43 signed developer annotations, role-restricted pipeline visibility, and a stakeholder Maze usability test.
Agency employment at Sagitta, delivering for Banco Safra as end client within a 5-person team (1 tech lead, 2 designers, 2 developers). The platform was divided into separate role files: I owned the Assessor and Head workflows in their own file (Safra - Assessor & Head), while Gestor, Líder, Team Líder, and Admin flows were assigned to the second designer in a separate repository. Documented between May and November 2024.
Enterprise investment advisory across 14 verticals
- 1,486
- total frames designed across desktop (722) and mobile (764)
- 14
- financial product verticals mapped end to end
- 43
- in-canvas developer annotations signed 'Juan Pablo'
- 30
- process stages in the HomeEquity workflow
Private banking and investment advisory cannot function on generic CRM pipelines. Advisors triage complex client holdings, balance capital commitments, and route multi-million-real transactions across highly specialized desks — from offshore wealth structures and foreign exchange to home equity and consórcio. Each vertical operates under its own legal compliance checkpoints, credit review cycles, and documentation requirements.
The dual-role architecture: Assessor execution and Head governance
The Assessor & Head system isolates operational triage from vertical leadership across two dedicated roles:
- Assessor Operations — The frontline advisor tracks leads through a multi-stage Kanban pipeline, evaluates portfolio liquidity, logs preliminary meetings, and packages credit dossiers for desk review.
- Head Vertical Governance — Vertical department heads monitor pipeline throughput across 11 dedicated dashboards (Crédito, Câmbio, Consórcio, Seguro, Auto, Convênio PF, Convênio PJ, Offshore DCS, Wealth, and main DashboardHead).
- Restricted Visibility Logic — Implemented directly into the interface ('Compartilhar processo com Head?') ensuring Heads only access deals explicitly shared by advisors within their specific product line.
- Deal Cancellation Safety — Enforced business rule ensuring cancelled processes terminate pipeline cards without ever purging underlying lead intelligence.
Deep mobile architecture: 764 frames, not a desktop afterthought
Rather than treating mobile as a responsive compromise, the mobile surface (Design Mobile) was engineered as an autonomous 764-frame product covering all 14 verticals. Advisors visiting high-net-worth clients required full mobile capability: 28 mobile Kanban boards, client study views (estudoCliente, estudoLista), calendar scheduling, and 9 mobile-specific component definitions (NavBarAssessorMobile, NavBarHeadMobile, pendênciasAssessorMobile).
The depth of workflow modeling is evident in HomeEquity: a 30-step progression spanning NovoProcesso, Alinhamento, Proposta, Reunião, AnáliseCrédito, DocumentosImóvel, Vistoria, Contrato, Assinatura, and Registro. Every transition maps to explicit database stage changes.
Developer handoff: 43 in-canvas specs and Maze validation
To eliminate guesswork for the engineering team, I embedded 43 in-canvas sticky notes directly alongside the mobile artboards. Each note is signed 'Juan Pablo' and articulates operational business logic in plain Portuguese — establishing meeting confirmation hierarchies, manual advancement triggers for FX heads, and multi-desk cancellation rules.
Prior to dev handoff, we conducted an interactive Maze usability test with primary stakeholders. Testing confirmed that the multi-role routing matched advisors' mental models, validating the UX before developers began configuring Bubble databases.
On an enterprise banking platform, design isn't about pretty cards. It's about ensuring a 30-step credit workflow never loses document integrity or leaks client visibility across competing desks.
Design system foundations and Bubble platform realities
The design was built upon an Untitled UI foundation, rebranded with a bespoke KAT token system: primary teal (#008F81), forest green (#0E5E59), dark teal (#022824), and gold accent (#CDA56C), paired with Sora typography. When the engineering team encountered Bubble database performance constraints during development, we iterated directly through design — redesigning bulk filial management into performant per-user controls.
Evidence
Delivered to the development team and built in Bubble. The UI held up during implementation: as developers encountered Bubble workload limits, design adaptations resolved the constraints (reworking cargo/filial inputs and multi-user filial permissions). Stakeholder usability was validated in a Maze testing session before handoff, confirming the workflow matched advisors' mental models. Because I rolled off before public deployment, production rollout status remains unconfirmed.