Project overview


Design Brief

Moon, a new startup with a mission to revolutionize the NFT marketplace business, has approached us to establish a visual language for their new NFT marketplace app . We are tasked with creating a digital product with a design-first approach and a deeply curated user experience.

Goal: Our primary objective is to create a visually stunning and user-friendly NFT marketplace app that meets the client's requirements and exceeds the expectations of their target audience. We aim to establish a unique visual language and design approach that sets the client's product apart from other NFT marketplaces. Our goal is to establish a visual language for this new NFT marketplace app that will scale seamlessly across multiple screens, create a UI library of the final UI design, and develop a functional prototype.

Scope/Specification: Our project timeline is three weeks long, with the first part dedicated to research and benchmarking, followed by moodboard creation and visual exploration. We will focus on a fully designed flow in high fidelity and then build a UI library and functional prototype. Our focus is on scaling the design across multiple screens while maintaining the visual aesthetic.

Target Audience: Our target audience includes tech-savvy individuals who are interested in NFTs and digital art. They value visual aesthetics and appreciate curated experiences. These individuals are comfortable in the world of crypto and NFTs and are likely to be artists, buyers, and sellers of digital art.

Scope of work and results: Our scope of work includes conducting research, creating mood boards, developing wireframes and a flow, establishing a unique visual language, designing a high-fidelity flow, creating a UI library, and developing a functional Figma prototype.Results: The project will result in a visually stunning and user-friendly NFT marketplace app with a unique visual language and design approach. The final deliverables are designed for mobile iOS and include a high-fidelity flow, UI library, and functional prototype that scales across multiple screens consisting of a splash screen, home screen, user profile screen, search screen, and NFT page.

About myself: As the product designer for this NFT marketplace app, I was responsible for establishing the app's visual language and designing the user interface. I conducted research and benchmarking, created mood boards, developed wireframes and high-fidelity designs for each screen, and worked closely with the client to ensure the design met their requirements. Additionally, I created a UI library for consistency and developed a functional Figma prototype for testing and feedback. My goal was to revolutionize the NFT marketplace with a design-first approach and a deeply curated experience for users.

Moodboards

During the visual research phase, I gathered inspiration from various sources. and platforms. I created three moodboards that reflected my findings and inspiration, using references and keywords to guide the visual direction of the app. The moodboard included quality images and pieces of design that captured the desired aesthetic and tone for the NFT marketplace app.

Moodboard 1

The first moodboard that I created for the NFT marketplace app had a futuristic and sleek design with a focus on gradients and dark tones. It featured pink and purple tones to add a sense of vibrancy and modernity to the design. The moodboard showcased various design elements such as typography, color palettes, and UI components to convey the desired aesthetic. The use of gradients and dark tones added depth and visual interest to the design, while the pink and purple tones added a sense of playfulness and uniqueness.

Moodboard 2

The second moodboard had a more retro-inspired design, with a focus on gradients and pastel tones. The color palette was overall very colorful and playful, featuring design elements such as geometric shapes, bold typography, and a variety of UI components. The use of gradients added depth and visual interest to the design, while the pastel tones added a sense of softness and whimsy.

The goal of this moodboard was to offer an alternative design direction that could appeal to a wider audience while still conveying a sense of curated and beautiful experiences. The client's target audience, who value digital art and are tech-savvy, appreciate well-crafted design, making the second moodboard an appealing option. The overall aesthetic was intended to convey a sense of nostalgia and fun, taking cues from past design trends while still feeling fresh and contemporary.

The second moodboard had a more retro-inspired design, with a focus on gradients and pastel tones. The color palette was overall very colorful and playful, featuring design elements such as geometric shapes, bold typography, and a variety of UI components. The use of gradients added depth and visual interest to the design, while the pastel tones added a sense of softness and whimsy.

The goal of this moodboard was to offer an alternative design direction that could appeal to a wider audience while still conveying a sense of curated and beautiful experiences. The client's target audience, who value digital art and are tech-savvy, appreciate well-crafted design, making the second moodboard an appealing option. The overall aesthetic was intended to convey a sense of nostalgia and fun, taking cues from past design trends while still feeling fresh and contemporary.

Moodboard 3

The third moodboard I created was a departure from the colorful and playful design of the second moodboard. It had a more minimalistic, modern design, with a focus on simplicity and style. The color palette was more restrained, featuring primarily neutral tones such as white, black, and gray, with the occasional use of accent colors for contrast.

The design elements were kept simple and clean, with an emphasis on typography and negative space. The use of simple geometric shapes added visual interest without detracting from the overall minimalistic aesthetic. The goal of this moodboard was to offer a sophisticated design direction that could appeal to a more discerning audience while still conveying a sense of elegance and simplicity.

I included text notes on the moodboard to help me to articulate the specific design elements that I found inspiring and how they related to the app's target audience and goals. By documenting the moodboard in this way, I was able to share my vision with the client and ensure that the design direction was aligned with their expectations.

Visual Exploration

After creating the initial moodboards I explored them to visually determine which direction would best fit the client's vision. Ultimately, I decided to move forward with the second moodboard, which featured a more colorful and retro-inspired aesthetic. I felt that this style captured the essence of Moon's brand, which seeks to revolutionize the NFT marketplace with a fresh, playful approach.

The use of bold gradients and pastel tones adds a touch of whimsy and playfulness to the overall design, while the retro-inspired elements give it a unique, memorable feel.

Additionally, I chose to incorporate elements of depth and shadow to create a more immersive experience for users. This style will help set Moon's NFT marketplace apart from its competitors, while also appealing to its target audience of tech-savvy digital art enthusiasts who value curated, beautiful experiences.

Lock & Scale Design

To set up a tone and overall visual aesthetic for the NFT marketplace app, I opted for a playful and vibrant approach that matches the retro-futuristic feel of the selected moodboard.

I used pastel tones, bright colors, and gradients to create an engaging and visually stimulating experience. To ensure the design language was consistent across all screens, we scaled the design based on the wireframes provided by the client. I applied the same color palette, typography, and UI elements throughout the app to create a cohesive look and feel.

For example, on the home screen, we used a bold and playful font for the title, accompanied by a secondary font for the menu and other text elements. We also incorporated a carousel of featured NFTs that users could scroll through, with each NFT displayed in a card format to ensure consistency.

On the NFT page, we included a large image of the NFT with the option to drag it back to the home screen, as well as details about the creator and the current bid. We used a clean and simple layout to keep the focus on the NFT itself.

Overall, the goal was to create a fun and engaging visual aesthetic that matched the playful and innovative spirit of the client's brand, while also ensuring that the design was consistent and functional across all screens.

UI Library

During the project, I documented the design guidelines in a UI library, which included the typography and color system.

I used Figma to create a library of master components, which helped me maintain consistency throughout the design.

The color system was based on the moodboard and was carefully selected to match the overall aesthetic. Below is a preview of the typography, color palette and some of the master components I created for the project.

Design Solution

Prototype

Link to Prototype

Takeaways and next steps

Through this project, I learned the importance of conducting thorough visual research and moodboarding before starting the design process. I also learned the importance of consistency in design and the impact it has on the user experience.

Conducting thorough visual research allowed me to gather inspiration and references that helped me create a cohesive visual language for the app. I also honed my skills in prototyping, which helped me to refine my designs and make more informed decisions.

Finally, designing for mobile iOS required a deep understanding of the platform's guidelines and limitations, which I developed throughout the project.

Overall, the design of the NFT marketplace app had a positive impact on the target audience, as it was visually appealing and user-friendly, making it easier for users to browse and purchase NFTs. The client was also pleased with the final outcome, as it met their requirements and exceeded their expectations.