RECUR NFT Builder
.png)
Background
RECUR Builder is a low-code blockchain-based platform, which allows creators to design and launch their own NFT collections without needing to understand blockchain technology. With enterprise-level tools, users can easily create NFTs and distribute them in different ways, design marketplaces, and add gamification.
Overview
RECUR Builder is a self-service platform for businesses and individual creators to create, distribute, and manage NFTs with enterprise-grade tools.
Team and Role
Collaborated directly with
- 3 Project Manager (focused on different workflows)
- 3 Engineer Leads (focused on different workflows)
- Marketing Team: 1 Art Director, 1 Copywriter
My responsibility
As first and main product designer, I had a direct role in shaping the core design language, structure, templates, and overall UX for the platform.
- Design system
- Central design doc of defining general UX
- Collaborated cross-functionally to simplify complex systems and processes, resulting in an intuitive streamlined experience for creation, managing, scheduling, and post-analytics.
- Conducted workshops, user research, and usability tests to validate and improve insights.
Challenges
- Reducing the complexity to allow non-Web3 natives to understand how to utilize our products and technology.
- Cater to users of all levels - Clear and intuitive UI for all users to understand how to use the product, prioritize clear information delivery and avoid visuals that overcomplicate systems or add confusion.
- Focus on scalability to ensure that as we build our systems they can scale as our customer base scales in both quantity and in vertical.
.png)
Problem Statement
Our Web3 product is complex for non-Web3 users, lacks scalability for future growth, and limits community contributions, hindering broader adoption and collaborative expansion.
Goal Statement
Design a user-friendly Web3 product that simplifies the experience for non-Web3 users, ensures scalability for growth, and enables community contributions for ongoing expansion.
NFT Creation
A self-service approach to create NFTs that works for everyone.
How might we reduce the complexity to all non-web3 natives to understand how to utilize our products and technology?
1. Ensure a self-service approach that doesn't demand additional expertise beyond general knowledge.
2. Empower our users to be successful with the best practices.
3. Offer a streamlined experience that provides a straightforward and effortless process to create, publish, and edit.
4. Provide quick assistance and a pathway for learning and referencing.
5. Use pre-defined data and automation as much as possible to minimize stress and frustration.
6. Focus on scalability. Avoid struggling to adjust on an individual level.
Simplify the workflows
to onboard the next billion Web3 users.
Previous workflow and required data.
Previous Workflow and Required Data.
.png)
Once we clarified our vision, our top priority for developing NFTs was scalability, taking into account collections ranging from 10,000 to 1-of-1 NFTs. To simplify the creation process, we implemented a wizard that enabled the client to break down the complexities into smaller, more manageable steps.
.png)
NFT Management
Read-only table but offers customizable viewing options
Provide the users in getting to what they want to see, including searching, filtering, sorting, adjusting the display density, etc. My goal is to discover a way to showcase comprehensive details on both finalized and unfinished NFTs, Packs, Drops, Airdrops, and activities.
.png)
Implement a side drawer that enables users to view and modify all the intricate information. Rows only contain the generic data about the entries but more qualitative details about them also need to be displayed in a quick view side Bar(view-only drawer).
Navigation Design
With a such a complex system, how can we provide simplicity to navigation?
The Navigation system is role-dependent and differs among Admin, NFT Creator, Marketing/Sales, and Business Insider roles. The approach is to begin with fundamental functions, trickle down to advanced features. This aligns with the users' comprehension level of the product, progressing from basic to advanced. Additionally, a view-only version is available to prevent unintentional alteration of data.
Interaction
Conduct a usability test to go over 3 options to understand the best option for users to navigate through the site.
Key findings:
- The full menu should be open until users click the collapse button.
- Users should get all control on collapse or expanding the menu.
- When the menu is collapsed, tooltips will appear to indicate the icons.
Option 1(Selected)
Pros: being able to control whether collapsed or not
Cons: not always offer the maximum screen space
Option 2
Pros: Automatically collapse and expand by hovering, to give the user the maximum amount of the screen.
Cons: Accidentally Hover to open, which is quite bothering
Option 3
Pros: Click to expand and automatically collapse after making a selection, to give the user the maximum amount of the screen.
Cons: Extra clicks to expand the menu
Design Outcome
Onboarding the next billion users into Web3.
.png)
.png)
.gif)
.gif)
Impact
After launched, it has released over 380,000 NFTs to more than a million NFT collectors. RECUR Builder's vision is to bring billions of fans into the digital and crypto ecosystem by partnering with global brands like Playtika (29.4M average active users), Paramount Plus, and IP holders such as Hello Kitty, Nickelodeon, and Ninja Turtles. Its vision was highly praised by key stakeholders and clients
100%
Positive feedbacks
$32.29M
Total Sales
14,229
Total Seller
34,202
Total Paying Users
Takeaway
From the RECUR Builder Project, I learned how to build a complex product from scratch with the goal of onboarding the next billion users. We tackled two major challenges: how to motivate users to engage with the product and ensure that each user could easily navigate and use it. We focused on creating differentiation to enhance user motivation and delivering a frictionless user experience, making NFT creation both fun and accessible.
The most challenging aspect was was identifying and solving user pain points through testing and interviews, ensuring even non-web3 users could succeed. This project highlighted the critical role of user feedback in shaping an intuitive, user-friendly product.
.png)