更少信任，更多真实：Web3 设计最佳实践和模式

开发人员有一个新互联网的梦想。 Web3 是一种去中心化模型，它让用户对他们在网上创建的平台和内容拥有完全的所有权。 但试图彻底改变互联网带来了多重设计挑战——主要是构建用户界面，以解决由 Web3 的独特功能引起的混乱和安全问题。

Web3 解释

要了解 Web3，了解 Internet 的简史会很有帮助：

• Web 1.0 是去中心化的，这意味着内容和平台的所有权和控制权分布在许多个人和企业之间。
• Web 2.0 是当前的互联网迭代，得益于少数拥有用户友好平台的软件公司，如 Apple、Google、Facebook（现在的 Meta）和 Twitter。 随着越来越多的人成为活跃的在线创作者和消费者，网络变得更加集中，主要由少数公司拥有和控制。

借助 Web3，开发人员正在使互联网再次去中心化。 技术垄断企业将不再拥有和控制用户创建的内容和平台。 Web3 还旨在解决互联网的安全和隐私问题。

Web3 是：

• 无需信任：开发人员、内容创建者和其他用户保留对 Web3 平台和 DApp（去中心化应用程序）的构建和维护方式以及可以发布的内容的控制权。 他们对代码和服务的运行方式具有完全的可见性。 这与 Web 2.0 形成鲜明对比，在 Web 2.0 中，企业和政府拥有控制权，用户无法独立验证有关如何开发和管理应用程序的信息。
• 无许可：用户可以在未经公司或政府机构授权的情况下进入任何 Web3 应用程序。 他们使用持有他们的私钥的数字加密钱包登录，他们用来访问数字货币的密码。 钱包可以是类似于 USB 驱动器的硬件或 MetaMask 和 TrustWallet 等移动应用程序。
• 分布式：互联网产品和服务的权力和控制权并不集中在投资者或 CEO 手中，而是公平地分配给用户，用户根据他们对 Web3 平台开发和维护的贡献获得所有权。
• 开放： Web3 在区块链上运行，将数据存储在单独的组中，称为块。 一旦一个区块被填满信息，它就会与前一个区块链接，形成一个按时间顺序排列的链。 区块链是最常用于记录金融交易的开放式账本。

许多 Web3 应用程序是由主要由开发人员组成和领导的小团队构建的。 有些团队是独立的； 其他人则受雇于公司，包括 NFT（不可替代令牌）市场和加密货币交易所。 通常，是开发人员聘请设计师来开发 Web3 产品。 在许多情况下，首选具有 Web3 经验的设计师，因为在这个瞬息万变的空间中学习曲线陡峭。

Web3 用例和扩展障碍

Web3 以金融应用为主：加密货币、用于交易的加密货币交易所（去中心化交易所，或 DEX）和 NFT，用于表示独特的数字或物理项目的所有权。 此外，去中心化金融或 DeFi 允许用户绕过银行并访问点对点金融服务，例如借贷、赚取利息和交易资产。

将 Web3 扩展到其他领域已被证明是困难的。 例如，没有办法区分合法的 Web3 网站是否存在欺诈——这个问题被放大了，因为用户必须输入他们的加密钱包凭据才能访问 Web3 平台。 如果 Web3 网站是一个骗局，任何进入的用户都可能损失所有的钱。

另一个问题是区块链不允许上传图片或视频。 用户可以将媒体存储在以太坊等加密网络上，但价格昂贵。

在 Web3 视频游戏中，NFT 可以代表玩家的头像和购买的物品——但通常不可能将这些资产转移到其他游戏或应用程序，从而减少玩家的投资并阻止他们玩 Web3 游戏。

设计师必须知道的

利用以下 UI 模式和 UX 设计原则可以促进 Web3 平台的发展：

提供清晰的提示和完整的信息

许多 Web3 应用程序错误地假设用户拥有丰富的经验。 相反，设计人员应该澄清 Web3 不熟悉的功能和操作的含义。 例如，在将加密货币资金存入流动资金池之前，新投资者需要知道他们的资金可能会贬值——可以通过存款屏幕上的弹出消息发出警告。

DeFi 应用程序上的活动由称为协议的标准管理。 大多数 DeFi 应用程序都会执行定期安全审计并记录关键发现，包括漏洞、代码问题和修复。 设计人员可以确保 DeFi 应用程序在新的审计报告可用时通知用户，并且它们可以通过以明文形式总结复杂部分来帮助使审计更容易理解。

同样，许多人阅读 Web3 产品文档以了解协议机制并就使用应用程序做出明智的决定。 这些材料大部分由难以理解的技术术语组成。

同样，设计师可以通过在文档部分的开头提供对话摘要以及指向更多技术内容的链接来确保用户友好的内容。 弹出词汇表可以作为链接图标嵌入文本中，使用户能够通过鼠标点击或手指点击来了解术语的含义。 文案可以分解为说明重要 Web3 概念的图像。

使用熟悉的货币交流汇率

随着比特币等加密货币变得越来越流行并且它们的价格波动，很难追踪它们的价值。 在数字钱包和电子商务应用程序中，这些代币用于购买、出售和交易 NFT 等资产，设计人员应向用户展示从加密货币到其本国货币的价格转换，并避免使用超过几个小数位。

使钱包和交易哈希易于阅读

默认情况下，区块链上的每个地址都是一长串字符（最多 42 个），称为 ID 或哈希。 发送资金时，人们必须检查整个字符串。 很容易出错，而且风险很高：所有区块链交易都是最终的。 如果资产被发送到错误的钱包地址，则无法恢复它们。 在我工作的一家投资公司，我们促成了 ICO（首次代币发行）交易，向参与的企业发送巨额转账——我们每次都有六个人检查收款人的钱包地址。

以太坊名称服务 (ENS) 使人们能够将他们的哈希值更改为更易于阅读和记住的内容，例如他们的名字加上.eth 。 然而，并不是每个人都使用 ENS，因为它很昂贵。

Web3 UX 设计师可以通过仅显示哈希的第一个和最后四个字符来让用户在不检查整个字符串的情况下验证它，从而减轻交易压力。 设计人员还可以要求用户在进行任何交易之前仔细检查哈希值，并且他们可以在每个收件人地址旁边添加一个识别徽标。 这些额外的验证层应该伴随着提醒，将资产发送到错误的地址将导致资金完全损失。

明确交易等待时间

通过银行在线转账时，您会立即收到状态更新或交易完成的确认信息。 Web3 DEX 并非如此。 区块链交易的最短处理时间约为三分钟，但我不得不等待长达两个小时。 我已经使用这项技术六年了，当钱离开我的钱包并且我没有收到及时的交货确认时，我仍然感到恐慌。

更多 DEX 应该通过文本或动画在状态栏或通知中显示交易状态。 如果在 UI 中显示更新不可行，则提供指向开源区块浏览器（例如以太坊上的 Etherscan）的链接是一个不错的选择。

实现“发送最大值”按钮

比特币、以太币和其他加密货币通常用许多小数位表示，例如 0.0000085191。 在向个人或企业汇款以购买 NFT 等资产或将资金存入智能合约时，很难准确有效地输入总金额。 我建议设计师在应用程序中创建一个“Send Max”按钮，允许用户一键将其整个钱包余额转移到另一个地址。

当一个人的钱包余额等于或略高于他们需要转账的金额时，这很方便； 一些用户有多个钱包，这增加了发生这些事件的可能性。 他们可以发送全部余额，该功能会自动将其转换为比特币或以太币。 当钱包余额大于应付总额时，此功能不会进行任何核算，因此设计人员应包含一个确认对话框，以确保用户不会错误地发送超出预期的金额。

解释汽油价格如何运作

Gas 可能是 Web3 中最烦人和最令人困惑的事情，尤其是对于加密新手来说。 Gas 价格是用户支付的额外费用，用于支付处理交易所需的计算能力成本。 用户可以选择支付更高的费用来加快传输速度。

设计师需要解释什么是气体以及它是如何工作的。 如果可能，他们应该以用户最常用的本地法定货币（通常是美元）显示 gas 价格。 设计人员还可以提出可行的 gas 价格和由此产生的传输速度组合； 如果交易因支付低gas而停滞或失败，设计者应该允许用户支付更高的费用来加速转账。

使用户的交易历史易于访问

几乎所有的集中式电子商务网站 (web 2.0) 都允许用户查看他们全面的购买历史。 在去中心化交易所很难访问这样的记录：钱包提供交易历史记录，但一次只针对一个账户，而且很难或不可能被 DApp 过滤。 为了在集中式平台上获得这种历史记录，Web3 用户必须使用像 Etherscan 这样的区块浏览器，这对用户不友好，并且很难找到特定的交易。

Web3 设计师应该为人们提供一种简单的方法来审查他们在单个 DApp 中进行的链上交易。 这应该放置在易于找到的位置，例如侧面板或菜单。 另一种选择是创建一个由按钮激活的“链式视图”模式：一旦单击，它将在整个 UI 上放置一个过滤器，指示存储在区块链上的 DApp 中的所有内容——包括交易历史. 允许用户轻松过滤和导出他们的交易记录也很有帮助。

启用简单的私钥管理

使用户能够访问其数字钱包的私钥并不容易存储。 人们有时会忘记备份它们或不知道如何备份它们。 这些密钥一旦丢失就无法恢复：没有“重置密码”选项。 设计者可以通过仿照 MetaMask 的例子来解决这个问题，并为每个用户提供一个助记词，即一系列可用于解锁钱包的词。

设计师还需要警告用户，如果他们丢失了私钥或助记词，他们的资金将无法访问并且容易被盗。 这样的消息应该在用户的钱包应用程序中弹出，首先作为设置钱包时的通知，然后作为预设时间表的重复提醒。

关键要点

为了让 Web3 越来越受欢迎并扩展到数字钱包和金融平台之外，设计师需要让 Web3 应用程序更加一致和直观。 他们还必须提供更直接的用户教育，以帮助新手熟悉 Web3 平台上的新功能和交互。

让 DApps 感到安全也必须是重中之重。 控制 Web3 的无需信任、无需许可的性质是不可能的，但设计人员可以预测可能出现的问题并帮助防止这些情况发生。 更透明的风险警告将大大缓解人们的担忧并说服他们接受 Web3。

Toptal 博客的进一步阅读：

如何设计以获得最大的产品信任

使用这些成功的交互设计原则提升您的用户体验

无代码网页设计的 Webflow 优势：案例研究