Menu

123NFT

Home / User Experience + User Interface Design / 123NFT

Project Scope

123NFT: A simplified NFT guide for creators and collectors

123NFT serves as an open source educational website teaching the basics of NFT development and application from start to finish. This project was constructed and developed during my time in the Emerging Media Masters program at the University of Georgia. The goal of this project was to find a need and provide a solution.

Ideation + Execution

123NFT was birthed in the summer of 2021. My interest in NFTs came about after following the ongoing trends and seeing everything about it circulating on most of my social media platforms. Prior to this project I thought NFTs were just art. I had no idea that crypto and blockchain technology was involved. I, along with my partner, decided to explore this world further as there was not much information regarding the concept of NFTs and how to get into them at the time.

Our goal for this project was simple. We aimed to build confidence in creation, provide tools for understanding, and bridge the gap to learning. We achieved this through a module based format that broke up the basic information needed to understand the basics of crypto and how NFTs came into play.

For the project, my partner and I focused on our strengths. Using wordpress and a Sensei LMS plug-in, the site had so many ins and outs that were arduous, but we eventually overcame them to create a clean design that organized the information we found in a clean and straightforward way. I specifically was in charge of designing our style guide, presentations, and our project site. I also played a huge role in editing our audio and video content together as well as creating our trailer. The main creative tool I used for designing the style guide was Figma. I utilized Adobe Photoshop and Illustrator for graphics as well as logo work respectively. Additionally, I utilized Adobe audition for all audio content and used Adobe premiere to create our videos. Pulling vector images from the creative commons, I was able to animate these graphics using keyframes of mainly the position and scale, but sometimes manipulating opacity at times. In order to be considerate about accessibility, I went ahead and burned in captions so the content would be viewable by anyone. Finally, I used Adobe After Effects to create our trailer. Inspired by kinetic text, I matched visuals to a song produced through the creative commons license. Below, you can explore the aforementioned examples of the work I did on this project.

Style Guide

Style Guide Sample
Style Guide Sample 2

Project Site

Project Site

Project Trailer