CASE STUDY—HORIZON GAMES
Skyweaver NFT Marketplace
Skyweaver NFT Marketplace
Building a true-ownership marketplace for in-game crypto assets.
Building a true-ownership marketplace for in-game crypto assets.
Building a true-ownership marketplace for in-game crypto assets.
ROLE
Lead Designer
LENGTH
4 Months
AREA
Gaming, Crypto
ABOUT HORIZON
Horizon is a game studio startup that offers a blockchain-powered platform for decentralized gaming. Players enjoy the freedom of true digital ownership, open economies, provable fairness, privacy, and the ability to earn real-world value through play.
Horizon is a game studio startup that offers a blockchain-powered platform for decentralized gaming. Players enjoy the freedom of true digital ownership, open economies, provable fairness, privacy, and the ability to earn real-world value through play.
Horizon is a game studio startup that offers a blockchain-powered platform for decentralized gaming. Players enjoy the freedom of true digital ownership, open economies, provable fairness, privacy, and the ability to earn real-world value through play.
OVERVIEW
Skyweaver, currently in Alpha and the studio's first blockchain game title, is a free-to-play online multiplayer TCG similar to HearthStone, Magic the Gathering, and Legends of Runeterra. Skyweaver boasts a play-to-earn model where players compete to unlock and win NFT collectibles.
My role at Horizon was Director of Product, UX, where I doubled as a product designer on various projects while we grew the UX team.
Skyweaver, currently in Alpha and the studio's first blockchain game title, is a free-to-play online multiplayer TCG similar to HearthStone, Magic the Gathering, and Legends of Runeterra. Skyweaver boasts a play-to-earn model where players compete to unlock and win NFT collectibles.
My role at Horizon was Director of Product, UX, where I doubled as a product designer on various projects while we grew the UX team.
Skyweaver, currently in Alpha and the studio's first blockchain game title, is a free-to-play online multiplayer TCG similar to HearthStone, Magic the Gathering, and Legends of Runeterra. Skyweaver boasts a play-to-earn model where players compete to unlock and win NFT collectibles.
My role at Horizon was Director of Product, UX, where I doubled as a product designer on various projects while we grew the UX team.
OBJECTIVE
OBJECTIVE
OBJECTIVE
Design an NFT marketplace for Skyweaver's in-game collectibles, including Cards, Decks, and Heroes.
Design an NFT marketplace for Skyweaver's in-game collectibles, including Cards, Decks, and Heroes.
Design an NFT marketplace for Skyweaver's in-game collectibles, including Cards, Decks, and Heroes.
PROJECT REQUIREMENTS
PROJECT REQUIREMENTS
PROJECT REQUIREMENTS
Desktop and mobile responsive
Featured items landing page
Player to player trading
Market to player listings
Trade and purchase history
Cart and checkout process
Desktop and mobile responsive
Featured items landing page
Player to player trading
Market to player listings
Trade and purchase history
Cart and checkout process
Desktop and mobile responsive
Featured items landing page
Player to player trading
Market to player listings
Trade and purchase history
Cart and checkout process
CHALLENGE
CHALLENGE
CHALLENGE
The complexity of crypto asset management poses a challenge—really an industry-wide challenge. Design so that the technology is invisible. A good user experience in this space should work in the background and only surface at necessary points in the user journey.
The complexity of crypto asset management poses a challenge—really an industry-wide challenge. Design so that the technology is invisible. A good user experience in this space should work in the background and only surface at necessary points in the user journey.
The complexity of crypto asset management poses a challenge—really an industry-wide challenge. Design so that the technology is invisible. A good user experience in this space should work in the background and only surface at necessary points in the user journey.
Trust
Trust
Trust
The biggest challenge for online marketplaces is trust; customers need to trust that your platform will work if a transaction is involved. Furthermore, adding the uncertainty behind blockchain assets, we can expect to have to work very hard to ensure that our players will trust us with their hard-earned money. The user experience of both the marketplace and the crypto wallet must be the highest quality to earn that trust.
The biggest challenge for online marketplaces is trust; customers need to trust that your platform will work if a transaction is involved. Furthermore, adding the uncertainty behind blockchain assets, we can expect to have to work very hard to ensure that our players will trust us with their hard-earned money. The user experience of both the marketplace and the crypto wallet must be the highest quality to earn that trust.
The biggest challenge for online marketplaces is trust; customers need to trust that your platform will work if a transaction is involved. Furthermore, adding the uncertainty behind blockchain assets, we can expect to have to work very hard to ensure that our players will trust us with their hard-earned money. The user experience of both the marketplace and the crypto wallet must be the highest quality to earn that trust.
New Mental Models
New Mental Models
New Mental Models
Blockchain assets and crypto wallets are relatively new to consumers. There is a learning curve for transacting in crypto and the complex security practices behind owning a wallet.
Blockchain assets and crypto wallets are relatively new to consumers. There is a learning curve for transacting in crypto and the complex security practices behind owning a wallet.
Blockchain assets and crypto wallets are relatively new to consumers. There is a learning curve for transacting in crypto and the complex security practices behind owning a wallet.
User Profiles
User Profiles
User Profiles
The types of users that will be most comfortable with our game are users who have some experience with crypto. Users who are new to crypto but are fans of the TCG genre will have a more challenging time adapting to the crypto asset management side of the game. Lastly, users who are new to crypto and the TCG genre will be the toughest to retain.
The types of users that will be most comfortable with our game are users who have some experience with crypto. Users who are new to crypto but are fans of the TCG genre will have a more challenging time adapting to the crypto asset management side of the game. Lastly, users who are new to crypto and the TCG genre will be the toughest to retain.
The types of users that will be most comfortable with our game are users who have some experience with crypto. Users who are new to crypto but are fans of the TCG genre will have a more challenging time adapting to the crypto asset management side of the game. Lastly, users who are new to crypto and the TCG genre will be the toughest to retain.
TEAM
TEAM
TEAM
The team for this particular project was composed of the Head of Design (Game design), a Senior Front-end Developer, and myself as the lead product designer. We had support from the engineering team and our CEO, who was also head of engineering.
The team for this particular project was composed of the Head of Design (Game design), a Senior Front-end Developer, and myself as the lead product designer. We had support from the engineering team and our CEO, who was also head of engineering.
The team for this particular project was composed of the Head of Design (Game design), a Senior Front-end Developer, and myself as the lead product designer. We had support from the engineering team and our CEO, who was also head of engineering.
RESEARCH
RESEARCH
RESEARCH
I began by researching in-game marketplaces to understand some of the most common design patterns. Despite the novelty, the NFT component of our marketplace was not more important than nailing a core commerce experience.
The best market I found was the League of Legends in-game shop. Despite having a vast collection of items with varying complexity levels, they created a simplified experience that optimized what was most relevant to the player.
I also looked at NFT marketplaces and how they stacked up from a commerce perspective. Even the most popular seemed rushed through, where basic features like persistent carts were missing. From my experience at Shopify, I know that most visitors are more likely to convert after their second visit and are even more likely to buy after retrieving an abandoned cart.
I began by researching in-game marketplaces to understand some of the most common design patterns. Despite the novelty, the NFT component of our marketplace was not more important than nailing a core commerce experience.
The best market I found was the League of Legends in-game shop. Despite having a vast collection of items with varying complexity levels, they created a simplified experience that optimized what was most relevant to the player.
I also looked at NFT marketplaces and how they stacked up from a commerce perspective. Even the most popular seemed rushed through, where basic features like persistent carts were missing. From my experience at Shopify, I know that most visitors are more likely to convert after their second visit and are even more likely to buy after retrieving an abandoned cart.
I began by researching in-game marketplaces to understand some of the most common design patterns. Despite the novelty, the NFT component of our marketplace was not more important than nailing a core commerce experience.
The best market I found was the League of Legends in-game shop. Despite having a vast collection of items with varying complexity levels, they created a simplified experience that optimized what was most relevant to the player.
I also looked at NFT marketplaces and how they stacked up from a commerce perspective. Even the most popular seemed rushed through, where basic features like persistent carts were missing. From my experience at Shopify, I know that most visitors are more likely to convert after their second visit and are even more likely to buy after retrieving an abandoned cart.
Community Outreach
Community Outreach
Community Outreach
Although the game was still in Alpha, Skyweaver had amassed a strong Discord-based community of early-access players who had been testing the unfinished game for the past six months. They were eager to help test prototypes and influence the development of the product.
Although the game was still in Alpha, Skyweaver had amassed a strong Discord-based community of early-access players who had been testing the unfinished game for the past six months. They were eager to help test prototypes and influence the development of the product.
Although the game was still in Alpha, Skyweaver had amassed a strong Discord-based community of early-access players who had been testing the unfinished game for the past six months. They were eager to help test prototypes and influence the development of the product.
DESIGN
DESIGN
DESIGN
My process for designing this product was to dive into the possibility of what a blockchain game universe could look like. My decision to join the company was based on the fact that I'm both an early blockchain investor and a long-time gamer. I spent most of my time talking to the game creators, meeting with our alpha-testers and community manager, and reading through endless Reddit posts of blockchain TCG enthusiasts.
The economy and market dynamics were also essential to designing a marketplace. I spent time with our Economy team, understanding the mechanics of how the cards, decks, and craftables could evolve and expand due to a player-run economy. A certain level of uncertainty and flexibility had to be built into the market system's design and components.
My process for designing this product was to dive into the possibility of what a blockchain game universe could look like. My decision to join the company was based on the fact that I'm both an early blockchain investor and a long-time gamer. I spent most of my time talking to the game creators, meeting with our alpha-testers and community manager, and reading through endless Reddit posts of blockchain TCG enthusiasts.
The economy and market dynamics were also essential to designing a marketplace. I spent time with our Economy team, understanding the mechanics of how the cards, decks, and craftables could evolve and expand due to a player-run economy. A certain level of uncertainty and flexibility had to be built into the market system's design and components.
My process for designing this product was to dive into the possibility of what a blockchain game universe could look like. My decision to join the company was based on the fact that I'm both an early blockchain investor and a long-time gamer. I spent most of my time talking to the game creators, meeting with our alpha-testers and community manager, and reading through endless Reddit posts of blockchain TCG enthusiasts.
The economy and market dynamics were also essential to designing a marketplace. I spent time with our Economy team, understanding the mechanics of how the cards, decks, and craftables could evolve and expand due to a player-run economy. A certain level of uncertainty and flexibility had to be built into the market system's design and components.
User Journey
User Journey
User Journey
I designed a primary user journey that evolved and iterated into a core market user flow. There were two optimized paths into the checkout process:
The Shop(Later re-named Market) would be the likely path for new players since new players don't yet own cards.
The Card Library / Cards would be the likely path for players over a certain skill level since, much like in other TCGs, they would likely spend most of their time building decks and trading individual cards.
I designed a primary user journey that evolved and iterated into a core market user flow. There were two optimized paths into the checkout process:
The Shop(Later re-named Market) would be the likely path for new players since new players don't yet own cards.
The Card Library / Cards would be the likely path for players over a certain skill level since, much like in other TCGs, they would likely spend most of their time building decks and trading individual cards.
I designed a primary user journey that evolved and iterated into a core market user flow. There were two optimized paths into the checkout process:
The Shop(Later re-named Market) would be the likely path for new players since new players don't yet own cards.
The Card Library / Cards would be the likely path for players over a certain skill level since, much like in other TCGs, they would likely spend most of their time building decks and trading individual cards.
Wireframes
Wireframes
Wireframes
Once I identified the most likely conversion paths based on the game mechanics and player needs, I designed wireframes that catered to each group: The market and card paths.
On the Market Landing Page, I organized the content on the page from top to bottom by how frequently the content changes. The top 20% of the page is most influential on both desktop and mobile due to the responsive nature of the web app.
I used large callouts that would dynamically change based on the player's in-game XP.
Once I identified the most likely conversion paths based on the game mechanics and player needs, I designed wireframes that catered to each group: The market and card paths.
On the Market Landing Page, I organized the content on the page from top to bottom by how frequently the content changes. The top 20% of the page is most influential on both desktop and mobile due to the responsive nature of the web app.
I used large callouts that would dynamically change based on the player's in-game XP.
Once I identified the most likely conversion paths based on the game mechanics and player needs, I designed wireframes that catered to each group: The market and card paths.
On the Market Landing Page, I organized the content on the page from top to bottom by how frequently the content changes. The top 20% of the page is most influential on both desktop and mobile due to the responsive nature of the web app.
I used large callouts that would dynamically change based on the player's in-game XP.
The Market Listing Pages were the most dynamic. I based the layout on the existing card libraries and had to account for different content types and responsive screen sizes. The content types included cards, decks, and heroes(skins).
The Market Listing Pages were the most dynamic. I based the layout on the existing card libraries and had to account for different content types and responsive screen sizes. The content types included cards, decks, and heroes(skins).
The Market Listing Pages were the most dynamic. I based the layout on the existing card libraries and had to account for different content types and responsive screen sizes. The content types included cards, decks, and heroes(skins).
I then put prototypes in front of users and stakeholders and collected feedback on a user feedback GitHub board.
I then put prototypes in front of users and stakeholders and collected feedback on a user feedback GitHub board.
I then put prototypes in front of users and stakeholders and collected feedback on a user feedback GitHub board.
UI Design
UI Design
UI Design
Once all the feedback was collected and sorted on Github, I began designing the interface. Our Head of Design had developed a style guide to help standardize design across the game and web/mobile apps.
The two most complex pieces of the UI design were the deck-building component and the cart and checkout process. The deck-building component was an extension of the deck's section in the card library, sharing many interactions and user goals. The checkout process was unique because it interacted with live assets in your web3 crypto wallet.
Once all the feedback was collected and sorted on Github, I began designing the interface. Our Head of Design had developed a style guide to help standardize design across the game and web/mobile apps.
The two most complex pieces of the UI design were the deck-building component and the cart and checkout process. The deck-building component was an extension of the deck's section in the card library, sharing many interactions and user goals. The checkout process was unique because it interacted with live assets in your web3 crypto wallet.
Once all the feedback was collected and sorted on Github, I began designing the interface. Our Head of Design had developed a style guide to help standardize design across the game and web/mobile apps.
The two most complex pieces of the UI design were the deck-building component and the cart and checkout process. The deck-building component was an extension of the deck's section in the card library, sharing many interactions and user goals. The checkout process was unique because it interacted with live assets in your web3 crypto wallet.
TAKEAWAYS
TAKEAWAYS
TAKEAWAYS
There were many iterations between wireframing and UI design. We also had workshops around the components, engineering requirements, and limitations.
Being part of a lean startup means wearing many hats is something I've done before and am always excited to take on. Process is often the perceived enemy of lean, fast-paced production teams — but should never be set aside in the interest of fast delivery. Include your process in timing estimates, create an expectation of your process no matter how small the team, and re-iterate the benefits of thoughtful design.
There were many iterations between wireframing and UI design. We also had workshops around the components, engineering requirements, and limitations.
Being part of a lean startup means wearing many hats is something I've done before and am always excited to take on. Process is often the perceived enemy of lean, fast-paced production teams — but should never be set aside in the interest of fast delivery. Include your process in timing estimates, create an expectation of your process no matter how small the team, and re-iterate the benefits of thoughtful design.
There were many iterations between wireframing and UI design. We also had workshops around the components, engineering requirements, and limitations.
Being part of a lean startup means wearing many hats is something I've done before and am always excited to take on. Process is often the perceived enemy of lean, fast-paced production teams — but should never be set aside in the interest of fast delivery. Include your process in timing estimates, create an expectation of your process no matter how small the team, and re-iterate the benefits of thoughtful design.