IOHK
2023
Updating the NFT Experience on Lace
skills
Product Strategy / Art Direction / Interaction Design / Product Design / Javascript
my role
I joined IOHK/IOG as a Senior Product designer in 2022 to lead design on desktop apps. I was in charge of product strategy for Lace desktop and worked directly with the Engineering team in charge of Daedalus to maintain the product as it approached end of life and the company intended to sunset it. I collaborated with talented designers and engineers including Matteu H., Nnamdi E., Dan S., Elena H.
IOHK
2023
Updating the NFT Experience on Lace
skills
Product Strategy / Art Direction / Interaction Design / Product Design / Javascript
my role
I joined IOHK/IOG as a Senior Product designer in 2022 to lead design on desktop apps. I was in charge of product strategy for Lace desktop and worked directly with the Engineering team in charge of Daedalus to maintain the product as it approached end of life and the company intended to sunset it. I collaborated with talented designers and engineers including Matteu H., Nnamdi E., Dan S., Elena H.
IOHK
2023
Updating the NFT Experience on Lace
skills
Product Strategy / Art Direction / Interaction Design / Product Design / Javascript
my role
I joined IOHK/IOG as a Senior Product designer in 2022 to lead design on desktop apps. I was in charge of product strategy for Lace desktop and worked directly with the Engineering team in charge of Daedalus to maintain the product as it approached end of life and the company intended to sunset it. I collaborated with talented designers and engineers including Matteu H., Nnamdi E., Dan S., Elena H.
Discovering the opportunity for delight
During the 2 week sprint where I worked with the engineering team to design and launch Lace's collaboration with Ada Handle, I discovered an opportunity to add a little bit of delight to the product. NFTs in recent years have become a medium of expression, from PFPs to audio visual media. However, when testing the Handle experience on Lace, i realised that our NFT experience lacked the inherent richness that comes with NFTs!
designing a more delightful experience
I worked on this as a side-project over a single weekend where i did a full breakdown of the NFT experience across multiple wallets / Chains from Ethereum, Polkadot to Cardano. My goals were simple:
Improve the NFT viewing experience: I reviewed the end - to - end NFT experience to find opportunities to delight the user.
Improve the folder experience and sorting.
Design and javascript
Before this project, I had been building a fully working clone of the Lace web app inside Framer which became the team sandbox for testing new experimentation and features as well as conducting remote guided usability testing sessions.
I leveraged this sandbox in addition to creating custom components using JavaScript when creating the interactions for the NFT section.
I started by rigging prototypes inside Figma and then exporting the specs into Framer to for refinement and further exploration.
Learn how i designed and documented Lace's motion system.
Discovering the opportunity for delight
During the 2 week sprint where I worked with the engineering team to design and launch Lace's collaboration with Ada Handle, I discovered an opportunity to add a little bit of delight to the product. NFTs in recent years have become a medium of expression, from PFPs to audio visual media. However, when testing the Handle experience on Lace, i realised that our NFT experience lacked the inherent richness that comes with NFTs!
designing a more delightful experience
I worked on this as a side-project over a single weekend where i did a full breakdown of the NFT experience across multiple wallets / Chains from Ethereum, Polkadot to Cardano. My goals were simple:
Improve the NFT viewing experience: I reviewed the end - to - end NFT experience to find opportunities to delight the user.
Improve the folder experience and sorting.
Design and javascript
Before this project, I had been building a fully working clone of the Lace web app inside Framer which became the team sandbox for testing new experimentation and features as well as conducting remote guided usability testing sessions.
I leveraged this sandbox in addition to creating custom components using JavaScript when creating the interactions for the NFT section.
I started by rigging prototypes inside Figma and then exporting the specs into Framer to for refinement and further exploration.
Learn how i designed and documented Lace's motion system.
Discovering the opportunity for delight
During the 2 week sprint where I worked with the engineering team to design and launch Lace's collaboration with Ada Handle, I discovered an opportunity to add a little bit of delight to the product. NFTs in recent years have become a medium of expression, from PFPs to audio visual media. However, when testing the Handle experience on Lace, i realised that our NFT experience lacked the inherent richness that comes with NFTs!
designing a more delightful experience
I worked on this as a side-project over a single weekend where i did a full breakdown of the NFT experience across multiple wallets / Chains from Ethereum, Polkadot to Cardano. My goals were simple:
Improve the NFT viewing experience: I reviewed the end - to - end NFT experience to find opportunities to delight the user.
Improve the folder experience and sorting.
Design and javascript
Before this project, I had been building a fully working clone of the Lace web app inside Framer which became the team sandbox for testing new experimentation and features as well as conducting remote guided usability testing sessions.
I leveraged this sandbox in addition to creating custom components using JavaScript when creating the interactions for the NFT section.
I started by rigging prototypes inside Figma and then exporting the specs into Framer to for refinement and further exploration.
Learn how i designed and documented Lace's motion system.
NFT viewing experience
For the NFT drawer, I wanted to add some interaction to the static NFTs. I had an idea to use hover interactions to add delight. I wrote some custom code inside Figma to create a custom code component that allowed me to create a delightful interaction that i really liked.
NFT viewing experience
For the NFT drawer, I wanted to add some interaction to the static NFTs. I had an idea to use hover interactions to add delight. I wrote some custom code inside Figma to create a custom code component that allowed me to create a delightful interaction that i really liked.
NFT viewing experience
For the NFT drawer, I wanted to add some interaction to the static NFTs. I had an idea to use hover interactions to add delight. I wrote some custom code inside Figma to create a custom code component that allowed me to create a delightful interaction that i really liked.
presentation and handoff
I presented my explorations to the design team during a team feedback session, after walking everyone through my ideas and what my goals were, it was very easy to get buy-in from my manager and the entire design team to pursue a full fledged overhaul of the interactions designed on Lace.
It was similarly easy to get buy-in from the engineering team. I proposed a highly collaborative process that involved very low level details and documentation when handing off any interaction to make it easier for the engineers to build.
Button Hover /
Scale start: 0%
Scale end: 100%
Delay: 100%
Duration: 100%
Ease Value: Custom (0,0,0.58,1)
Label
116
I got a lot of great feedback from the engineering team for this approach and i enjoyed working on interactions and documenting them across Storybook, Confluence and Figma.
presentation and handoff
I presented my explorations to the design team during a team feedback session, after walking everyone through my ideas and what my goals were, it was very easy to get buy-in from my manager and the entire design team to pursue a full fledged overhaul of the interactions designed on Lace.
It was similarly easy to get buy-in from the engineering team. I proposed a highly collaborative process that involved very low level details and documentation when handing off any interaction to make it easier for the engineers to build.
Button Hover /
Scale start: 0%
Scale end: 100%
Delay: 100%
Duration: 100%
Ease Value: Custom (0,0,0.58,1)
Label
116
I got a lot of great feedback from the engineering team for this approach and i enjoyed working on interactions and documenting them across Storybook, Confluence and Figma.
presentation and handoff
I presented my explorations to the design team during a team feedback session, after walking everyone through my ideas and what my goals were, it was very easy to get buy-in from my manager and the entire design team to pursue a full fledged overhaul of the interactions designed on Lace.
It was similarly easy to get buy-in from the engineering team. I proposed a highly collaborative process that involved very low level details and documentation when handing off any interaction to make it easier for the engineers to build.
Button Hover /
Scale start: 0%
Scale end: 100%
Delay: 100%
Duration: 100%
Ease Value: Custom (0,0,0.58,1)
Label
116
I got a lot of great feedback from the engineering team for this approach and i enjoyed working on interactions and documenting them across Storybook, Confluence and Figma.
Impact
The impact for this project was mostly improvements in design and engineering processes.
"I introduced a new system for designing and shipping interactions which is loved and enjoyed by product, engineering and design"
key takeaways
I enjoyed designing fun interactions that do not slow down our app, I also enjoyed refining my JavaScript skills as well as flexing my documentation muscles.
credits
Thanks to this incredible team we exceeded expectations, S/O to them:
Interaction design
Kemdirim Akujuobi
Engineering / QA
Alan Leon
Documentation
Kemdirim Akujuobi
Product Management
Kemdirim Akujuobi
Princess Akari
Impact
The impact for this project was mostly improvements in design and engineering processes.
"I introduced a new system for designing and shipping interactions which is loved and enjoyed by product, engineering and design"
key takeaways
I enjoyed designing fun interactions that do not slow down our app, I also enjoyed refining my JavaScript skills as well as flexing my documentation muscles.
credits
Thanks to this incredible team we exceeded expectations, S/O to them:
Interaction design
Kemdirim Akujuobi
Engineering / QA
Alan Leon
Documentation
Kemdirim Akujuobi
Product Management
Kemdirim Akujuobi
Princess Akari
Impact
The impact for this project was mostly improvements in design and engineering processes.
"I introduced a new system for designing and shipping interactions which is loved and enjoyed by product, engineering and design"
key takeaways
I enjoyed designing fun interactions that do not slow down our app, I also enjoyed refining my JavaScript skills as well as flexing my documentation muscles.
credits
Thanks to this incredible team we exceeded expectations, S/O to them:
Interaction design
Kemdirim Akujuobi
Engineering / QA
Alan Leon
Documentation
Kemdirim Akujuobi
Product Management
Kemdirim Akujuobi
Princess Akari
Maintained by Kemdirim
© 2024
London, UK
10:47 AM