CLIENT

IOG (Previously IOHK)

ROLE

UI Design

YEAR

2022

IOG is a blockchain and cryptocurrency technology research and development company. Their work focuses on the creation of secure, decentralized systems that can be used for a variety of applications, including financial transactions and identity verification.

As part of the development of the Lace light wallet, IOG wanted to create a DApp store that would allow users to easily discover and interact with decentralized applications.

I was a member of the design team that was responsible for creating the DApp store, working alongside the Lead UI designer and development team. My primary responsibilities included UI design, production design, component library development and building a prototype of the DApp store.

What is Lace

Lace is a light wallet platform built on Cardano. A feature-packed platform streamlining online finance and acting as a portal to Web3.

This innovative wallet embodies the principles of true decentralization and interoperability with DApps and the blockchain ecosystem, facilitating the discovery of a wide range of digital experiences.

Manage your crypto assets and keep track of your wallet’s balance.

Manage your NFTs: store, view, send and receive.

Send and receive ADA and Cardano native tokens.

Stake and delegate your ADA to participate in the network and earn rewards.

Browse and access decentralized applications (DApps) built on the Cardano blockchain.

Vote, participate and decide which project ideas are funded.

The project brief

IOG tasked our agency with designing and building the DApp store for Lace.

Our objective was to create an intuitive marketplace that would allow users to interact with decentralized applications in the blockchain ecosystem while building trust through transparency and data sovereignty.

The challenge

One of the biggest challenges we encountered was collaborating with IOG's cross-functional teams, who were in charge of creating the different Lace wallet features.

Our team worked closely with product managers, developers, and other design teams to ensure that our efforts complemented the overarching goals and functionalities of the project. This intricate collaboration was essential to delivering a cohesive and user-centric DApp store for Lace.

Design approach

In the initial stages of the project, our design approach embraced a dual perspective, combining user experience considerations with technical intricacies. The UX team delved into comprehending the DApp Store's functionality, mapping out user journeys, while developers actively engaged in navigating the unique technical constraints posed by blockchain technology.

The showcased UX flows depict the journey of new and existing users, from sign-up process through the login recovery steps to the exploration of the DApp store.

Building a greyscale library

One of the most significant contributions I made to the project was utilizing an atomic design approach to create a versatile and modular library of components. I crafted a greyscale library that would work across other projects the IOG teams were focused on.



The atomic design methodology used in this project consisted in breaking down the interface design into fundamental building blocks - Atoms, Molecules & Organisms. The blocks were documented and organized in the library that served as a centralized source of truth, offering a versatile toolkit and establishing a shared language through the design system.

Building a greyscale library

One of the most significant contributions I made to the project was utilizing an atomic design approach to create a versatile and modular library of components. I crafted a greyscale library that would work across other projects the IOG teams were focused on.



The atomic design methodology used in this project consisted in breaking down the interface design into fundamental building blocks - Atoms, Molecules & Organisms. The blocks were documented and organized in the library that served as a centralized source of truth, offering a versatile toolkit and establishing a shared language through the design system.

Application

We defined basic elements and assembled them into more complex UI components, ensuring both granularity and scalability for our design system.



The library components included icons, buttons, input fields, badges, navigation panels and user profiles among other elements.

The DApp Store

Transitioning from wireframes and user journeys, our focus shifted to creating high-fidelity visuals that would bring the DApp Store to life.

Throughout the process, we maintained a strong focus on user and stakeholder feedback, regularly testing and iterating our designs to ensure that we were achieving our goals while also meeting the specific needs of the Cardano blockchain network.

My role involved collaborating with the lead designer and the front-end developer, producing assets to export and implementing design feedback across all screens, iterating and polishing the final visuals.

The focal point of the DApp Store's functionality is a marketplace environment in which users can explore a variety of decentralized applications.

Our design prioritizes transparency and security by providing users with information about the DApps & their providers and access to audit & certification details, informing about which DApp is legitimate and poses no risk.

DApp Store prototype

One of my roles was to build a functional prototype of the DApp store in Figma. The prototype was designed to showcase how the designs would come to life and to demonstrate to our team and stakeholders what the final product would behave like once built. My efforts were focused on ensuring that the design was visually consistent, easy to navigate, and demonstrated the DApp store functionalities.

Lace features

While we were working on the DApp store, IOG's teams were developing the rest of the Lace lightwallet features.

Discover new tokens and
manage your wallet assets.

Manage and store your NFTs
or send them to other wallets.

Securely send and receive ADA and Cardano native tokens.

Explore the different stake pools
and delegate your ADA to participate in the network.

Vote or delelgate and become part of the Cardano community.

Discover new tokens and
manage your wallet assets.

Manage and store your NFTs
or send them to other wallets.

Securely send and receive ADA and Cardano native tokens.

Explore the different stake pools
and delegate your ADA to participate in the network.

Vote or delelgate and become part of the Cardano community.

Discover new tokens and
manage your wallet assets.

Manage and store your NFTs
or send them to other wallets.

Securely send and receive ADA and Cardano native tokens.

Explore the different stake pools
and delegate your ADA to participate in the network.

Vote or delelgate and become
part of the Cardano community.

Project outcome & insights

Our team's hard work on the DApp store for Lace has resulted in an intuitive design that allows for a simple way to discover and connect with decentralized applications on the Cardano network. The collaborative stakeholder engagement and iterative feedback loops have ensured a positive project outcome.

As a designer on the project, I am thrilled to have contributed to this exciting development in the world of blockchain and cryptocurrency. Working on Lace has given me the opportunity to delve deeper into the capabilities of web3 and the potential it holds for revolutionizing industries. It has been a great learning experience for me, and I look forward to continuing to explore this rapidly evolving space.

Suggested Projects

Have a project?

Problems welcome, monotony not.