Bounties Network Explorer — v1.0

Part 1: A Design Retrospective

With the recent release of our new v1.0 white-label bounties explorer, we at Bounties Network have laid down a new foundation for our platform in the hopes that it will provide a more polished experience: one that is more utilitarian, versatile, contains less friction for new users, and that will better serve the gamut of bounty experiments that we continue to run as a part of our effort to usher in the new decentralized peer to peer economy.

Synthesizing user feedback

The previous iteration of the bounties explorer served to validate assumptions about how users would leverage bounties and the types of bounties that they would create. The primary goal during its lifespan was to learn about user needs in order to inform how it might evolve, and to utilize the platform as a testing ground for running experiments within specific contexts/verticals and with external partners.

The initial beta.bounties.network

Throughout its time online, we actively collected feedback around the beta project. When the time came to initiate a re-design, we had heard from many members of the community about what they would like to see in the next iteration and the insufficiencies they had encountered as a part of the existing experience. With a massive collection of feedback, we went through a process of distilling each point into task-centered job stories, turning each piece of feedback into a context-filled and concrete problem that we could design around and explore solutions for.

Throughout our design and development process, we made sure to maintain a collection of user-centric job stories in order to keep our design and development focus centered on the tasks that users were looking to accomplish.

Once prioritized, this collection acted as the north star we would aim for during the design and development cycle. During the beta explorer’s lifespan, these were some of the highlights from the feedback that we received.

Users wanted to be able to…

• …more easily find, filter, and sort through the collection of bounties available on the platform.
• …benefit from additional guidance through creating a bounty and providing all of the necessary information required to do so.
• …more easily keep track of bounties they had created, the activity that occurred in relation to those bounties, as well as the fulfillments they had submitted to others.
• …more easily consume details and metadata related to a bounty, and be able to easily distinguish and identify the actions they could perform in relation to each.
• In general (and as is the case across the current ecosystem of decentralized applications), new and experienced users were given little guidance around Web3 and wallet specific interactions, and could benefit from being provided with additional context and information.

UX audit of beta.bounties.network

In addition to leaning on user feedback to inform decision making, we took this redesign as an opportunity leverage our design expertise to perform a thorough UX audit: identifying ways in which we could improve the overall experience of the platform as a tool for both bounty issuers and fulfillers through general UX best practices. By defining user journeys for each of our primary user types, we were able to remain focused on the core tasks that each of these user types needed to perform and the milestones they would hit along the way. We proceeded to model the experience around these journeys, ensuring that we were providing the necessary context during each significant interaction so that users maintained an understanding of the state of their bounties, submissions, and Web3 transactions throughout.

As a result, our interface has expanded to accommodate the addition of several views, intermediary states, and multi-step flows that have led to a more user-friendly experience, and a more logical and well-structured information architecture. These include but are not limited to:

• A redesigned explorer view, with additional methods of sorting and filtering through bounties in any state

• New user profiles that provide an opportunity for users to share unique information about themselves to the larger community, in addition to acting as a hub for their bounties and submissions

• Improved display of platform stats such as submission acceptance rates, and user ratings given and received upon completion of a bounty as an early experiment towards the implementation of a more robust reputation system
• A new dashboard displaying users’ active and draft bounties, activity, submissions and their states

• Empty states that provide additional context around the absence of information and potential actions that the user can perform so they never feel stuck or blocked
• A new notification system to alert users of key activity on the platform
• A more robust and guided bounty creation form and flow that leaves much less ambiguity around metadata and crypto deposit/payout requirements for bounty issuance

• A new user account settings view that allows the user control over the information displayed on their profile, as well as the types of email notifications and correspondence they wish to receive from Bounties Network

Designing contextual patterns around Web3 transactions and their states

In addition to our effort to level up the foundational UX and UI layers of our application, we spent a significant amount of time considering the design of intermediary states and messaging surrounding specific Web3 interactions in order to ensure that the platform does a better job of managing our users’ expectations around how the product operates in the context of the Ethereum blockchain.

For new and experienced blockchain users alike, it’s immensely important to us to provide the appropriate context around new and potentially unfamiliar Web3 interactions such as signature requirements, wallet requirements and security, transaction states, and network connectivity. These application-wide patterns serve to set the stage for these wallet and blockchain operations to occur without being entirely disruptive to the user experience, and to allow us to continue to layer on a more considered and user-friendly on-boarding experience in the near future. Close collaboration with a UX minded engineering team allowed us to prototype and test potential solutions for these instances along the way.

Whilst designing these patterns, it was key for us to remain wallet agnostic in our implementation and messaging. With the flood of numerous dapp browsers and wallets to the space, it was important for us to design an experience that remained consistent and accessible regardless of the browser and wallet context.

Responsive Design

In order to truly execute on our goal to be wallet agnostic, it was necessary that our platform be entirely responsive and functional when accessed through a variety of mobile dapp browsers and wallets. While a dedicated native app for Bounties Network is certainly in the back of our minds for the future, it was necessary for this iteration of our application to be completely accessible on mobile devices due to the significant number of mobile users we have active on the platform.

Throughout the lifespan of the beta, we saw a steady increase in users accessing the bounties network explorer on mobile devices. Towards the end of the explorer in its beta form, this number was trending towards 50%. After the launch of our v1.0 explorer, 50% of users consistently access explorer.bounties.network on mobile devices.

Building a baseline component library / design system

While largely common practice in modern platform design and development workflows, it was of huge benefit before we began development for us to design and construct a baseline design system and component library to act as the building blocks for our new explorer. By establishing a consistent visual design language and considering the necessary states for each of our individual components, we were able to build and iterate quickly and efficiently and have set ourselves up to continue to be able to operate in this way as we iterate regularly on the platform.

WIP Shot of a selection of Explorer components

One of the unique challenges in creating a design system for an Ethereum dapp is the many instances of components unique to the blockchain — divergent from standard components found in Web2 applications. These components and any accompanying messaging work in tandem with our Web3/dapp wallet transaction patterns to set the appropriate context, and provide details around user addresses, states, and transactions.

Following the recent release of our new explorer, Bounties Network has begun collaborating with ConsenSys Design members working on an effort to create a well-researched and standardized Web3 design system (Rimble) that can be leveraged by the larger Ethereum community. Through consistent exchange of research, feedback, and testing, we hope to collaborate with ConsenSys Design and other torch-bearing dapps within the ecosystem to explore and define Web3 components that can be easily adopted in an effort to standardize common patterns where it makes sense to do so, and to lift the standard of design.

Outcome + Looking ahead

Since its release in September 2018, v1.0 of our bounties explorer has shown steady and consistent cumulative user growth.

• The cumulative value of bounties created on the network has almost doubled, and the value of bounties completed has also seen a steady and significant increase.
• The cumulative count of bounties created on the network has seen an increase of nearly 75%, and the count of bounties completed has seen an increase of nearly 66%.

At Devcon4 in Oct/Nov of 2018, Bounties was honored to receive the UX award for “Best General User Experience”, selected amongst 85 projects.

The goal of Bounties Network is to continue to strive towards best-in-class design as we iterate on the platform, and to constantly push the boundaries for the future of Web3 design. With those goals in mind, we are nowhere near finished, and hope to introduce several improvements to the platform as it continues its evolution into a more robust and versatile product in the future. Some things users can expect:

• Submission of intent to complete a bounty: allowing for bounty creators to preemptively approve those that wish to submit to their bounties
• Further insight into user transaction activity on the platform
• Bounty referrals: Refer other bounty fulfillers to a bounty
• Community features: Since we are so community focused, we want our users to be able to connect, communicate, and share
• Fiat currency conversion: allow users to convert the explorer’s default fiat currency to match their preference
• Invite to fulfill: Invite users to submit to your bounty
• …and much more!

Beyond functional improvements to the platform, we also look forward to adding layers of delight in the form of intelligent and meaningful interaction and visual design that enhances the experience and better represents our brand. We hope to continue to hear from everyone about how we can best serve the community with iterations to come, and hope that the community continues to be generous with its feedback and support.

Here’s how you can get in touch and get involved with Bounties Network:

• Join our Bounties Slack community
• Follow us on Twitter: Bounties Network, Corwin Harrell — Design Lead/Author
• Keep an eye on our Dribbble project for more UX/UI, Interaction, and Brand design in the works
• Like our Facebook page
• Stay tuned for updates

If you’d like to share the news with your friends in the community, we’d be forever grateful. We’re really excited about the launch and hope it will broaden the use of bounties way beyond technical applications.