FELT is an experimental digital art platform and artist collective that examines digital activism, hip hop culture, race, gender, and class through IRL and URL experiences.
With the recent rise of NFTs, many artists are trying to figure out how to utilize the medium to carve out a new model of equity for digital artists and creators. NFTs (non-fungible tokens) are a new type of digital asset; ownership of these assets are recorded on a blockchain - a form of financial technology that acts as a permanent digital ledger across multiple computers.
FELT wants to expand their platform and improve community engagement by incorporating a feature that will allow artists and their audience to collect and mint NFTs directly on the site. The feature will facilitate a new value system that will give users the power to trade tokens (digital assets) for other valuables such as future events, rare items, etc.
Embed a feature that integrates seamlessly with the current Felt website and flow smoothly with the rest of the platform
Design an interactive landing page that allows users to mint NFTs, place bids on artworks and collect artwork by connecting their digital crypto wallet.
A fresh product and simple user experience that allows users to bid and auction digital assets.
NFTs have managed to capture the collective imagination, they allow digital artists and creators to embed conditions of their work, determining how it’s displayed and even editioned. To better understand how NFTs work within the market, I looked into popular NFT platforms to identify their main strength and weaknesses. I wanted to learn how competitors are building community within their platforms and creating a model for interdependence for digital creators.
Currently, there are many different marketplaces to choose from, each have their own features and can be divided into two main groups: curated and non-curated. Curated markets like SuperRare, Foundation, and Zora require artists to submit an application in order to participate in their platform.
By being on a curated platform, artists have access to a specific audience of collectors and various tools such as different kinds of auctions. Non-curated platforms like Rarible and OpenSea have no entry barriers, so anyone can mint as long as they connect their crypto wallet. Non-curated platforms serve as a great starting point for many artists.
I also noticed that the top NFT platforms run on Ethereum and have had a reduction in their volume due to the increase in the GAS price (similar to paying interest) for ETH transactions.
User interviews with six artists and collectors helped give insight into what their main motivations, goals, potential frustrations are when interacting with an NFT platform. All participants were working artists from the ages of 22 and 28, most have less than a year of experience with minting and collecting NFTs, while others have no experience but understand the concept.
Everyone found a well-curated platform to be important and were motivated to be apart of an active community to be able to connect with fellow artists and collectors. Although a curated platform is important, most participants with experience minting began listing NFTs through an open market because it provided quick and easy access. A few participants mentioned their frustrations with high platform fees and rising GAS prices when making a transaction on the Ethereum blockchain, while others didn’t mind it. I learned that the most common way to store and monitor your crypto is by connecting to a MetaMask wallet.
After analyzing the current NFT ecosystem and conducting interviews, I determined that there were two main types of users involved. I created user persona profiles: the artist and the collector; this was made to better understand their goals and fears.
The research shows that a successful NFT platform should be open to both established and new artists, but with complete openness, certain issues arise – the fear of oversaturated and badly curated platforms could turn away potential investors. A problem with highly curated platforms is the lack of exposure and support for Black, Indigenous, POC and underrepresented artists. So how might I design a smooth, digital experience that is free and inclusive, yet tasteful?
I began to brainstorm on ways to accurately categorize information and display artwork. I wanted to create multiple opportunities for the Felt community to discover new artworks and artists, as well as ways to easily navigate through the site.
How would a user begin to search for new artists and artworks? What would encourage a user to place a bid on artworks they are unfamiliar with? I started by separating the main landing page into two main categories “live auction” and “discover”, after branching off from there I was able to see how we could create a curated space for both established and lesser known artists and artworks.
With the information in place, I was able to build out two main user flows. User Flow A shows how a user would place a bid on an NFT and User Flow B shows how a user would mint an NFT directly onto Felt’s platform. In order for users to complete either tasks, they would need to connect to their digital wallet. Connecting to a digital wallet will also sign users onto the site, giving them abilities to save and like artworks, create user profiles, and view or edit account settings. All options will ultimately encourage new and existing users to discover new works and engage with Felt’s community, creating a space is very supportive and responsive.
FELT's existing homepage works more like a blog or digital magazine, much of the content on the site are articles covering previous events or featured work. With this in mind, I made the decision to have the NFT feature live on a separate landing page that can be accessed through FELT's homepage navigation. The landing page would be curated to display the top NFT artworks and artists who have submitted their work to FELT.
Building the wireframes for the landing page was challenging but also the part in the design process that interests me the most. While working on the first round of wireframes, I ran into some conflicts with the overall layout and display of data. I initially attempted to mimic a similar layout style that FELT is using by having the cards touch, but this was not working for the digital assets. The cards felt cluttered and the information difficult to read. I learned how crucial it is to make use of the white space and how having a solid style guide could help organize the information being displayed. I reworked the cards to make better use of the space and gave the overall page a better ratio of white space.
In addition to designing the landing page, I built wireframes to implement the sign up and log in feature via a crypto wallet. For a user to be able to place a bid or mint an NFT on the site they need to connect to their crypto wallet - Crypto wallets store your private keys, keeping your crypto safe and accessible. They also allow you to send, receive, and spend cryptocurrencies like Bitcoin and Ethereum.
Whether a user has a digital wallet already set up or is new to the process, the sequence of steps should be as seamless as possible. With research I was able to observe how companies like Google, Paypal, or Metamask direct their users towards creating an account through a pop up window as a third party. The intention was to have as little steps as possible to keep users from abandoning the sign up form all together. I did this by creating a small pop up window that allows anyone to connect to either a Metamask or Formatic wallet, if a user needs to set up a wallet they can also do that directly on FELT's site. I split the sign up form into 3 simple steps that provides a link to download the crypto wallet extension onto the user's web browser and creates a password key for security purposes.
The other wireframes display the NFT's bidding details, bidding history, and artist's bio. The last page allows a user to list different types of NFT's by filling out a simple form.
The look and feel is simplistic and minimal due to the nature of it being a content heavy site, displaying lots of images and data. I choose to display all digital assets in a layout form that allows users to quickly browse through the cards, giving them the option to select a card and access more information. The decision to have a featured artwork section at the top of the landing page was so visitors can discover new works and be encouraged to select the artwork to learn more about the piece, the artist and its bidding history.
I mainly worked with black, grey, and white and used purple as the primary accent color. The decision to stick to simple colors was because the artwork would be the main focus on the site. I created a soft radial gradient border that would be used to separate between sections on the landing page as well as to bring forth a futuristic tech feel.
I compiled all the visual design elements and systems into a style guide and UI kit. With this, I designed a landing page that allows the user to start a quote, informs the user on who North Star is, customer testimonials, how to save by bundling products, and a quick access to the claims center for existing customers. I also designed the responsive UI for mobile and tablet devices.
To test the usability and functionality of the user flow, I created a high-fidelity prototype on Figma with clickable buttons and page transitions. The main goal was to observe learnability and determine how easy is it for users to navigate through the NFT landing page. It was important to understand what are the users main motivations when browsing through the FELT marketplace.
I wanted to observe when a user is most likely to sign up and become apart of the FELT community, and what will lead them to set up a crypto wallet. Most importantly I wanted to know what will encourage the user to explore new artworks and discover new artists to eventually buying an NFT.
To answer these questions, I met with three participants from the ages of 24 and 29 to test the site's functionality and usability. One participant is a digital artist but also has experience with investing in digital assets, one participant has five years of experience investing in digital assets, and the final participant had little to no experience with investing but was curious about the process.
The main objective was to test the overall quality of the design, functionality, navigation, and user flow of the site. To begin I wanted to observe how a user would go about completing the three main task flows which is to sign up and set up their wallet with Metamask, place a bid on the top featured artwork, and create an NFT.
• All participants liked the flow of the homepage, and wanted to select View More to continue browsing through the site.
• 2 participants wanted the ability to auction with different tokens, not just Ethereum tokens.
• 1 participant suggested that the top section of the landing page could be utilized differently, instead of having one top feature, there could be 3-6 top features and on the left could be featured collections such as virtual exhibitions.
• All participants successfully completed the task of signing up and creating a wallet.
• All participants were able to access the form to list their NFT but 1 participant did not follow through with the task.
Top Priority Adjustments
I used the insights and communicated findings from the usability tests to write a list of adjustments to help organize potential solutions. I prioritized certain feedback to iterate and refine the prototype.
• Change color of the main CTA buttons from black to a bright color so it can stand out.
• Allow for users to purchase with different kinds of crypto-currencies.
• Re-label input elements when listing NFTs.
• Rearrange main landing page so that collections is featured at the top next to top featured artwork.
I took the insights and communicated findings from the usability tests and put together a list to help organize potential solutions. Prioritizing certain feedback to iterate and refine the prototype and test it all over again.
The most challenging and time-consuming areas of this project and one that I am most satisfied with is the UI design. The cards displayed on the NFT landing page show important data that informs the user on the value and origin of the NFT. It was important to display the information in a way that makes sense to a user who has no experience investing in crypto.
If I could go back I would have spent more time implementing a search feature that could allow users to filter through different types of NFT's. I would have also spent more time working on the arrangement of categories on the main landing page, especially the top section. Utilizing the top area to its highest potential would encourage users to scroll through the rest of the page and engage with FELT’s community.
My next steps moving forward would be to do another round of product testing and continue iterating on that feedback.