I’m Trace, a designer building design<>code workflows with AI and design systems

/PROJECTS

FIG. 01AI/WF
NAME
AI workflows
NOTES
Harnesses in Obsidian. Chains of .md skills. Agent workflows (essentially cron jobs) serving Discworld emojis and Futurama memes.
AI workflows

Harnesses in Obsidian. Chains of .md skills. Agent workflows (essentially cron jobs) serving Discworld emojis and Futurama memes.

/SELECTED WORK

3 systems into 1: Architecting the Helcim Design System through 4x company growth

  • FINTECH
  • DESIGN SYSTEM
  • DESIGN OPS
  • BRAND
ONE SYSTEM
3-1
Product, internal, and marketing audiences served by a single design architecture
REDUCTION OF UNSTRUCTURED WORK
80%
Led to higher quality work and faster turnaround times
ORG-WIDE INTAKE ADOPTED
1
The request system powering the HDS was later adopted and replicated by other departments
HDS FRAMEWORK
How the system is architected. Product, internal, and marketing each pull what they need from four pillars: a comprehensive style guide, asset libraries in a DAM, a full UI system that carries product and crosses over when sales or marketing needs overlap, and the graphic system at the identifiable core.

tl;dr

When I joined, Helcim was growing fast from a team of about 30 to more than 120 in under a year. But brand and product weren’t keeping pace with each other. The brand spoke one language, the product another, and that fragmented experience showed up as churn.

Originally I was asked to organize the design team’s artifacts. Instead, the audit revealed a need for a different solution; the Helcim Design System framework. One ecosystem serving product, internal, and marketing, powered by an intake system I built. Out of that came a more consistent user experience from first touchpoint all the way to the product.

The documented icon library with sizes and usage specsThe documented icon library with sizes and usage specs
BEFORE & AFTER
Product iconography, the old set beside the new.
The icons evolved with the brand and the full family lives in a documented library.
01—

Two brands, one company

The website looked like the brand Helcim was becoming, but the product still looked like the company it used to be. Every user who crossed from one to the other felt the gap, and the product experience churned with them.

The original ask was to organize the digital asset management system. Research across teams showed the real problem was bigger: nothing held the brand together across product, internal, and marketing.

IN PRODUCT
The new brand applied in product: Virtual Terminal and Credit Card Payments on the refreshed UI system.
02—

The HDS architecture

I architected the Helcim Design System as one ecosystem with three consumers: product, internal, and marketing. Each pulls what it needs from shared pillars.

  • A style guide documenting how to use the brand
  • Asset libraries backed by a DAM
  • A full UI system carrying product, crossing over wherever sales or marketing need product visuals
  • A graphic system holding the identifiable core

One structure and one source of truth where a design decision made once lands everywhere at once.

03—

The engine underneath

An architecture only matters if work can move through it. I built a centralized intake system to power it: a request form that adapts to the type of work, routes straight into Asana, and sits one click away in a company-wide browser bookmark.

  • Ad-hoc design requests dropped by 80%, giving designers their focus back
  • Other departments later adopted the same intake structure for their own teams

As HDS evolved, I developed a brand guideline to aid in understanding and usage of our new brand elements. The guide is an open project with new entries added as the HDS grows.

Brand guideline page: the Helcim logo and its spacing guide
Brand guideline page: light and dark versions of the Helcim wordmark
Brand guideline page: the four primary colors, Purple, Peach, Grape and Lemonade
Brand guideline page: color ratio charts for primaries, warm and cold, light and dark
Brand guideline page: the Gradients Intense swatches
BRAND GUIDELINES
The guidelines, color spectrum, and gradients I developed for Helcim.
That vibrant palette set the brand apart in fintech years before gradients were everywhere.
The brand across web promos, campaign scenes, and card readers
The brand across social posts and newslettersThe brand across social posts and newsletters
APPLICATIONS
The system out in the world: web, social, email, and campaign work, all drawing from the same pillars.
04—

Evolving the brand at pace

With the structure and the engine in place, we evolved the brand faster than the team had ever managed before. The refresh ran across product, internal, and marketing together: new iconography, a new color spectrum and gradients, updated components, and templates for the teams selling and supporting the product.

The product caught up with the website. From top of funnel to the workflow inside the app, Helcim now presents itself as one brand.

Drag the scrollbar to scroll the site

HELCIM.COM
The Smart Terminal page on the evolved brand, with the new design system applied.

Design ops is the dark horse

There are a lot of moving parts to managing brand and product together. What came out of this work is how strongly design operations informs the success of a brand evolution, and how the tactical work cascades from it: updating the design system, achieving consistency.

Different pieces of the brand get built in parallel and get used across different functions. When those pieces line up, customers get a better product experience, and that shows up in lower churn and more new customers.

/FEEDBACK

Sheldon: Trace has a fantastic visual sensibility and brought real polish to our product.

01 / 08Jotson
Sheldon ManabatSenior Software Developer

Trace was instrumental in our product design efforts to deliver a clean and scalable design system that made development smooth and efficient. She brought real polish to our product through her thoughtful approach to iconography and visual design.

Her ability to balance design thinking with practical execution made her contributions incredibly valuable from both a product and engineering perspective.

If I had to point out at one of her strongest skills, that would definitely be the ability to look at a design piece, understand that something is off, and turn that vague feeling into an objective and actionable feedback.

This ability to effectively deliver feedback has brought a lot of value to the team output and increasing their work quality.

I loved how she brought fresh ideas to the table, explained everything clearly, and kept everyone on track toward our goals. The design system she built for us finally gave us the consistency we needed.

Trace works fast without sacrificing quality, quickly grasps complex information, and always delivers valuable insights. She’s approachable, genuinely cares about the work and was a true pleasure to collaborate with. I can’t recommend her enough!

I appreciate Trace's organized and analytical mind. She communicates clearly and helps add extra clarity to processes that might otherwise be muddy and unorganized.

She advocated for us, fostered collaboration, and invested in everyone’s growth. Her leadership created an environment where we could do our best work and support each other.

I learned so much from her about what it means to lead.

Working alongside Trace at Helcim was an absolute pleasure. I genuinely miss our collaboration.

If I had to highlight one of her many strengths, it would definitely be her talent for identifying solutions where none previously existed. Her approachability and support made challenging scenarios much smoother, and I was genuinely grateful to have her partnership.

When the client struggled with inconsistencies and scalability issues in their design system, Trace’s deep understanding of both design principles and technical constraints allowed her to implement a solution that not only addressed these challenges but also improved the overall user experience. The impact of her work cannot be overstated.

Her innovative approach to simplifying the design system was a game changer, leading to greater consistency, efficiency, and ease of use for the team.

She is a very strong leader and has immense skill in leading client workshops, especially in the UX and CDR space.

What’s up, what’s up.

Currently at Noterro, building a design-to-code workflow loop with a design system that’s readable by AI on Figma and from the codebase.

Before that, I led design operations at Helcim and designed products at Tiller.

I’ve been lucky to work product end to end. That means weaving comfortably between product discovery, product design, brand design, and design systems.

When off duty, I’m building internal tools and micro apps for fun.

If you’re looking to geek out about AI and design, I’d love to chat. Reach out and we can swap .md skills.