#Tool
#Tool
#Tool
#Tool
#Tool
#Web3
#Web3
#Web3
#Web3
#Web3
#Figma
#Figma
#Figma
#Figma
#Figma
CommonValue
CommonValue
CommonValue
CommonValue
CommonValue
CommonValue
CommonValue
CommonValue
CommonValue
CommonValue
CommonValue
CommonValue
My role
My role
My role
My role
My role
My role
My role
My role
My role
My role
My role
My role
Product Designer — feature scoping, Research, interaction design, prototyping.
Product Designer — feature scoping, Research, interaction design, prototyping.
Product Designer — feature scoping, Research, interaction design, prototyping.
Product Designer — feature scoping, Research, interaction design, prototyping.
Product Designer — feature scoping, Research, interaction design, prototyping.
Product Designer — feature scoping, Research, interaction design, prototyping.
Team
Team
Team
Team
Team
Team
Team
Team
Team
Team
Team
Team
Pepo Ospina - SWE
Ido Gro - SWE/PO
Pepo Ospina - SWE
Ido Gro - SWE/PO
Pepo Ospina - SWE
Ido Gro - SWE/PO
Pepo Ospina - SWE
Ido Gro - SWE/PO
Pepo Ospina - SWE
Ido Gro - SWE/PO
Pepo Ospina - SWE
Ido Gro - SWE/PO
Overview
Overview
Overview
Overview
Overview
Overview
Overview
Overview
Overview
Overview
Overview
Overview
CommonValue enables communities to generate flexible reward mechanisms. based on both on-chain and off-chain data. Anyone can open a Campaign and choose a Strategy, for which the reward distribution will be based.
I led the end-to-end design direction of the web experience for creating, managing and funding campaigns and played a pivotal role in scoping and defining the claiming processes.
CommonValue enables communities to generate flexible reward mechanisms. based on both on-chain and off-chain data. Anyone can open a Campaign and choose a Strategy, for which the reward distribution will be based.
I led the end-to-end design direction of the web experience for creating, managing and funding campaigns and played a pivotal role in scoping and defining the claiming processes.
CommonValue enables communities to generate flexible reward mechanisms. based on both on-chain and off-chain data. Anyone can open a Campaign and choose a Strategy, for which the reward distribution will be based.
I led the end-to-end design direction of the web experience for creating, managing and funding campaigns and played a pivotal role in scoping and defining the claiming processes.
CommonValue enables communities to generate flexible reward mechanisms. based on both on-chain and off-chain data. Anyone can open a Campaign and choose a Strategy, for which the reward distribution will be based.
I led the end-to-end design direction of the web experience for creating, managing and funding campaigns and played a pivotal role in scoping and defining the claiming processes.
CommonValue enables communities to generate flexible reward mechanisms. based on both on-chain and off-chain data. Anyone can open a Campaign and choose a Strategy, for which the reward distribution will be based.
I led the end-to-end design direction of the web experience for creating, managing and funding campaigns and played a pivotal role in scoping and defining the claiming processes.
CommonValue enables communities to generate flexible reward mechanisms. based on both on-chain and off-chain data. Anyone can open a Campaign and choose a Strategy, for which the reward distribution will be based.
I led the end-to-end design direction of the web experience for creating, managing and funding campaigns and played a pivotal role in scoping and defining the claiming processes.
The challenge
The challenge
The challenge
The challenge
The challenge
The challenge
This wasn’t a typical fundraising product, it came with a pile of constraints- The campaigns were required to engage with both on-chain and off-chain data, signifying a combined use of the blockchain’s secure and transparent framework along with the agility and efficiency of external data systems. which, in general, is a hard pill to swallow.
This wasn’t a typical fundraising product, it came with a pile of constraints- The campaigns were required to engage with both on-chain and off-chain data, signifying a combined use of the blockchain’s secure and transparent framework along with the agility and efficiency of external data systems. which, in general, is a hard pill to swallow.
This wasn’t a typical fundraising product, it came with a pile of constraints- The campaigns were required to engage with both on-chain and off-chain data, signifying a combined use of the blockchain’s secure and transparent framework along with the agility and efficiency of external data systems. which, in general, is a hard pill to swallow.
North Star Design Principles
North Star Design Principles
North Star Design Principles
Optimize for clarity
Proactive Feedback
Product Excellence
Optimize for clarity
Proactive Feedback
Product Excellence
Optimize for clarity
Proactive Feedback
Product Excellence
Asking the questions that matter
Asking the questions that matter
Asking the questions that matter
Asking the questions that matter
Asking the questions that matter
Asking the questions that matter
We started off by trying to understand Who would potentially use this technology and in what contexts. It became clear to us that these user groups would include
We started off by trying to understand Who would potentially use this technology and in what contexts. It became clear to us that these user groups would include
We started off by trying to understand Who would potentially use this technology and in what contexts. It became clear to us that these user groups would include
What can it do?
What can it do?
What can it do?
The next question to answer is What kind of on-chain & off-chain processes can this product incentivize?
The next question to answer is What kind of on-chain & off-chain processes can this product incentivize?
The next question to answer is What kind of on-chain & off-chain processes can this product incentivize?
Auditing existing services
Auditing existing services
Auditing existing services
Auditing existing services
Auditing existing services
Auditing existing services
Platforms like Gofund me, Juicebox, Layer 3 were the ones that stood out to us the most. Since they each leveraged some form of incentivised interactions;funds being raised and rewards being given out. By testing each of these platforms and others, we were able to gather specific features that resonated with what we were building as well as ones we felt were impediments to a seamless user experience
Platforms like Gofund me, Juicebox, Layer 3 were the ones that stood out to us the most. Since they each leveraged some form of incentivised interactions;funds being raised and rewards being given out. By testing each of these platforms and others, we were able to gather specific features that resonated with what we were building as well as ones we felt were impediments to a seamless user experience
Platforms like Gofund me, Juicebox, Layer 3 were the ones that stood out to us the most. Since they each leveraged some form of incentivised interactions;funds being raised and rewards being given out. By testing each of these platforms and others, we were able to gather specific features that resonated with what we were building as well as ones we felt were impediments to a seamless user experience
Key Insights from Informal Interviews
Key Insights from Informal Interviews
Key Insights from Informal Interviews
In addition to the existing platform audit, we also felt it imperative to gain insights from users of our target demographic. We asked them each about their experiences with bonuses, giveaways, and bounties, their motivations, and their frustrations trying to achieve these goals that they find themselves coming across more often than none. This provided us with the puzzle pieces that we found were missing from our audit.
In addition to the existing platform audit, we also felt it imperative to gain insights from users of our target demographic. We asked them each about their experiences with bonuses, giveaways, and bounties, their motivations, and their frustrations trying to achieve these goals that they find themselves coming across more often than none. This provided us with the puzzle pieces that we found were missing from our audit.
In addition to the existing platform audit, we also felt it imperative to gain insights from users of our target demographic. We asked them each about their experiences with bonuses, giveaways, and bounties, their motivations, and their frustrations trying to achieve these goals that they find themselves coming across more often than none. This provided us with the puzzle pieces that we found were missing from our audit.
High-Level Goals
1
Social Integrations
This opens us to a larger user market share
2
Keeping it Familiar
Nothing should feel foreign for user types
3
Inclusivity.
User Experience Flows
User Experience Flows
User Experience Flows
User Experience Flows
User Experience Flows
User Experience Flows
In following Jakob’s law, we aimed to preserve and present as much familiarity with existing platforms as possible to users. This led us to categorize CommonValue user flow into three overarching phases:
Creating a campaign
managing a campaign &
Claiming rewards
In following Jakob’s law, we aimed to preserve and present as much familiarity with existing platforms as possible to users. This led us to categorize CommonValue user flow into three overarching phases:
Creating a campaign
managing a campaign &
Claiming rewards
In following Jakob’s law, we aimed to preserve and present as much familiarity with existing platforms as possible to users. This led us to categorize CommonValue user flow into three overarching phases:
Creating a campaign
managing a campaign &
Claiming rewards
Creating a Campaign
Creating a Campaign
Creating a Campaign
In creating a campaign, we needed to pay attention to what makes a campaign functional and relatable. which means the functions and customizable nature of the campaign had to be made to fit every platform we supported. The process was consolidated into 3 easy steps:
In creating a campaign, we needed to pay attention to what makes a campaign functional and relatable. which means the functions and customizable nature of the campaign had to be made to fit every platform we supported. The process was consolidated into 3 easy steps:
In creating a campaign, we needed to pay attention to what makes a campaign functional and relatable. which means the functions and customizable nature of the campaign had to be made to fit every platform we supported. The process was consolidated into 3 easy steps:
Basic Information
Basic Information
Basic Information
Contains the title, description and image of the campaign we also included the option to add an admin’s wallet address. By doing this, we extended the accessibility of a campaign to be controllable by Decentralized Autonomous Organizations (DAOs) as well as individuals
Contains the title, description and image of the campaign we also included the option to add an admin’s wallet address. By doing this, we extended the accessibility of a campaign to be controllable by Decentralized Autonomous Organizations (DAOs) as well as individuals
Contains the title, description and image of the campaign we also included the option to add an admin’s wallet address. By doing this, we extended the accessibility of a campaign to be controllable by Decentralized Autonomous Organizations (DAOs) as well as individuals
Rule-set
Rule-set
Rule-set
This is where all the fun happens. This is where the user chooses the platform and configures the campaign. In order to maximize our efforts, We started off with twitter and GitHub campaigns.
This is where all the fun happens. This is where the user chooses the platform and configures the campaign. In order to maximize our efforts, We started off with twitter and GitHub campaigns.
This is where all the fun happens. This is where the user chooses the platform and configures the campaign. In order to maximize our efforts, We started off with twitter and GitHub campaigns.
Funding type
Funding type
Funding type
Giving the creator a choice to fund individual or open it up for crowd-funding
Giving the creator a choice to fund individual or open it up for crowd-funding
Giving the creator a choice to fund individual or open it up for crowd-funding
Verify & Claim Reward.
Verify & Claim Reward.
Verify & Claim Reward.
Verification was quite tricky; we wanted users to be able to verify their accounts without using a direct integration, so we had to think of creative ways to achieve that. We slowly realized the same way we have to create the customizable components for each use-case, we also had to do the same for claiming rewards. For the Github campaign, a simple flow prompting them to create a public gist is shown. The flow maps that github account to the user’s wallet address. So we can remember them in the future.
Verification was quite tricky; we wanted users to be able to verify their accounts without using a direct integration, so we had to think of creative ways to achieve that. We slowly realized the same way we have to create the customizable components for each use-case, we also had to do the same for claiming rewards. For the Github campaign, a simple flow prompting them to create a public gist is shown. The flow maps that github account to the user’s wallet address. So we can remember them in the future.
Verification was quite tricky; we wanted users to be able to verify their accounts without using a direct integration, so we had to think of creative ways to achieve that. We slowly realized the same way we have to create the customizable components for each use-case, we also had to do the same for claiming rewards. For the Github campaign, a simple flow prompting them to create a public gist is shown. The flow maps that github account to the user’s wallet address. So we can remember them in the future.
Managing a campaign
Managing a campaign
Managing a campaign
After the campaign is created the creator can take a couple of actions
After the campaign is created the creator can take a couple of actions
After the campaign is created the creator can take a couple of actions
Lock or unlock the campaign
Lock or unlock the campaign
Lock or unlock the campaign
The campaign would be suspended, users who try to claim thier funds would need to reach out to the creator to unlock.
The campaign would be suspended, users who try to claim thier funds would need to reach out to the creator to unlock.
The campaign would be suspended, users who try to claim thier funds would need to reach out to the creator to unlock.
Cancel campaign
Cancel campaign
Cancel campaign
This cancels the campaign and returns the remaining funds back to the funders.
This cancels the campaign and returns the remaining funds back to the funders.
This cancels the campaign and returns the remaining funds back to the funders.
Cancel Merkleroot
Cancel Merkleroot
Cancel Merkleroot
To increase safety and transparency with the campaign creators, we send them a list of verified contributors weekly in the form of a merkleroot, so they can manually confirm it’s authenticity before releasing the funds to them. The creator would have the ability to pause being sent this list
To increase safety and transparency with the campaign creators, we send them a list of verified contributors weekly in the form of a merkleroot, so they can manually confirm it’s authenticity before releasing the funds to them. The creator would have the ability to pause being sent this list
To increase safety and transparency with the campaign creators, we send them a list of verified contributors weekly in the form of a merkleroot, so they can manually confirm it’s authenticity before releasing the funds to them. The creator would have the ability to pause being sent this list
We also wanted these functions to be accessible to DAOs. To do this, we added a button to access advanced options, where the DAO coordinator can easily copy and paste the call-data for Cross-contract interaction. And in the use-case when the advanced option is opened by the account of an individual creator, they simply see clickable buttons to initiate these actions.
We also wanted these functions to be accessible to DAOs. To do this, we added a button to access advanced options, where the DAO coordinator can easily copy and paste the call-data for Cross-contract interaction. And in the use-case when the advanced option is opened by the account of an individual creator, they simply see clickable buttons to initiate these actions.
We also wanted these functions to be accessible to DAOs. To do this, we added a button to access advanced options, where the DAO coordinator can easily copy and paste the call-data for Cross-contract interaction. And in the use-case when the advanced option is opened by the account of an individual creator, they simply see clickable buttons to initiate these actions.
Visual Design
Visual Design
Visual Design
Cards —Responsive & Versatile
Cards —Responsive & Versatile
Cards —Responsive & Versatile
The card component was highly critical from a content-organization perspective. It was designed to prioritize readability while accounting for responsiveness, flexibility, and i18n.
I put a lot of emphasis on redlining every property (structure, internal padding, colour tokens, etc.) to ensure a smooth design-to-engineering handoff.
It was also an opportunity to leverage Figma’s component properties functionalities to greatly speed up collaboration.
The card component was highly critical from a content-organization perspective. It was designed to prioritize readability while accounting for responsiveness, flexibility, and i18n.
I put a lot of emphasis on redlining every property (structure, internal padding, colour tokens, etc.) to ensure a smooth design-to-engineering handoff.
It was also an opportunity to leverage Figma’s component properties functionalities to greatly speed up collaboration.
The card component was highly critical from a content-organization perspective. It was designed to prioritize readability while accounting for responsiveness, flexibility, and i18n.
I put a lot of emphasis on redlining every property (structure, internal padding, colour tokens, etc.) to ensure a smooth design-to-engineering handoff.
It was also an opportunity to leverage Figma’s component properties functionalities to greatly speed up collaboration.
Stepper — a visual method for passive orientation.
Stepper — a visual method for passive orientation.
Stepper — a visual method for passive orientation.
Though small, it functioned to accurately represent the update flow and offer users with visual indication for progress and passive wayfinding.
Though small, it functioned to accurately represent the update flow and offer users with visual indication for progress and passive wayfinding.
Color Palette & Typography
Color Palette & Typography
Color Palette & Typography
Cards —Responsive & Versatile
Cards —Responsive & Versatile
Cards —Responsive & Versatile
The card component was highly critical from a content-organization perspective. It was designed to prioritize readability while accounting for responsiveness, flexibility, and i18n.
I put a lot of emphasis on redlining every property (structure, internal padding, colour tokens, etc.) to ensure a smooth design-to-engineering handoff.
It was also an opportunity to leverage Figma’s component properties functionalities to greatly speed up collaboration.
The card component was highly critical from a content-organization perspective. It was designed to prioritize readability while accounting for responsiveness, flexibility, and i18n.
I put a lot of emphasis on redlining every property (structure, internal padding, colour tokens, etc.) to ensure a smooth design-to-engineering handoff.
It was also an opportunity to leverage Figma’s component properties functionalities to greatly speed up collaboration.
The card component was highly critical from a content-organization perspective. It was designed to prioritize readability while accounting for responsiveness, flexibility, and i18n.
I put a lot of emphasis on redlining every property (structure, internal padding, colour tokens, etc.) to ensure a smooth design-to-engineering handoff.
It was also an opportunity to leverage Figma’s component properties functionalities to greatly speed up collaboration.
Retrospective
Retrospective
Retrospective
The product was launched at ETH-Lisbon in October 2022 and got amazing response from the industry, in a short period of 3 months we recorded over 80+ DAOs signing up for our Beta Application.
It excited many stakeholders — it fulfilled our PM’s vision, garnered engineering support, and set a critical stepping stone for Common’s future.
It came as surprise to everyone. January 2023, was a rough day. Due to financial constraints. The entire CommonValue team would be disbanded.
The product was launched at ETH-Lisbon in October 2022 and got amazing response from the industry, in a short period of 3 months we recorded over 80+ DAOs signing up for our Beta Application.
It excited many stakeholders — it fulfilled our PM’s vision, garnered engineering support, and set a critical stepping stone for Common’s future.
It came as surprise to everyone. January 2023, was a rough day. Due to financial constraints. The entire CommonValue team would be disbanded.
The product was launched at ETH-Lisbon in October 2022 and got amazing response from the industry, in a short period of 3 months we recorded over 80+ DAOs signing up for our Beta Application.
It excited many stakeholders — it fulfilled our PM’s vision, garnered engineering support, and set a critical stepping stone for Common’s future.
It came as surprise to everyone. January 2023, was a rough day. Due to financial constraints. The entire CommonValue team would be disbanded.
I still learned a lot though!
I still learned a lot though!
I still learned a lot though!
Whiteboards are awesome: Being in the space and seeing collective ideas visually unfold led to some of the most highly fruitful conversations I’ve ever had.
Finding opportunities within constraints: Viewing constraints from different perspectives helped brew new approaches to tackle other constraints.
Cross-functional partners should be involved from the start: It ensured that the project was progressing holistically — effectively accounting for content strategy and technical feasibility early.
Simplicity was about reducing complexity, not quantity: If an added extra step led to a more intuitive and error-free experience, it was worth the additional manual effort.
Whiteboards are awesome: Being in the space and seeing collective ideas visually unfold led to some of the most highly fruitful conversations I’ve ever had.
Finding opportunities within constraints: Viewing constraints from different perspectives helped brew new approaches to tackle other constraints.
Cross-functional partners should be involved from the start: It ensured that the project was progressing holistically — effectively accounting for content strategy and technical feasibility early.
Simplicity was about reducing complexity, not quantity: If an added extra step led to a more intuitive and error-free experience, it was worth the additional manual effort.
Whiteboards are awesome: Being in the space and seeing collective ideas visually unfold led to some of the most highly fruitful conversations I’ve ever had.
Finding opportunities within constraints: Viewing constraints from different perspectives helped brew new approaches to tackle other constraints.
Cross-functional partners should be involved from the start: It ensured that the project was progressing holistically — effectively accounting for content strategy and technical feasibility early.
Simplicity was about reducing complexity, not quantity: If an added extra step led to a more intuitive and error-free experience, it was worth the additional manual effort.
Retrospective
The product was launched at ETH-Lisbon in October 2022 and got amazing response from the industry, in a short period of 3 months we recorded over 80+ DAOs signing up for our Beta Application.
It excited many stakeholders — it fulfilled our PM’s vision, garnered engineering support, and set a critical stepping stone for Common’s future.
It came as surprise to everyone. January 2023, was a rough day. Due to financial constraints. The entire CommonValue team would be disbanded.
Let's Talk about the Next Big thing
Let's Talk about the Next Big thing
Let's Talk about the Next Big thing
If you want to work with me or just say hello?
If you want to work with me or just say hello?
If you want to work with me or just say hello?