hahuyenchi-portfolio

Overview

The Problem

Ilumia is a new NFT marketplace that offers a range of features, including buying and selling NFTs, creating new NFTs and collections, making offers and approvals on NFTs, staking NFTs for awards, and a launchpad and Automated Market Maker (AMM) function. However, as a new product, Ilumia faces the challenge of building a user-friendly platform.

My Approach

I began the project by studying the typical workflows of NFT marketplaces and identified three platforms with exemplary user experiences. Following extensive discussions with stakeholders and teams, we decided on a dark mode design for the site. With complex workflows, various constraints, and cases, the challenge was to maintain site consistency and manage design resources while ensuring a user-friendly experience.

Research Method

At the start of the project, I held multiple meetings with stakeholders and team members to better understand blockchain and cryptocurrency, which were new technologies for us. Recognizing the importance of familiarization, we conducted extensive research on similar products.

For the NFT marketplace, where interfaces are typically sleek and modern, targeted at tech-savvy users, we dedicated two weeks to researching the most popular features common across platforms. We then compiled a detailed report focusing on three major competitors: OpenSea, Rarible, and Magic Eden. This preparation has been crucial in positioning us to effectively compete and innovate within the NFT space.

An example of competitive research on the NFT marketplaces

After that, I worked closely with our blockchain research team to determine the main functions of our NFT marketplace and set up the project's workflow. The blockchain research teams also served as initial testers of our platform. They provided feedback on what worked well and what needed improvement, which was essential for refining our product.

Key Finding

Here are some streamlined strategies from our research on OpenSea, Magic Eden, and Rarible that could enhance your new NFT marketplace:‍

User-Friendly Interface: Develop an intuitive interface that makes navigating and trading NFTs simple for both beginners and experienced users
Low Fees: Keep transaction fees competitive to draw in and retain users.‍
Transparent Asset Information: Provide comprehensive details about each NFT to aid buyers' decisions and build trust.

With that foundation, I moved into the design phase of the project.

Design Process

File Structure

Because of the long-term nature of this project, I carefully looked around for references and evaluated other projects' setups. It turned out that having a substantial, expandable, and maintainable project setup is essential

Core: Contains foundational design guidelines and an icon library that all other design files reference.
WIP (Work in Progress): Area for experimenting and duplicating files, where designers can freely explore ideas.
Documents: Holds essential company assets, including brand guidelines and logos.
Archive: Stores finalized design files. Once designs are approved and finalized, they are moved here and not altered directly. For revisions, files are copied back to WIP for modifications.

This organizational method effectively addresses the challenges of maintaining a cohesive workflow and collaborating across different teams

Design Library

Following the initial setup, I established a design library filled with commonly used components that adhere to our predefined style guidelines

Design Process for individual function

‍Based on the nature and complexcity of each function, the process can be changed. But basically it contains: ‍

Defining User Stories: We begin by specifying user requirements for each function, focusing on users’ goals, motivations, and methods.
For example, we are designing for Create new NFT function, we can define the user's story like the following:

As an NFT creator, I want to be able to upload my digital assets easily so that I can create NFTs quickly and efficiently.
As an NFT creator, I want to be able to set the price and determine the sale conditions for my NFTs so that I have control over how they are sold.
As an NFT creator, I want to be able to view the performance of my NFTs so that I can track their success.

‍‍‍Creating Basic Flows: We map out the user journey for each function, detailing the steps needed to achieve their objectives within the platform

Following the example about "Create new NFT" function, we can define the basic flow as below:

Basic flow captures the key steps and actions

‍Developing Wireframes: Starting with low-fidelity wireframes, we sketch out the basic structure and user flow

A demo of the "Create NFT" screen wireframe design

Designing Interfaces: We refine the wireframes into detailed interfaces, conduct user testing, and iterate based on feedback

‍Handoff Design: The final designs are then transitioned from the design team to the development team for implementation.

Note: The complexity of a function may alter the design process, allowing us to streamline or expand certain steps as required. This flexibility ensures efficiency and adaptability in our project workflow.

The output

These images showcase the key features and functionalities of our project, allowing to get a visual representation of the end product. These images give an idea of how the project will look and how it will function.

Next Project

Internal Work Management