Moon Case Study

Hey Dribbble Community ??

This is my case study completed as work for the Figma Fundamentals course. Hope you like it!

?? The Brief

Our cohort was given a brief for the company Moon. Moon is a new up and coming startup with the goal of revolutionizing the NFT marketplace business with a design-first approach and a deeply curated experience for the users.

I was tasked with designing UI for their new mobile app.

?? Tasks

Establish visual language of this new NFT marketplace app that is ready to revolutionize the digital art scene
Lock a visual aesthetic and then scale the design on multiple screens, based on the wireframes and the flow that is provided from the client
Build a UI Library of the final UI and create a functional prototype

?? Approach

Create a moodboard
Design two different visual explorations
Design high-fidelity UI for five screens
Create a design system
Create an interactive prototype

?? Step 01: Moodboards

The first step in my approach was to conduct some visual research to gain inspiration for the design style of the app. I created two moodboards to capture elements I wanted to draw from in my design.

Below are the two moodboards I created ??

?? Step 02: Visual Exploration

Designs were conducted for two visual styles in order to explore different options.

The first direction was a bright, clean style with plenty of whitespace to draw attention to the vibrant art.

The second style had a similar direction, with the art being the main focus on the screen. However, this style was more vibrant and incorporated some deeper colours and gradients.

The two visual directions are shown in the screens below ??

?? Step 03: Lock & Scale Design

I decided to go with the second visual direction. I liked the vibrant purple and blue tones and fun gradients. I think this makes the app exciting and blahblah while still maintaining focus on the art with the generous amount of whitespace.

From here, scaled the design to all five screens.

Check out the screens below ??