Oliver Gonzalez – Product Designer

Stop right there!

Enter the password to continue.

Oliver González

Product Designer

About me

Selected work

Contact me

Oli Gzz

Product Designer

HOMELIGHT

Used AI to turn prototypes into production-ready experiences.

As an in-house product designer at HomeLight during the AI boom, I was able to learn a thing here and there about it, and use it to optimize design and front-end workflows.

SKILLS

Design Systems

User flows

Prototyping

TOOLS

Figma

Cursor

Claude

HotJar

HomeLight develops digital products for the real state industry – focused primarily on loan officers to help them navigate every step of the home selling and buying journey. From lead management platforms and loyalty programs to mortgage calculators and financial tools. The company has a broad ecosystem of products to streamline these processes.

My early days at HomeLight.

One of the first things I realized the team at HomeLight needed was a scalable design system. There was already a component library, but it wasn’t being adopted because it lacked the foundations to grow. This caused having products with inconsistencies, branding started to drift and developers often rebuilt components from scratch instead of reusing existing ones.

On my very first day, my project was to rebuild the design system from the ground up. I used the structure and guide behind Shadcn UI as a starting point, more specifically, its design token architecture, which at the same time is based on Tailwind. (I know… it gets a little confusing.)

Polished Figma components weren’t the final handoff. I used Cursor to bring the design system to life in a repository prepared by the dev team. The final deliverable wasn’t just a Figma library (which it was still very useful for us to update, iterate and experiment) – the final deliverable was a living component library with HTML, CSS, Tailwind and React snippets that developers could use as a shared source of truth.

FROM FIGMA

Having components methodically crafted: with clear states, variants, boolean properties, and using design-tokens for spacing, colors and typography is still essential.

Well structured components give IDEs like Cursor the context they need to build accurately.

We also created Cursors skills, to help the AI to produce more consistently.

…TO A LIVING COMPONENT LIBRARY

The result was a living design system in a shared repository that served as the source of truth for developers and "builders"—a role HomeLight coined for AI enthusiasts. Whether they were shipping production features or prototyping new business ideas, everyone worked from the same component library and design language.

AI assisted, not AI generated.

As mentioned above, a cool thing about having this living component library in a repo, is that it became also the foundations for the AI to build new features, flows and layouts in other repositories based only on wireframes, sketches or even prompts.

Since in Cursor we were able to reference the design system working space, agents were able to assemble interfaces using the components, applying their different rules and states, and output designs and complete flows almost ready for production.

A caveat! What the AI throws at first is not perfect, it still requires testing, iteration and human eyes, but it really boosts the workflow from idea to production.

Improving legacy experiences.

Part of my role involved improving existing experiences across HomeLight’s legacy products. Sometimes I got direct requests from product owners, while other times were about reviewing user sessions on Hotjar to uncover areas of opportunity—bugs, rage clicks, confused users and other friction points.

Reducing rage clicks

REDUCING FRICTION

IN SUBMISSION FLOWS.

In this example the primary CTA was hidden below the fold, especially at the most used viewport size.

Even after reaching the CTA, and after filling some of the input fields, users were often met with a disabled button without a clear explanation why.

Session recordings showed repeated rage clicks, indicating the interface wasn't communicating what users needed to move on.

CTA ALWAYS VISIBLE,

ALWAYS ENABLED.

Keeping the primary CTA visible and enabled throughout the flow reduced rage clicks, minimized confusion, and increased user engagement.

Users always knew how to proceed, and clicking the CTA when a field was missing, provided immediate feedback instead of leaving them wondering why they couldn't continue.

Users don’t have to do the math

WHY ASK USERS

TO DO THE MATH…

At one step in the submission flow, users were asked to enter their target equity amount using a simple input field.

Many dropped off at this stage because they didn't know the answer—or simply didn't have the information readily available.

…WHEN THE PRODUCT

ALREADY KNOWS.

Instead of asking users to figure it out themselves, we leveraged information they had already provided—such as the value of their current home, the value of their next home, and their remaining mortgage balance—to calculate a realistic equity range.

Rather than presenting a blank field, we presented guided options along with the strategy behind each one. This small change gave users more confidence, increased transparency, and helped them move through the flow without unnecessary friction.

Engagement after this tweak in the UI increased considerably.

New ideas, new features.

Improving legacy experiences was only part of the role. Product owners regularly brought me new ideas and features to design from scratch, each with different types of goals: increasing engagement, strength loyalty programs and introduce new offerings in HomeLight’s ecosystem.

Designing an elite program and a leaderboard to drive engagement and user retention.

Building mortgage tools that simplified decision-making while validating HomeLight's value.

Integrating new offeringsz into existing flows without disrupting familiar experiences.

Looking back.

Being a product designer in HomeLight, a company where the product team was primarily made up of engineers and fully embraced AI, really got me re-thinking about the design workflow.

Suddenly, Figma wasn’t my main tool anymore, but only the starting point. I frequently jumped into local environments and with the assistance of AI, I started shaping production ready UI.

This made me appreciate documentation even more. AI needs direction, and clear documentation is needed more than ever to avoid keep running in circles, fight ambiguity, abstraction and tunnel vision.

Now, Figma—or any visual canvas—is more valuable than ever. (Or maybe that’s just me trying to keep the “old ways” alive). Tools like these provide a bird's eye view and a place to explore ideas, compare alternatives, understand flows, and refine interactions. All of that is needed to give AI agents the proper context, instead of rolling the dice and waste tokens.

Hey, it’s me again!—

Let’s work together

Hey, it’s me again!—

Let’s work together

If you've made it this far, we should probably talk. Whether it's about design, digital products, or your favorite Figma plugin, my inbox is open.