HOME PAGE

HOME

NEXT CASE STUDY

NEXT

Designloop

Designloop is a new feedback platform that serves the design community. Users can submit questions or work-in-progress assets to receive feedback from its community of designers.

TEAM:

1 Engineer • 3 Designers

STATUS:

Shipping Soon

DATE:

2025

ROLE

Led end-to-end design for onboarding and user identity. Worked with design and engineering leads to align the product, ensure feasibility and maintain quality.

Led end-to-end design for onboarding and user identity. Worked with design and engineering leads to align the product, ensure feasibility and maintain quality.

PROBLEM

Users need to know they’re receiving trustworthy feedback. How can the platform collect credibility-driven data and use it to build user confidence?

OUTCOME

Designloop ID, a badge used throughout the platform to surface expertise and establish credibility. So users can request feedback with confidence.

Designloop ID, a badge used throughout the platform to surface expertise and establish credibility. So users can request feedback with confidence.

The Solution

A PROFILE CARD THAT SURFACES DESIGN EXPERIENCE

Designloop ID, a badge used throughout the platform to surface expertise and establish credibility.

Designloop ID, a badge used throughout the platform to surface expertise and establish credibility.

A SIMPLE, SINGLE-SCREEN ONBOARDING FLOW

Users complete essential profile creation tasks through a single-screen experience. A typically tedious task reframed as a creative exercise to reduce friction and encourage completion.

Users complete essential profile creation tasks through a single-screen experience. A typically tedious task reframed as a creative exercise to reduce friction and encourage completion.

A TRANSFORMING MODAL THAT LIVE-EDITS EACH USER'S BADGE

Onboarding tasks are completed using a transforming modal that edits their badge in real time.

Onboarding tasks are completed using a transforming modal that edits their badge in real time.

EASY ACCESS TO COMMUNITY CREDENTIALS

The badge is used consistently throughout the platform as each user’s identity card, helping to build trust in this new community.

The badge is used consistently throughout the platform as each user’s identity card, helping to build trust in this new community.

Design Process

WE STARTED WITH TRIED AND TRUE PATTERNS FOR USER ONBOARDING

We started with a standard onboarding flow but it felt too typical for the design community. Onboarding needed to feel essential and connected to their product experience. This is where using onboarding to simulate a badge customization experience came into play.

WE DECIDED TO CHALLENGE NORMAL ONBOARDING CONVENTIONS

Inspired by employee IDs and conference badges, we decided to allow users to preview the profile card they were building. This concept blended familiarity and novelty but it still felt slow. We wanted users to start sharing work, not get trapped in a task-heavy process.

Inspired by employee IDs and conference badges, we decided to allow users to preview the profile card they were building. This concept blended familiarity and novelty but it still felt slow. We wanted users to start sharing work, not get trapped in a task-heavy process.

A NET-NEW ONBOARDING FLOW WAS NEEDED TO REDUCE FRICTION FOR USERS

We reframed the problem: onboarding shouldn’t feel like a chore. We pushed the badge concept further and explored multiple iterations to make the experience fast, simple, and fun. One version let users fill out the badge directly but it didn’t survive stress testing due to complicated UX factors and poor accessibility compliance that would compromise the badge’s visual integrity.

We reframed the problem: onboarding shouldn’t feel like a chore. We pushed the badge concept further and explored multiple iterations to make the experience fast, simple, and fun. One version let users fill out the badge directly but it didn’t survive stress testing due to complicated UX factors and poor accessibility compliance that would compromise the badge’s visual integrity.

ULTIMATELY, WE LANDED ON A BALANCED APPROACH THAT BROUGHT THE BEST OF BOTH WORLDS

We landed on a concept that centered on a blank ID card and badge editor. It put user identity and credibility front and center while shifting data input to a dedicated component. All on one page.

We landed on a concept that centered on a blank ID card and badge editor. It put user identity and credibility front and center while shifting data input to a dedicated component. All on one page.

THE LAST STEP WAS TO BUILD BADGE VARIANTS FOR DIFFERENT CONTEXTS

The last step was figuring out how the badge would look in different contexts. We initially designed three display states: hover, expanded, and full. Hover breakpoint was dropped to simplify the path to the full profile view. What remained struck the right balance: easy access without drawing undue attention to itself.

The last step was figuring out how the badge would look in different contexts. We initially designed three display states: hover, expanded, and full. Hover breakpoint was dropped to simplify the path to the full profile view. What remained struck the right balance: easy access without drawing undue attention to itself.

Target Metrics

PROTOTYPE TESTING WILL VERIFY IMPACT AND GUIDE FURTHER REFINEMENTS

In order to ensure that the designs translate to material business impact, the team defined clear goals for user testing.

In order to ensure that the designs translate to material business impact, the team defined clear goals for user testing.

50%+

50%+

50%+

ONBOARDING COMPLETION

ONBOARDING COMPLETION

Defined by how many users complete the onboarding flow. High completion rate means users are interested in the platform's benefits and are able to create a profile unimpeded.

< 1 Minute

< 1 Minute

< 1 Minute

PROFILE COMPLETION SPEED

Defined by how long it takes to complete the onboarding flow. Short completion time means that users know what to do, are unimpeded by pain points, and complete their profile.

40-50%+

40-50%+

40-50%+

PROFILE ENGAGEMENT

Defined by the percentage of users who interact with the profile page or settings after onboarding. Consistent engagement means user identity enhances their platform experience.

Design System

CUSTOM COMPONENTS FOR A BESPOKE DESIGN ELEMENT

To support a net-new onboarding process and create a custom platform ID, I needed to build custom and intricate components that drew from universal design patterns. So that it could be used consistently throughout the platform.

To support a net-new onboarding process and create a custom platform ID, I needed to build custom and intricate components that drew from universal design patterns. So that it could be used consistently throughout the platform.

Reflection

OUR NEXT STEP IS TO KEEP DEVELOPING THE CONCEPT OF CREDIBILITY WITHIN THE PLATFORM

The badge was a starting point. It gave users a simple way to show who they are and what they do—but it’s just the surface. The next step is layering in credibility signals that are earned through real interaction on the platform. That could mean tokens, points, or other indicators of trust. The idea is to keep building on the badge—turning it into something that reflects not just identity, but contribution.

The badge was a starting point. It gave users a simple way to show who they are and what they do—but it’s just the surface. The next step is layering in credibility signals that are earned through real interaction on the platform. That could mean tokens, points, or other indicators of trust. The idea is to keep building on the badge—turning it into something that reflects not just identity, but contribution.