Digital Briefcase: Design System & Feature Evolution

Role

Full Stack Product Designer

Timeline

November 2023 - January 2024

Tools

Figma, FigJam, Xcode, Notion

Deliverables

Client focus feature, Responsive UI updates, Design system ops, Page templates, Component checklist.

Overview

As part of a short-term collaboration with Geniant, CI&T, and Franklin Templeton for a global product launch, I supported experience design by producing production-ready assets, building new features, managing the design system, and creating prototypes. My work was grounded in user-centered design, guided by extensive user research to align with user needs and strategic goals.

Product & Role Overview

The Briefcase app is Franklin Templeton’s main presentation tool used by sales teams during live client meetings. When I joined the project, the company was preparing for an international rollout. The core product was strong, but important parts of the workflow and design system were slowing teams down at the exact moment they needed absolute reliability.

My responsibility was to step into this fast moving environment and stabilize the experience. I focused on reinforcing the design system, building features for experience gaps, reducing cognitive load for associates, and improving consistency across teams, devices, and compliance requirements

Situation

Digital Briefcase was approaching a global release, and three separate organizations were building it together:

• Geniant, where I sat, owned all user experience and interface design.
• CI&T handled engineering and implementation.
• Franklin Templeton oversaw the product direction, requirements, and approval.

Work was happening fast, and each group was operating from slightly different interpretations of how components should behave. At the collective pace we were all operating at, the design system began to drift. Components began to vary from the interaction models to the development prototypes and interaction patterns weren’t uniform. Even basic updates required long clarification threads between design and engineering.

I didn’t step into a clean, greenfield system, I joined a moving train. Features were already mid-development, and the system needed immediate stabilization without slowing delivery.

If Digital Briefcase was going to launch successfully, we needed to unify design patterns, improve predictability, and give all three organizations the same source of truth.

Tasks

My role as a Full-Stack Product Designer was to:

• Repair and strengthen the design system while features were actively being built
• Deliver new feature designs that addressed experience gaps and assure they were testable and ready for production
• Reduce confusion between Geniant design, CI&T engineering, and Franklin Templeton stakeholders
• Improve documentation, component logic, and interaction standards
• Ensure the product met enterprise-level expectations for quality, compliance, and performance

The goal: a unified system, a launch-ready product, and smoother collaboration across all organizations.

Actions

System Audit and Foundation Repair

I mapped every component in our single shared design file and compared the intended behavior with how those components were actually functioning in production. This revealed inconsistencies in naming, spacing, interaction logic, and variant behavior that only became visible once features were built. 

The audit exposed why the system appeared stable in design but behaved unpredictably in development. From there, I clarified the intended patterns, removed redundant or broken components, and standardized the logic so engineering had a reliable source of truth that matched the product’s expected behavior.

Rebuilding the Component Architecture

Some components were fundamentally unscalable, broken or both. I refactored the highest impact patterns including tables, filters, navigation, and modals so that the engineers at CI&T had clear and predictable rules to build from. This allowed designers at Geniant to create new screens without guesswork or improvised decisions.

I established page-level scaffolding that unified layout logic, responsive behavior, and shared interaction states across the product. By executing this alongside the core component refactor, I ensured new features could be shipped faster on a stable, repeatable foundation.

Designing New Features Within System Constraints

New features never stopped coming in. I defined end-to-end UX flows, information hierarchy, and edge-case logic while ensuring everything aligned to the repaired system. The goal was to make every new feature feel native, not bolted on.

Prototyping for Clarity and Validation

I built high-fidelity prototypes used by Franklin Templeton’s research team to test with financial advisors. The sessions revealed hesitation points, interaction uncertainties, and messaging issues. Those findings fed directly back into system updates and feature refinements.

Cross-Team Alignment

With Franklin Templeton guiding product priorities, Geniant designing the experience, and CI&T building it, alignment was mission-critical. I created reference frameworks, reusable patterns, and guidance that unified the teams around one shared design language. This stopped drift and reduced conflicting interpretations of the system.

Results

System and Workflow Improvements

Through design system repairs and clearer documentation, component-related QA issues dropped by thirty percent. Interaction patterns became predictable, reducing cognitive load for advisors and lowering friction for developers. For the first time in the project, Franklin Templeton, Geniant, and CI&T operated from a unified understanding of the design system. Handoffs clarified, review cycles shortened, and questions that previously required long discussions became straightforward.

Production Efficiency

I delivered over one hundred production-ready screens, assets, and prototypes supporting the global launch. System debt was reduced significantly through component consolidation and modernization. Engineering and design both moved faster with fewer blockers.

Launch Impact

Through targeted feature improvements, responsive refinements, and system hardening, the product launched as a cohesive enterprise tool rather than a fragmented MVP. Although we missed the upper productivity benchmark of 30%-35%, the 25% gain at launch demonstrated meaningful progress and a strong foundation for iteration.

Summary

This project required system repair, feature delivery, and multi-organization alignment happening simultaneously. My work stabilized the design system, streamlined collaboration across Franklin Templeton, Geniant, and CI&T, and ensured the product launched was unified and scalable.

This was not an exercise in making things look better. It was work done under intense pressure to reinforce the system at its core, giving Digital Briefcase a stronger platform from launch into the future.

other work.