Algoassets
An Algorand powered blockchain platform for minting NFTs
An Algorand powered blockchain platform for minting NFTs
Design Highlights
Algoassets is a marketplace for Algorand assets, most especially NFTs. It allows its users to buy, sell, mint, and store their art and craft work as assets on Algorand assets. It is built under the Algorand blockchain.
Inability for creator and artistst to earn money from their art and other creations through digital means. The need to make passive income from their art and craft.
Create a digital platform that will allow artists and creators to earn income from their art.
Four months
Conducting interviews
paper and digital wireframing
low and high-fidelity prototyping
conducting usability studies
iterating on designs
UI UX Designer
User Experience Researcher
Figma
Power Point
Adobe Creative Suite
Slack
Google form
User research
User Personas
Problem Statements
User Journey Maps
Sitemap
Paper wireframes
Digital wireframes
Low-Fidelity Prototype
Mockups
High Fidelity prototype
Accessibilty
Takeaways
Next steps
Research
I researched the users to understand the pain points of the artists and which of these pain points they wanted solved. At the end of the research, I was able to know that artists wanted a platform that could help them make passive. To better understand the users and how their problems could be solved, I did a competitor analysis, which exposed me to other platforms offering similar services. Some of the major weaknesses of these platforms are bad navigation and high gas fees.
User research
Earning extra income from arts and crafts created by artists and creators
Platforms offering similar services have high gas fees, making the creation of NFTs expensive
Online websites don’t provide an engaging browsing experience
Persona
Peju is a young entrepreneur in the art industry who needs a platform where she can sell her artwork to earn extra income and grow her business.
I created a user journey map of Mahalia’s experience using the site to help identify possible pain points and improvement opportunities.
Ideation
Difficulty with website navigation was one of the pain points for users, so I used that knowledge to create a sitemap. My goal here was to make strategic information architecture decisions that would improve overall website navigation. The structure I chose was designed to make things simple and easy.
Ideation
Next, I sketched out paper wireframes for each screen in my web app, keeping the user’s pain points about navigating to creating an NFT and browsing other areas of the site.
Ideation
Ideation
To create a low-fidelity prototype, I connected all of the screens involved in the primary user flow of creating an NFT.At this point, I received feedback as insights from my usability study on my designs about things like the placement of buttons and page organization. I made sure to listen to their feedback, and I implemented several suggestions in places that addressed user pain points.
Minting Button: Users find it difficult to navigate to the creator’s page where digital art/NFT can be created.
Minting Process: Some users who aren’t familiar with this platform do not know how to create or mint new artwork/NFT on the platform
Design
To make it easy for users to carry out the primary goal on the website, a button for creating NFTs is added to the home screen of the page. To make it easy for users who do not know how to create NFTs/digital artworks, a new page is added to the website with the information on how to create NFT, it’s titled NFT 101
Design
I included considerations for additional screen sizes in my mockups based on my earlier wireframes. Because users use the web app from a variety of devices, I felt it was important to optimize the browsing experience for a range of device sizes, such as mobile and desktop so users have the smoothest experience possible.
Design
My hi-fi prototype followed the same user flow as the lo-fi prototype and included the design changes made after the usability study, as well as several changes obtained as an insight from the usability study.
Design
For accessibility, I implement dark mode in the web app design to reduce eye strain when being used in a dark environment.
For accessibility, I implement text hierarchy to make it easy to identify the most important elements on the page and to also make it easy for assistive technology
Another accessibility feature was to use landmarks to help users navigate the site, including users who rely on assistive technologies
Reflection
Our target users shared that the design was intuitive to navigate through, more engaging with the NFTs images, and easy to use
The most important takeaway for me is to always focus on the real needs of the user when coming up with design ideas and solutions and that even a small design change can have a huge impact on the user experience.