Hectool

Hectool

Designed the core UX and high-fidelity UI for a B2B industrial tooling marketplace, simplifying complex product variants and building trust in a traditionally manual industry.

Designed the core UX and high-fidelity UI for a B2B industrial tooling marketplace, simplifying complex product variants and building trust in a traditionally manual industry.

Overview & Context

Overview & Context

Hectool is a B2B industrial tooling marketplace. I designed core flows, interaction logic, and high-fidelity UI screens to simplify complex product variants and build trust in a traditionally manual, relationship-driven industry.

"Industrial tooling procurement is slow, manual, and fragmented. Buyers lose time sourcing parts; suppliers rely on outdated catalogues. Hectool needed a modern marketplace to unify workflows, reduce errors, and support automation."

Stack

Hectool

Stack

Hectool

Stack

Hectool

Tools

Figma, Shopify

Tools

Figma, Shopify

Tools

Figma, Shopify

Role

Product Designer (UX/UI)

Role

Product Designer (UX/UI)

Role

Product Designer (UX/UI)

Timeline

2023 - 2025

Timeline

2023 - 2025

Timeline

2023 - 2025

Insights & constraints

Insights & constraints

"Industrial tooling procurement is slow, manual, and fragmented. Buyers lose time sourcing parts; suppliers rely on outdated catalogues. Hectool needed a modern marketplace to unify workflows, reduce errors, and support automation."

  1. Buyers need speed and clarity.

  2. Product complexity overwhelms non-expert users.

  3. Suppliers require bulk uploads and automated attribute mapping.

  4. Trust and reliability matter more than visual flair.

Vendor persona
Vendor persona
Vendor persona

Buyer persona
Buyer persona
Buyer persona

Design Principles & Interaction Model

Design Principles & Interaction Model

  1. Reduce cognitive load

  2. Make system architecture visible

  3. Enforce business and data logic through the UI

  4. Build trust through consistency and clear information

  5. Design for scalability across many products and variants.

Buyer happy flow
Buyer happy flow
Buyer happy flow

Vendor happy flow
Vendor happy flow
Vendor happy flow

High-fidelity screens included product pages with conditional dropdowns, structured variant cards, supplier dashboards, filtered product feeds, and an AI assistant entry point. All UI was built on a reusable component system.

  1. Faster, more confident product selection.

  2. Fewer misconfigurations.

  3. Clearer internal understanding of how variants should be structured.

  4. More efficient workflow for suppliers uploading and managing inventory.

35%

35%

35%

Increase in supplier onboarding speed

40%

40%

40%

In search result relevance

30%

30%

30%

Reduction in manual data entry errors

Product details page
Product details page
Product details page

Product feed
Product feed
Product feed

Product feed with the AI search modal open
Product feed with the AI search modal open
Product feed with the AI search modal open

AI assistant modal
AI assistant modal
AI assistant modal

Inventory management screen
Inventory management screen
Inventory management screen

Order tracking screen
Order tracking screen
Order tracking screen

Manage shopfront screen
Manage shopfront screen
Manage shopfront screen

Add product screen
Add product screen
Add product screen

Add variant screen
Add variant screen
Add variant screen

Add product screen
Add product screen
Add product screen

Marketing landing page
Marketing landing page
Marketing landing page

High Fidelity & Outcomes

High Fidelity & Outcomes

Challenges & Learnings

Challenges & Learnings

Variant complexity was underestimated, Shopify limited some ideal UX patterns, and balancing modern UX expectations with industry familiarity required careful iteration as scope evolved.

I learned how to structure highly technical B2B systems, design scalable IA, and create clear, logical interactions for complex marketplace products under real-world constraints.