top of page

The Beacon is a fantasy roguelike RPG integrating NFTs, where players explore dungeons, face challenges, and trade in-game assets. I was responsible for designing the user interface, focusing on enhancing player engagement and simplifying NFT trading.

Challenge
The game needed an intuitive UI for its control panel and NFT trading platform to improve post-game usability and support seamless player interaction.
 

Process

  • Designed an interactive control panel where players could easily access stats and manage NFTs.

  • Created wireframes and prototypes for the trading platform, simplifying the exchange process for players.

  • Conducted usability testing with players to refine features and improve functionality.

The goal
 Was to prioritizing usability and aesthetic appeal was to enhance the post-game experience, fostering a more connected and immersive world for players to explore and interact with.

Reflection
Working on The Beacon taught me the importance of balancing immersive visuals with functionality to enhance the player experience.

Duration: 4 months / In development ATM

Role: UX UI Designer​

The Beacon: NFT trading platform

Where adventure meets the future: The Beacon merges fantasy and NFTs, offering a unique gaming and trading experience beyond imagination.

back.png
Explore.png

Sitemap

The sitemap for The Beacon is designed to ensure intuitive navigation and easy access to all key features within the platform. It is structured to guide users seamlessly through the various aspects of the game, from gameplay essentials to community interactions.

stiemap.png

The design system that captures the platform's essence by balancing a sense of playfulness with a clean, easy-to-understand layout, ensuring it remains engaging without feeling childish.

Design System

Style guide.png
explore before.png

Old explore

Explore.png

New explore

One of the key requirements was designing the explore page to make it more engaging for users while effectively communicating and notifying them. To achieve this, we implemented a notification system and added a news & activities section. Additionally, to enhance the page's lore and user interaction, a leaderboard was also incorporated.

Explore

Navigation 

Originally, the navigation was designed with a header and a burger menu in the right corner, but this setup limited access to the pages. To improve usability, we proposed switching to a sidebar menu, offering users a clearer and more organized structure for navigating the website content.

New navigation

menu.png

Old navigation

Profile_ui.png

The Profile

At the beginning of the project, it was essential that the profile showcase the user's character, pet, and chosen aesthetics in a captivating way. This included the house, where users invest significant time and money to creatively and originally decorate and configure their spaces.

The profile also needed to display run stats and records, allowing users to track and showcase their progress as gamers. Additionally, it featured the pet and character collection, along with a comprehensive item list. This list allows users to filter, sort, and search through their items, and includes the functionality for users to withdraw their items.

Old profile

portfolio before.png
Withdraw-ui.png

Trade Items

A key feature was enabling users to easily trade or withdraw items from their inventory while meeting Web3 and crypto requirements. A dedicated section was designed for trading NFTs earned in gameplay, allowing users to browse, buy, sell, and exchange items within a secure, user-friendly interface that integrates smoothly with the game’s economy.

bottom of page