Enabling Web3 Adoption with CSPR.click

Michael Steuer
CSPR Suite
Published in
14 min readJun 20, 2023

--

Blockchain is approaching its 15th anniversary. Web3, if you base it off the launch of Ethereum, is nearly a decade old. Since then, dozens of viable Web3 protocols have emerged. Yet the total number of users for Web3 applications sits at 420M users worldwide. With a world population of 8B people, an nearly equal amount of smart phones out there, internet penetration of 65%, and meanwhile 25% of adults globally still “unbanked” (who should be clamoring to participate in any financial system), why is that mass consumer adoption progressing this slowly?

The Web3 User Experience Sucks

Unless your operating system of choice in the 1990s was BeOS, you used to play Super Monkey Ball on your Nokia NGage in 2005, while listening to music on your Microsoft Zune, or were amongst those who were wearing Google Glasses in 2013 while posting your stories on Google Plus, i.e. you’re a textbook early adopter who doesn’t mind the (severely) rough edges of new tech, or you’ve been pulled into the crypto/NFT trading world and consider yourself a true “degen”, odds are you were turned off by your first attempt at using a Web3 application. This is a non-exhaustive list of the UX faux-pas you may have encountered in your onboarding endeavor:

Wallet Galore

You’re new to Web3 and someone told you to try out DeFi, or perhaps something as innocuous as breeding a Cryptokitty. What’s the first thing you need to do when visiting any Web3 application? Correct — you need to “Connect your wallet”. Most Web3 apps will present you with a screen sometimes containing up to several dozen choices for which wallet to “connect with”. Now as a newbie, you don’t have (and barely understand the meaning of) a “crypto wallet”. You just want to try out this app your friend has been raving about. Since you’ve never heard of “Rainbow” and don’t particularly trust “Trust”, this is when you probably bounce.

The first screen you see when visiting dYdX.exchange, one of the most popular Decentralized Exchanges

Where’s the “Web” in Web3?

Assuming you were adventurous and decided which of “imToken” or “iToken” to use as your new wallet, you may have very well gotten excited by your first Web3 experience and want to try out more. You tried your hand at decentralized trading and now want to conquer the world of NFTs. You Google “How to buy an NFT” and end up at rarible.com, where of course, you are asked to first “Connect your wallet”. In an interface markedly different from your previous experience, you are asked to pick between 4 different blockchains (assuming you know that’s what those tabs represent), and from there, between 5 different wallets. Unfortunately, most of the wallets you could choose from at dYdX are not listed here, so your likely conclusion is that you have to start from scratch, with a new wallet. If you didn’t bounce before, you may now.

Rarible.com — one of the world’s top NFT marketplaces

Perhaps more frustratingly, you’re wondering why you are asked to go through this whole experience again in the first place. Didn’t you just “Connect a wallet” to Web3 somewhere else? The “Web” in Web3 is supposed to refer to the interconnected nature of the blockchain world you’re navigating. Referring back to the origin of the “World Wide Web” (aka Web1), it was named the “Web” because of hyperlinking, where you could freely navigate from Website to Website with the click of a mouse button. While having obvious privacy and data ownership problems, Web2 made it even easier to navigate around by allowing you to use the same identity provider (Google, Facebook, etc.) everywhere you went. While Web3 addresses many data ownership issues related to big FAANG controlling your online presence, the “3” in Web3 also infers that it is the new and improved version of the World Wide Web, the interconnected cyberspace we’ve all been used to traversing for the past 25+ years. If Web2 improved the perceived user experience of Web1 by making it more convenient to navigate from site to site with a portable identity, isn’t Web3 supposed to make things even easier than Web2? Or at least just as easy while improving other parts of the user experience?

I wanted to learn about NFTs, not metallurgy

Back to our n00b’s journey into the world of Web3. Assuming the initial wallet setup fiasco hasn’t turned you off yet and you want to continue your Web3 journey, you now are encouraged by the articles you read and the “experts” in your friend circle to consider “better security” for your crypto assets. After all, if you lose your keys, you lose all your hard-earned cross-bred Cryptokitties. First, you have to wrap your head around the fact that a list of 24 words, also known as a “mnemonic phrase”, represents all you own and control in the Web3 universe. If you somehow lose it, you’re toast. If someone else finds it, you’re toast. If you get hit by a bus and forgot to give your spouse a copy, they are toast. Apparently there are a lot of ways to lose all your possessions in Web3. But fear not, the experts tell you, because you can persist your 24 words into Steel. Stainless, so not even rust will get the better of you. While investigating this, you find out you could also go Titanium. Or Tungsten. Or Brass. As you consider the metallurgic properties and look up melting points for each option, you realize the absurdity of this exercise and likely bounce.

Hurdles every step of the way

Assuming you’re amongst the most determined and made it past all these initial roadblocks and want to actually start using some of these Web3 applications — does it get any easier or more intuitive? Unfortunately, with the current incarnations of many Web3 experiences, you will find compelling reasons to stop using Web3 almost every step of the way. Some of the additional hurdles you may face on your journey include:

  • Purchasing goods and services in Web3 is hard. You need to convert fiat currencies (e.g. USD, EUR) into a token your Web3 app accepts (e.g. ETH, SOL, CSPR). This is not always easy, and depending on where you live, darn hard.
  • It’s not just your wallet information that doesn’t persist from site to site. Web3 is really not a web, but a bunch of disjointed silos. Account information, settings, transaction history, items you own, etc. are often not accessible or carried over between different Web3 apps.
  • Everything is maximally inconsistent. You’re used to logging in with Google or Facebook, and this works the same way everywhere on Web2. You’re used to turning off notifications in your phone’s settings, and this works the same for every phone app. You’re used to putting the recipient of an e-mail in the To: field, and this works the same for every e-mail app. In Web3, no two apps work the same.
  • You really want to explore more of Web3, but don’t know where to go. In Web2, Google Mail may lead you to Google Docs, which in turn may lead you to a full ecosystem of Google Docs Plugins. There’s a path of infinite discovery there. Similarly, as a Facebook or Apple user, you’re constantly exposed and directed to apps built on their respective platforms. In Web3, it feels like the apps don’t want to be found.

The Web3 Developer Experience Sucks

There are plenty of reasons why developing apps for Web3 is complicated. Many are valid reasons: you are building applications that run on decentralized networks, where applications are executed asynchronously, and usually by many nodes in a fashion that is meant to lead to a deterministic outcome. This is a very different paradigm from running something locally on your computer, or even on a remote server/cloud instance. There are new programming languages to consider, such as Ethereum’s Solidity, which bring with them new complexities, long learning curves and lack of trained resources. This is one of the reasons why blockchains such as Casper Network have chosen to base their smart contract engine on popular languages such as Rust, JavaScript, and any other language that has a WebAssembly compiler.

But some ways in which the Web3 Developer Experience sucks are completely unnecessary and prohibitive for the adoption by a wider developer audience.

Wallet Galore II — The Developer Edition

While new Web3 users may be turned off by the overwhelming choice of mostly-no-name Web3 wallets they’re forced to choose from when they first access a new Web3 app, conversely, the Web3 app developer has to choose which wallets to support, and typically implement specific support for each of those wallets. This means choosing which SDKs to import, implementing numerous different APIs, dealing with potential version conflicts of dependencies, and optimizing and maintaining the user experience flow for every wallet your user may be using.

Each wallet you interact with typically has its own SDK and API

Welcoming in new users?

It is hard to develop a new user onboarding experience that doesn’t turn off a large segment of first-time users of your Web3 app. You have no choice but to force new users through a “Connect your wallet” experience early on or they can’t interact with your product. So you are currently forced to show them a “Wallet Galore” screen as described above. You want to make it as easy as possible for users to connect to your app, which means implementing as many wallet SDKs as possible, or your new user may show up using a wallet you don’t support. The trade-off, of course, is not just the horrible UI/UX this results in, but also the massive developer burden, which you essentially opt in to maintaining in perpetuity.

Web3, the internet of money?

One of the monikers for Web3 and blockchain has always been the Internet of Money. If Web1 made it easy to exchange information, and Web2 was about commerce and advertising, then Web3 would be about “bringing financial independence to billions worldwide.” Then why does it remain so hard to make your apps’ users pay for your products and services? If your app is looking for mass adoption from millions of new Web3 users, odds are that most of them don’t own the token your Web3 app requires, and they need to convert fiat currencies into that token. This means, that as a developer, you have to contract with a “fiat on-ramp” provider, implement their service, and educate your users on how to use this conversion tool.

Challenges every step of the way

As a Web3 app developer, your challenges don’t stop with the ones identified above. Here are some additional examples of hurdles you may run into during your developer journey:

  • You have to reinvent the wheel on many things. There are no “standard ways of doing user authentication” or universal UI patterns, as you might find in Web2.
  • User acquisition is hard. As outlined above, it is challenging for a user to onboard your app coming from another Web3 app. And, given the disjointed nature of the Web3 world, it’s hard to achieve discovery by new users in the first place.

CSPR.click — Putting the Web back into Web3

Today, MAKE is proud to introduce CSPR.click version 1.0 — our attempt to start tackling many of the factors prohibiting mass adoption of Web3 applications to date. To put things simply, we are starting to put the “Web” back into “Web3”.

There are a few hundred million users of Web3 and very few Web3 app developers. Meanwhile, 8 billion humans and millions of developers are used to how things work in Web2. For the remaining 95% to join the 5% that has already onboarded, Web3 will need to start meeting and exceeding the experience of Web2, for both users and developers.

Obviously, this is not a simple thing to accomplish, nor an overnight adventure. This will require multiple iterations, a steady progression of new features, and solid collaboration with the ecosystem in which we’re launching: the Casper Network. Here’s what we’ve accomplished to date, followed by what’s coming soon:

Seamless Sign On

When a user visits a new Web3 app within the Casper ecosystem, and that app has implemented CSPR.click, they will be able to instantly start using that app with one of the wallets they previously used with any other CSPR.click-enabled application. Much like when a user is signed into Facebook or Google on Web2 and therefore able to quickly authenticate new applications, they can now do so on Web3.

Every User is Welcome

When a user is truly new to the ecosystem, they should be allowed to connect with any wallet they already own, or with no previous wallet installed at all. To accomplish the former, CSPR.click will enable Web3 apps with support for all common downloadable wallets and browser extensions. To accomplish the latter, CSPR.click has partnered with Web3auth, to provide for a dowload-free solution that allows new users to connect with Web3 apps using their e-mail address, mobile phone number or their Web2 accounts from Google, Facebook, and many others, while still enjoying full self-custody and security.
Depending on the Web3 app and their expected audience, they can choose to emphasize the Web2 style log-in over the downloadable wallets. For apps that already have their own internal account system, it’s even possible to create fully self-custodial wallets for their users without forcing users through an additional onboarding experience, as first rolled out by AAA-game Beast League, which is launching on Casper Network this month.

Payment Made Easy

To make it easier for users to pay in the native currency of Web3 apps, CSPR.click has integrated with Uphold’s Topper fiat on-ramp service, enabling users to purchase tokens with their credit and debit cards, and many other (local) payment methods that will be added in the months to come. A user going through the Topper flow for the first time has to go through a light KYC process once, but subsequently this information is tied to their wallet address. This means that any other CSPR.click-enabled Web3 app can prompt the user to top-up, and have them do so seamlessly without any additional KYC steps. This lowers the barrier massively for Web3 apps to enable their users to pay for products and services.

Uniform User Experience

Using CSPR.click on a Web3 app means that users will intuitively know how to perform the most common, and to the developer the most important tasks, such as signing in, switching between accounts, and paying for products and services. The user interface and user experience are identical to the one they’ve used on any other CSPR.click-enabled Web3 app, and highly similar to their Web2-based experiences. Developers will spend less time and effort on educating new users how to use their app, and can instead focus on guiding them along deeper down their app’s onboarding funnel.

To take this a step further, developers can optionally add the common CSPR top-navigation bar to their Web3 app, which will provide them with a UI/UX that is already known and understood by their current and future users, and gives them access to core functionality such as sign in/out, account information, currency/language settings, dark/light mode, network switching and discovery of other supported products.

Growing the ecosystem together

Speaking of discovery — due to the disjointed nature of Web3, the actual lack of a “Web” between Web3 apps, users have a hard time discovering other products to use within their favorite ecosystems, and developers have to rely on often expensive marketing tactics to acquire new users. Organic discovery almost doesn’t exist. CSPR.click addresses this by featuring all CSPR.click-enabled applications in the “CSPR Products” listing on the top navigation bar, and soon in other high-traffic areas of the CSPR Product Suite, which comprises some of the ecosystem’s most-trafficked apps. In time, this will evolve into a true App Store experience — enabling users to discover new products the way they’re used to in Web2, and enabling developers to attract new users the way they’re used to in Web2.

One SDK To Rule Them All

Instead of having to support, maintain and update integrations with potentially dozens of wallets, fiat on-ramp providers, and other third parties, Web3 App developers can access all this functionality using the single CSPR.click SDK. The soon-to-be-open-sourced SDK initially provides a single, uniform interface to all supported wallets and an optional UI component for the CSPR.click Top Bar and all related functionality. Integrated Web3 apps will be included in the app discovery features. Not only will Web3 developers’ lives become exponentially easier, they will also be able to offer their (new and existing) users an easy-to-use, familiar experience for the most common and most important aspects of onboarding and using a new Web3 application.

But that’s not all...

Transforming the Web3 Developer and User Experience from something that sucks into something that not only meets but potentially exceeds the Web2 experience doesn’t happen instantaneously. CSPR.click has a long and exciting roadmap, which CSPR.click-enabled apps will all be able to offer their users as soon as each feature becomes publicly available. Below is a small preview of some of the features to come:

  • More wallet integrations
  • Additional fiat on-ramp and other payment provider options
  • SDKs for additional platforms such as iOS, Android, and Unity
  • Uniform Account Management — through the “My Account” menu in the CSPR.click Top Bar, users will be able to access:
    Settings — allowing users to configure preferences and permissions for their account through the “My Account” dropdown, and have those be available to any CSPR.click-enabled app they visit.
    Transaction History without having to visit a block explorer, users can check the transaction history on their account without leaving a Web3 app.
    Asset Inventory — users can access their cross-app digital asset inventory.
  • Portable KYC — when a user has gone through KYC before, forcing them to do it again when they use a new Web3 app massively increases the risk that the user will bounce.
  • Identity — including tight integration with the official Casper name service CSPR.name.
  • Inheritance Solutions — ensuring that users’ earthly possessions across the entire CSPR.click-enabled ecosystem are not lost to their next-of-kin upon their passing
  • Native Notifications — allowing Web3 apps to notify you when they require your attention. Whether it is a notification that you have been outbid in an NFT auction or your signature is required for a multi-signature transaction, being drawn back into a Web3 app at the right time, much like with Web2 applications, can make the difference between success and failure, between delight and disappointment. For developers, this functionality represents the first time they can have ongoing engagement with their users. CSPR.click, in combination with CSPR.cloud and Casper Wallet, will be able to deliver browser, native desktop, and native mobile notifications.

What we’re leaving behind in Web2

The price for the convenience of using Web2 often included users giving up ownership of their data against their will or, perhaps even more frequently, without their explicit knowledge. Much of the focus on self-sovereignty and disintermediation in the Web3 world is a direct reaction to the abuse of personal data in the Web2 world. While CSPR.click may help Web3 app feel like Web2 apps, under the hood, everything is built in a Web3-native fashion. Users will always remain in control of their data, their permissions, and all aspects of their accounts and user experiences.

Let’s open the floodgates

With the launch of CSPR.click, already in use with CSPR.studio, CSPR.market, and Beast League, Web3 is finally poised for mass adoption. With both ease-of-use for Web3 users, and ease-of-development for Web3 app developers both a given, it’s time to open the floodgates!

To integrate CSPR.click, visit our website, join our Telegram, or send us an email.

--

--

Michael Steuer
CSPR Suite

CTO of @WeAreTeamMAKE, Co-Founder of @Casper_Network