Industry

Web3, Fintech

Company

Tronic.app

Tronic empowers brands
to gamify the concept of
brand loyalty.

Tronic empowers brands
to gamify the concept of
brand loyalty.

Tronic empowers brands to gamify the concept of brand loyalty.

Revolutionizing Brand Loyalty: Making Web3 Simple, Scalable, and Ready for Everyone

Revolutionizing Brand Loyalty: Making Web3 Simple, Scalable, and Ready for Everyone

Tronic is a Web3-powered loyalty platform that helps brands create journeys, checkpoints, and rewards for their customers. Users earn value by interacting with brands, and that value can be used in digital or physical spaces.

When I joined Tronic as Design & Prototype Director, the product was powerful but difficult for many users to understand. My role was to make the experience simple, clear, and scalable for both everyday users and brand partners.

Tronic is a Web3-powered loyalty platform that helps brands create journeys, checkpoints, and rewards for their customers. Users earn value by interacting with brands, and that value can be used in digital or physical spaces.

When I joined Tronic as Design & Prototype Director, the product was powerful but difficult for many users to understand. My role was to make the experience simple, clear, and scalable for both everyday users and brand partners.

The Problems I Needed to Solve

The Problems I Needed to Solve

When I joined, there were four big challenges:

1- Web3 is new and can feel confusing or overwhelming for many users.

2- The platform had to work smoothly for two different groups: users joining memberships and brands managing them.

3- The design looked and worked differently across parts of the product, so it lacked consistency.

4- I needed a faster way to test and share ideas before development.

5- The product was reaching only a limited audience, so I needed to make it more appealing and accessible.

Strategy & Execution

Strategy & Execution

1. Making Web3 Feel Familiar

1. Making Web3 Feel Familiar

1. Making Web3 Feel Familiar

Instead of designing around blockchain concepts,
I designed around user behavior.


  • Wallet connection worked like a simple sign-up flow

  • Memberships behaved like subscriptions

  • Rewards felt like stored value, not technical tokens


This approach reduced confusion and helped users focus on benefits rather than technology.


Result: Improved onboarding clarity and increased user confidence when joining loyalty programs.

2. Building One Unified Design System

2. Building One Unified Design System

2. Building One Unified Design System



When I began working on the design system, my intention was to bring structure and consistency to a product that was growing quickly.

I built a scalable design system in Figma that included:


  • Core UI components (buttons, inputs, tables, layouts)

  • Clear typography and color standards

  • Reusable components and structured variants

  • Web3-specific elements such as wallet states, badges, and achievement patterns


I also defined usage rules so designers and engineers knew when and how to use each component.


The intention was not just visual alignment, but operational efficiency. The system allowed us to design new features faster, prototype more quickly, and maintain consistency across the app, dashboard, and marketing site.


Result: Faster design iteration, Cleaner engineering handoff, and Consistent and professional brand experience.




3. Designing the End-User Web App

3. Designing the End-User Web App

3. Designing the End-User Web App

When I started working on the end-user experience, my intention was to remove hesitation and make users feel comfortable from the first interaction.


The problem was that Web3 elements like wallets, tokens, and memberships created uncertainty. Users were not always sure what would happen next, what they were earning, or why it mattered. This reduced trust and slowed adoption.


My goal was to design an experience where users clearly understood:


  • What they are joining

  • What they will earn

  • What actions they need to take

  • What value they receive in return


I simplified the structure by:


  • Cleaning up navigation

  • Creating clear step-by-step membership flows

  • Showing progress inside journeys

  • Making rewards and achievements visually understandable


Wallet connection was redesigned to feel like a normal sign-up process, reducing fear and confusion.

Instead of focusing on blockchain mechanics, I focused on user motivation and clarity. I made rewards feel tangible and progress feel meaningful.

The goal was to build confidence, increase participation, and help users complete journeys without needing technical knowledge.


Result:

  • Easier onboarding

  • Increased engagement with loyalty journeys

  • Higher membership participation and repeat interaction

4. Simplifying the Brand Management Dashboard

4. Simplifying the Brand Management Dashboard

4. Simplifying the Brand Management Dashboard

When I started working on the management tool, my intention was clear: brands should be able to launch, manage, and design loyalty journeys without needing Web3 knowledge or constant support from Tronic’s team.


The problem was not lack of features — it was that too much information was shown at once, and important actions were not clearly prioritized. In addition, creating journeys (defining checkpoints, rewards, and achievements) felt complex and technical. Brand managers needed confidence, speed, and clarity.


Brands needed advanced tools but not complexity.


I restructured the information architecture to:


  • Highlight primary actions

  • Organize advanced tools logically

  • Present analytics in a clean and readable format

  • Create a clearer step-by-step journey creation flow


For journey creation specifically, I designed a guided structure where brands could:


  • Define goals and checkpoints

  • Assign rewards and achievements

  • Review the full journey before publishing


This made journey building feel more like setting up a campaign rather than configuring a technical system.


I focused on helping managers quickly understand:


  • What programs are active

  • How users are engaging

  • What actions they need to take next


The goal was to reduce decision time, simplify journey creation, and remove confusion, so brands could focus on strategy instead of learning the system.


Result:


  • Reduced dependency on support

  • Faster program setup for brand partners

  • Improved usability for non-technical managers

5. Prototype-First Workflow

5. Prototype-First Workflow

5. Prototype-First Workflow

When I joined, one major gap was that ideas were hard to communicate and test quickly. Static screens were not enough for this product, because most of the value was in the flow: wallet connection, joining a membership, moving through a journey, and earning rewards.


My intention was to use prototypes as a tool for clarity and speed — not just for design presentation.


I designed three different types of prototypes, each with a clear purpose:


1) Fully clickable prototype for internal alignment and developers


Goal: Help product and engineering clearly understand the full flow and logic.

  • I built end-to-end clickable journeys

  • I documented states (loading, errors, wallet states)

  • I used the prototype to explain intent, edge cases, and priorities


Result: Faster alignment, clearer handoff, fewer back-and-forth questions.


2) Marketing prototype for selling the product to brands


Goal: Help the team explain Tronic’s value to brand partners.


  • I created a polished, guided demo flow

  • Focused on benefits and outcomes, not technical details

  • Used for stakeholder conversations and partnership pitches


Result: Stronger storytelling and easier communication of the product’s value.


3) User testing prototype for validation


Goal: Test task-by-task usability with real users.


  • I built task-based flows (connect wallet, join membership, complete a checkpoint, claim rewards)

  • Designed variations to compare what users understood better

  • Used findings to iterate before development


Result: Faster learning, reduced risk, and fewer wrong assumptions before building.


Overall, this prototype-first approach improved how fast we made decisions and how confidently we moved into development.

Business Impact

Business Impact

Business Impact

Through simplifying the experience, unifying the system, and improving validation speed, the product evolved from a niche Web3 tool into a scalable loyalty platform.

My work helped:

  • Broaden user accessibility beyond crypto-native audiences

  • Strengthen brand credibility

  • Improve internal design and development efficiency

Key Takeaways

Key Takeaways

Key Takeaways

This project demonstrates my ability to:

  • Turn complex technology into simple user experiences

  • Design scalable systems, not just screens

  • Align business goals with user needs

  • Use prototyping and motion to drive faster decisions


Tronic reflects my approach to product design: clarity, structure, and impact.