A field color reference for designers

A field color reference for designers

Project Overview

Chroma is a mobile-first tool that helps designers capture real-world color and turn it into usable palettes instantly.

Instead of relying on memory, screenshots, or disconnected tools, Chroma bridges the gap between real-world inspiration and structured design systems.

Using a streamlined camera-first experience, designers can capture color, generate accurate values (HEX, RGB, CMYK, Pantone), and organize palettes into reusable collections.

The product is designed around speed and trust so inspiration isn’t lost, and color becomes something designers can act on immediately.

Chroma is a mobile-first tool that helps designers capture real-world color and turn it into usable palettes instantly.

Instead of relying on memory, screenshots, or disconnected tools, Chroma bridges the gap between real-world inspiration and structured design systems.

Using a streamlined camera-first experience, designers can capture color, generate accurate values (HEX, RGB, CMYK, Pantone), and organize palettes into reusable collections.

The product is designed around speed and trust so inspiration isn’t lost, and color becomes something designers can act on immediately.

Chroma is a mobile-first tool that helps designers capture real-world color and turn it into usable palettes instantly.

Instead of relying on memory, screenshots, or disconnected tools, Chroma bridges the gap between real-world inspiration and structured design systems.

Using a streamlined camera-first experience, designers can capture color, generate accurate values (HEX, RGB, CMYK, Pantone), and organize palettes into reusable collections.

The product is designed around speed and trust so inspiration isn’t lost, and color becomes something designers can act on immediately.

Problem

Designers constantly encounter inspiring colors in the real world but capturing and using that inspiration is surprisingly difficult.

Photos preserve the moment visually, but don’t provide usable color data. Existing tools are often too technical, disconnected from real world context, or unreliable in their results.

As a result, designers rely on memory, screenshots, or guesswork leading to lost inspiration, inconsistent color usage, and unnecessary friction in their workflow.

Key Insights

From the research, several clear themes emerged that directly informed Chroma’s design direction. First, users emphasized that capturing color needed to be fast and effortless; anything more than a quick tap would interrupt the inspiration moment. Second, many shared that once a photo was taken, the color often got lost in the chaos of their camera roll, never to be used or seen again. There was also a strong desire for control when it came to palette generation; users welcomed suggestions but wanted the flexibility to tweak or build on them. Finally, participants were comfortable with the idea of the app providing a “best match” rather than an exact color as long as the language was transparent and set the right expectations.

How might we create a workflow that helps designers turn real-world color inspiration into organized, usable palettes they can trust and revisit later?

Personas

After conducting interviews and based on the key demographics summary we were able to create our User Personas to find our ideal candidate.

Marcus DeLeon

Marcus, a graphic designer juggles three – five branding projects at a time

The Brand Focused
Graphic Designer

Age: 34

Occupation: Graphic Designer

Location: Portland, OR

Background:

Marcus works from his home studio in Portland, juggling three – five branding projects at a time for small businesses, startups, and nonprofits. Each client has a slightly different vibe, and color is a huge part of setting that tone early in the process. He’s constantly drawing inspiration from everyday life — signage at the farmer’s market, packaging at the co-op, even café tiles. He’ll snap a photo when something catches his eye, but those moments usually get lost in the camera roll or buried in random Pinterest boards.

What Marcus really wants is a way to capture those color moments quickly and organize them by project. When he sits down to design that label or wellness brand identity, the inspiration is ready to use, not forgotten.

Needs & Goals

• Quickly capture color inspiration in the moment (from physical spaces, objects, or environments)

• Build project specific palettes early in the design process

• Keep inspiration organized and ready to reference during client work

Frustrations & Pain Points

• Color inspiration gets lost in the camera roll or random Pinterest boards

• Can’t easily connect spontaneous inspiration to specific branding projects

• Manual color picking and organizing feels like unnecessary busywork

Marcus DeLeon

The Missionary

Age: 38

Occupation: Missionary

Location: Kenya

Background:

Will is a lifelong missionary currently serving in rural Kenya. His passion for connecting across cultures began early — as a child, his family frequently traveled to the Sahara Desert to visit unreached people groups, experiences that shaped his heart for service and intercultural understanding. Over the years, he’s learned to navigate diverse languages, traditions, and logistical challenges, often living for months at a time in remote villages. Will is deeply relational — he believes that genuine connection and listening come before teaching. Outside of his mission work, he enjoys documenting stories through photography and journaling, preserving the voices and faces of the people he meets so their stories are never forgotten.

Needs & Goals

• Translate a conversation I’ve been having with elders

• Organize my research findings

• Share these findings with my team

Frustrations & Pain Points

• I’m often stumbling through language barriers, trying to communicate on sometimes limited knowledge of dialects.

I would love to be able to focus more on the content of what’s being said rather than stumbling through the conversation.

• I have scattered notes and recordings of people in my notes app and in my photos... sometimes with sensitive information.

I need one place to store all this and be able to share it with my team

Marcus DeLeon

The Missionary

Age: 38

Occupation: Missionary

Location: Kenya

Background:

Will is a lifelong missionary currently serving in rural Kenya. His passion for connecting across cultures began early — as a child, his family frequently traveled to the Sahara Desert to visit unreached people groups, experiences that shaped his heart for service and intercultural understanding. Over the years, he’s learned to navigate diverse languages, traditions, and logistical challenges, often living for months at a time in remote villages. Will is deeply relational — he believes that genuine connection and listening come before teaching. Outside of his mission work, he enjoys documenting stories through photography and journaling, preserving the voices and faces of the people he meets so their stories are never forgotten.

Needs & Goals

• Translate a conversation I’ve been having with elders

• Organize my research findings

• Share these findings with my team

Frustrations & Pain Points

• I’m often stumbling through language barriers, trying to communicate on sometimes limited knowledge of dialects.

I would love to be able to focus more on the content of what’s being said rather than stumbling through the conversation.

• I have scattered notes and recordings of people in my notes app and in my photos... sometimes with sensitive information.

I need one place to store all this and be able to share it with my team

Priya Sharma

Priya designs sleek, functional kitchen gadgets

The Brand Focused
Graphic Designer

Age: 34

Occupation: Graphic Designer

Location: Portland, OR

Background:

Marcus works from his home studio in Portland, juggling three – five branding projects at a time for small businesses, startups, and nonprofits. Each client has a slightly different vibe, and color is a huge part of setting that tone early in the process. He’s constantly drawing inspiration from everyday life — signage at the farmer’s market, packaging at the co-op, even café tiles. He’ll snap a photo when something catches his eye, but those moments usually get lost in the camera roll or buried in random Pinterest boards.

What Marcus really wants is a way to capture those color moments quickly and organize them by project. When he sits down to design that label or wellness brand identity, the inspiration is ready to use, not forgotten.

Needs & Goals

• Quickly capture color inspiration in the moment (from physical spaces, objects, or environments)

• Build project specific palettes early in the design process

• Keep inspiration organized and ready to reference during client work

Frustrations & Pain Points

• Color inspiration gets lost in the camera roll or random Pinterest boards

• Can’t easily connect spontaneous inspiration to specific branding projects

• Manual color picking and organizing feels like unnecessary busywork

Priya Sharma

The Missionary

Age: 38

Occupation: Missionary

Location: Kenya

Background:

Will is a lifelong missionary currently serving in rural Kenya. His passion for connecting across cultures began early — as a child, his family frequently traveled to the Sahara Desert to visit unreached people groups, experiences that shaped his heart for service and intercultural understanding. Over the years, he’s learned to navigate diverse languages, traditions, and logistical challenges, often living for months at a time in remote villages. Will is deeply relational — he believes that genuine connection and listening come before teaching. Outside of his mission work, he enjoys documenting stories through photography and journaling, preserving the voices and faces of the people he meets so their stories are never forgotten.

Needs & Goals

• Translate a conversation I’ve been having with elders

• Organize my research findings

• Share these findings with my team

Frustrations & Pain Points

• I’m often stumbling through language barriers, trying to communicate on sometimes limited knowledge of dialects.

I would love to be able to focus more on the content of what’s being said rather than stumbling through the conversation.

• I have scattered notes and recordings of people in my notes app and in my photos... sometimes with sensitive information.

I need one place to store all this and be able to share it with my team

Priya Sharma

The Missionary

Age: 38

Occupation: Missionary

Location: Kenya

Background:

Will is a lifelong missionary currently serving in rural Kenya. His passion for connecting across cultures began early — as a child, his family frequently traveled to the Sahara Desert to visit unreached people groups, experiences that shaped his heart for service and intercultural understanding. Over the years, he’s learned to navigate diverse languages, traditions, and logistical challenges, often living for months at a time in remote villages. Will is deeply relational — he believes that genuine connection and listening come before teaching. Outside of his mission work, he enjoys documenting stories through photography and journaling, preserving the voices and faces of the people he meets so their stories are never forgotten.

Needs & Goals

• Translate a conversation I’ve been having with elders

• Organize my research findings

• Share these findings with my team

Frustrations & Pain Points

• I’m often stumbling through language barriers, trying to communicate on sometimes limited knowledge of dialects.

I would love to be able to focus more on the content of what’s being said rather than stumbling through the conversation.

• I have scattered notes and recordings of people in my notes app and in my photos... sometimes with sensitive information.

I need one place to store all this and be able to share it with my team

Solution

To address the gap between real-world inspiration and usable color data, I designed Chroma as a mobile-first, camera-driven experience that prioritizes speed, accuracy, and organization.

The core idea was simple: capture inspiration the moment it happens and immediately make it usable.

Instead of forcing users through complex tools or manual workflows, Chroma centers around a camera-first interaction model. Designers can quickly capture a scene, extract accurate color data (HEX, RGB, CMYK, and Pantone best matches), and generate structured palettes that can be edited, saved, and reused.

The experience was designed to reduce friction at every step, from capture to export, so that inspiration isn’t lost and color becomes part of an active design workflow rather than a passive reference.

Key Design Decisions

Key Design Decisions

Camera-first capture:

Designers needed a fast, intuitive way to capture color in context.
By prioritizing the camera as the primary interaction, users can go from inspiration to usable data in seconds, without navigating complex menus.

Automatic palette generation with manual control:

While automation speeds up the process, designers still want control.
Chroma generates palettes instantly, but allows users to refine, edit, and adjust colors balancing efficiency with creative ownership.

Accurate, multi-format color data:

Designers work across tools and mediums.
Providing HEX, RGB, CMYK, and Pantone best matches ensures captured colors are immediately usable in both digital and print workflows.

Project-based organization:

Inspiration often gets lost after capture.
Organizing palettes into project-based collections allows designers to revisit and reuse colors within a structured workflow.

Harmony exploration:

To support creative expansion, users can switch between harmony types (analogous, complementary, etc.), turning a single captured color into a broader palette system.

Export and integration:

Captured colors are only valuable if they can be used.
Quick export options (Figma, Adobe, copy values) ensure palettes move seamlessly into real design workflows.

Discovery and inspiration:

Beyond capture, Chroma introduces a discovery layer where users can explore shared palettes bridging personal inspiration with community driven creativity.

Information Architecture

To ensure Chroma felt fast and intuitive, I focused on structuring the app around its core user actions: capturing color, organizing palettes, and reusing them in real workflows.

I defined a clear architecture built around four primary areas:
Capture, Projects,Palette Viewer, and Export
Each designed to support a specific stage in the user’s workflow. This structure prioritizes speed and reduces cognitive load by keeping the most important actions immediately accessible.

By mapping these relationships early, I was able to simplify navigation and eliminate unnecessary steps between key actions. For example, capturing a photo flows directly into palette generation and saving, reinforcing a seamless transition from inspiration to usable output.

This approach ensured that Chroma’s structure supports how designers actually work, moving quickly from discovery to application, without forcing them through complex or disconnected workflows.

User Flow

With our Personas in mind, I was able to create a User Flow that was instrumental in defining how Chroma supports the specific needs of users. For designers like Marcus, the flow made it clear how quickly he could go from capturing a color in the real world to generating a usable palette for a branding project. This reinforces the app’s role in fast, inspiration-driven workflows. For Priya the User Flow outlined how she could locate a previously saved palette and export it to share with her team, helping bridge early color and palette discovery with collaborative decision-making.

Wireframes

Low-fidelity wireframes were used to rapidly explore and validate the core interactions within Chroma particularly around color capture, palette generation, and project organization.

By stripping away visual detail, I was able to focus on structure, hierarchy, and flow, and ensuring that key actions like capturing a color, saving a palette, and exporting data were immediately clear and accessible. This helped identify friction early and allowed for quick iteration before committing to final UI decisions.

These wireframes also clarified how users move from inspiration to output, reinforcing a seamless transition between capturing a moment and turning it into a usable design asset.

The progression from low-fidelity to final UI reflects how early structural decisions were refined—not reinvented—resulting in a more intuitive and efficient experience.

This approach ensured that visual design enhanced usability, rather than compensating for structural issues.

Branding & Design System

Chroma’s brand was designed to position it as more than a utility, it needed to feel like a creative companion that designers could trust in their workflow.

The visual identity reflects clarity, precision, and approachability, balancing technical accuracy with an accessible, creative tone. This was critical to ensure the product didn’t feel overly complex or clinical, despite working with detailed color data.

The name Chroma—rooted in color theory as a measure of intensity and purity—informed the visual direction. I intentionally leaned into saturated, high-contrast color to create a sense of vibrancy and immediacy, reinforcing the idea of capturing inspiration in its most vivid form.

Beyond branding, I established a lightweight design system to ensure consistency across the product. This included a defined color hierarchy, typography scale, and reusable UI components that support clarity and speed of interaction.

The system was designed to scale with the product—ensuring that as features expand, the experience remains cohesive, predictable, and easy to navigate.

#F3F0EB

#262626

#685BC7

#0087BA

#FE572A

#0FBA7E

SF Pro Display

H1

H1

Semibold

Semibold

20 Pt

20 Pt

H2

SemiBold

16 Pt

P1

Regular

16 Pt

P2

Regular

15 Pt

P3

SemiBold

14 Pt

SF Pro was chosen for its clarity and familiarity, supporting quick, effortless reading across the interface.

Results & Impact

Usability testing validated that Chroma’s core experience aligned well with how designers naturally gather inspiration. Participants were able to view color values and save palettes to collections with minimal friction, confirming the strength of the camera-first workflow.

Testing also revealed key areas for improvement. Some users needed prompting to complete actions, experienced confusion around where captured colors were stored, and struggled to locate features like “save to collection” and export. Inconsistent icon clarity and placement further contributed to uncertainty in key workflows.

These insights directly informed iterative refinements. The “save” action was redesigned for clearer intent, export functionality was repositioned for better visibility, and additional visual cues were introduced to reinforce system feedback. Navigation clarity was also improved to better distinguish between capture, profile, and collection states.

As a result, the final prototype delivers a faster, more intuitive experience that reduces ambiguity and supports designers’ real-world workflows. Chroma successfully bridges the gap between spontaneous inspiration and structured design output. This allows users to capture, organize, and reuse color without breaking creative momentum.

Shaman

Shadrachs Coffee

Shadrachs Coffee