如何设计以用户为中心的 Web3 应用程序 (DApps)：技巧和窍门

在从Web2 到 Web3 的缓慢但稳步的转变中，去中心化应用程序 (dApps) 有望比 Web2 同行更上一层楼，拥有更大的用户权力和数据所有权。

尽管如此，UX/UI 的传统原则（即一致的界面元素、流畅的用户入门、简洁的语言）仍然具有价值；另一方面，UX/UI 设计师和开发人员在努力为 dApp 创造引人入胜的用户体验时面临着独特的挑战。

事实上，有统计数据显示，只有25% 的 Web3 用户对使用去中心化应用程序有信心。

用户期待更多的自主权，要求直观的界面让他们能够毫不费力地浏览复杂的 Web3 概念和网络。

Web3 开发人员通常需要与设计师密切合作才能实现他们的创作；Web3 的去中心化特性让他们重新思考人类行为变量，例如信任因素，因为 dApp 不再依赖中间人和中心化机构。

什么让 Web3 用户心动不已？

与传统的 Web 应用程序不同，Web3 迎合了多样化的受众，从经验丰富的 加密爱好者到刚涉足DeFi的新手。在设计 dApp 时，请考虑这些不同级别的技术理解。

• 加密货币原生用户：这些用户熟悉钱包、 私钥和 gas 费等概念。他们可能会优先考虑高级功能和自定义选项。

  
  

• 新手：这些用户可能不熟悉区块链术语，需要清晰的解释和指导。简单易用对这个群体来说至关重要。

Web3 直观设计的关键原则

在深入研究Web3 和区块链 dApp的直观设计时，了解用户的心态和旅程至关重要。首先考虑一下受众的心理模型。他们是区块链技术的新手还是该领域的老手？

设计时考虑他们的知识水平可以显著提高可用性。

1. 将 Web2 的熟悉感引入 Web3

在相关的情况下移植 Web2 中的隐喻和工作流程。这并不意味着您应该回避 Web3 的创新元素，而是应该融入传统的 UI 组件。熟悉可以打破障碍；当用户识别出模式时，他们会更轻松、更自信地导航。

2. 少即是多

Web3 本身的想法已经……很多了。清晰和简单应该指导设计选择。令人困惑的布局可能会影响用户参与度。相反，应该致力于打造一个干净、整洁的界面，强调核心功能。基本元素应该放在最前面和最中心的位置，减少认知负担，帮助用户快速做出决定。

3.反馈循环

另一个关键方面是反馈。在 dApp 中，每个操作（例如掉期交易或数据输入）都应通过反馈（例如明显的确认屏幕或动画）进行确认。同样，当用户遇到错误消息（或者，用 UX/UI 术语来说，是“不愉快的路径”）时，应该立即提供反馈和解决方案。

这让用户确信他们的操作被记录并且有效，从而建立一种信任和可靠感。

4. 跨设备类型的一致体验

与大多数 Web2 应用程序一样，dApp 可在移动设备、桌面和平板电脑上运行。跨各种平台的一致性设计可增强用户体验。无论是在桌面应用程序还是移动界面上，一致的导航和视觉提示都可帮助用户形成应用程序的思维导图，从而实现设备之间的无缝过渡。

它还可以减少某些交易活动中不必要的担忧，例如使用两个不同的设备扫描二维码和输入钱包地址。

5. 安全和隐私

在 Web3 中， 安全性不容小觑，因为用户通常管理着有价值的数字资产（想象一下巨鲸转移的庞大数量）。优先考虑强大的身份验证方法、有关潜在风险的明确警告以及有关最佳安全实践的教育资源。

虽然 Web3 和区块链以不可篡改的记录而闻名，但提倡使用强加密技术保护用户数据，并明确传达预防措施以让用户放心。提供详细的交易摘要和活动历史记录也是一种增强信心的方法。

Web3 UX/UI 设计的实用技巧

让我们将这些原则转化为可行的设计策略：

1.入职

第一印象很重要。用户可能会担心复杂性或安全风险，因此创建一个流畅且引人入胜的入门流程来指导新用户了解 dApp 的基本知识是一个好习惯。考虑在应用内和网络上提供交互式教程或分步指南。

单屏注册是一种经典的方法，可能更适合经验丰富的 Web3 用户，他们已经知道会发生什么，并且可以轻松地直接进入其中。

可滑动的入门界面可能对新手来说很理想；这种易于理解的格式有助于他们吸收 dApp 的核心功能和价值主张。即便如此，一个好的做法是将滑动次数控制在不超过三次，因为每增加一步都会增加用户流失。

2. Web3 钱包集成

连接加密钱包通常是用户与 dApp 的第一次真正互动。笨拙的钱包集成过程可能会导致用户沮丧和放弃。实现无缝集成的一些方法包括：

• 一键连接：尽可能实现“一键”连接。利用 WalletConnect 或类似协议来尽量减少所涉及的步骤。

  
  

• 钱包检测：自动检测用户安装的钱包并突出显示其首选选项

  
  

• QR 码支持：提供 QR 码扫描作为替代连接方式，特别适合移动用户。

  
  

• 支持多种钱包：通过支持 MetaMask、Coinbase Wallet、Trust Wallet、Argent、Rainbow 等热门钱包，当然还有基于 aelf 生态系统构建的账户抽象 (AA) 钱包Portkey ，满足广泛用户的需求

  
  

• 新手指南：提供清晰的说明和视觉辅助，指导用户完成连接过程，尤其是对于刚接触 Web3 钱包的用户

  
  

• 安全提醒：在连接过程中显示清晰简洁的安全提醒，强调保护私钥的重要性。

3. 了解你的客户（KYC）集成

虽然去中心化是 Web3 的核心原则，但许多 dApp（尤其是处理金融交易或敏感数据的 dApp）需要了解你的客户 (KYC) 流程以遵守法规并确保安全。

• 透明度和清晰度：明确解释为什么需要 KYC 以及如何处理用户数据。提前说明将收集的信息及其使用方式。

  
  

• 简化流程：使 KYC 流程尽可能高效。尽量减少步骤数和所需信息量。

  
  

• 安全的数据处理：强调保护用户数据的安全措施。考虑使用去中心化身份解决方案来增强隐私。

  
  

• 用户友好的验证：与可靠的 KYC 提供商集成，提供流畅且用户友好的验证体验

  
  

• 清晰的反馈和状态更新：在整个 KYC 流程中让用户了解情况。提供有关其验证状态和任何所需操作的清晰反馈。

4. 交易流程

交易是大多数 Web3 交互的核心。通过提供 Gas 费用、预计交易时间和确认步骤的清晰说明来简化交易流程。

• 视觉清晰度：使用清晰的视觉提示突出显示关键信息，如交易金额、gas 费、网络费和预计完成时间

  
  

• 实时反馈：使用加载器、进度条或状态通知为用户提供实时交易更新

  
  

• 动态价格更新：对于涉及代币交换或交易的交易，显示动态价格更新以反映市场波动。包括有关价格波动及其对最终交易金额的潜在影响的明确免责声明。

  
  

• 后台处理：尽可能允许用户离开交易屏幕并在后台处理交易时执行 dApp 内的其他活动。在完成或发生任何错误时提供通知或警报。

  
  

• 确认步骤：实施明确的确认步骤，以防止意外交易。要求用户在提交之前查看并明确确认交易详细信息。

  
  

• 交易历史记录：提供详细的交易历史记录，方便访问和搜索。允许用户按日期、类型或状态筛选交易。

5.错误处理

错误是不可避免的。不要显示一般性的错误消息，而要提供具体且翔实的解决问题的指导 — 最好使用富有同理心的语言来补充。

• 具体且信息丰富的消息：避免使用“交易失败”等通用错误消息。提供有关出错的具体详细信息，例如“资金不足，无法支付 gas 费”或“网络连接错误”。

  
  

• 上下文指导：提供关于如何解决错误的上下文指导。例如，如果交易因资金不足而失败，则提供用户钱包的直接链接或有关如何获取更多所需加密货币的指南。

  
  

• 错误预防：尽可能采取措施预防错误。使用输入验证来确保用户输入正确的数据格式，并在用户采取行动之前明确警告潜在风险。

  
  

• 恢复机制：提供常见错误的恢复机制。例如，如果用户发起的交易的 gas 费用较低，导致交易延迟，则允许他们通过提交费用更高的新交易来“加快”交易速度。

  
  

• 友好的语言：避免在错误消息中使用技术术语（例如，Error 404）。使用清晰、简洁、自然的对话语言，让所有用户都能轻松理解。

6. 工具提示和解释器

不要假设用户理解所有术语。考虑在数字接触点上大量使用工具提示或可扩展的信息选项卡；以简洁、通俗易懂的方式解释“gas 费”、“智能合约”、“区块链网络”或“ NFT ”等复杂术语。

在 dApp 内建立知识库或专门的常见问题解答来容纳更长形式的帮助内容也是一个很好的做法。

7.测试和迭代

工作永无止境，即使发布后也是如此。认真测试和更新 dApp 以修复错误是理所当然的，但这是满足不断变化的用户需求的支柱。

在本文前面，我们提到了通过调查、访谈和可用性测试进行的用户研究。这是一个发现的金矿，有助于有针对性地改善 dApp 体验。

A/B 测试和用户逐字记录是确认 UX/UI 设计原型和假设的两种最常用方法。根据发现的结果做好准备，并跟踪哪些方法有效（哪些方法无效）。

这些步骤应该会让你更接近你创作的“北极星”。

结束语：额外提示

dApp 的成功取决于一个未知因素。用户会记住你的创作，还是会再次使用你的创作？

提供个性化体验可能是答案。这意味着用户在与 dApp 交互时可以根据自己的行为和偏好获得量身定制的推荐。它可以是简单的东西，例如用户最常用功能的预设快捷方式，也可以是帮助完成某项活动的定制建议。人工智能集成可以通过分析链上活动、预测用户偏好甚至提供主动帮助来帮助实现这一点。

以用户为中心的体验和界面也延伸到开发人员和设计人员所从事的软件和平台——构建者本身也是用户。

如果您在aelf （高性能第 1 层AI 区块链）上进行构建，其 AI 工具包和 aelf Playground 集成开发环境的用户友好性将使构建过程变得轻松有趣，因此您和您的团队可以专注于设计最佳的用户体验。

关于aelf

aelf 是首屈一指的 Layer 1 区块链，具有模块化系统、并行处理、云原生架构和多侧链技术，可实现无限可扩展性。aelf 成立于 2017 年，全球中心位于新加坡，是业内首家通过最先进的 AI 集成引领亚洲区块链发展的公司，将区块链转变为更智能、可自我进化的生态系统。

aelf 利用其原生 C# 软件开发工具包 (SDK) 以及其他语言（包括 Java、JS、Python 和 Go）的 SDK，促进在其第 1 层区块链上构建、集成和部署智能合约和去中心化应用程序 (dApp)。aelf 的生态系统还包含一系列 dApp，以支持蓬勃发展的区块链网络。aelf 致力于在其生态系统中促进创新，并将继续致力于推动 Web3、区块链和 AI 技术的应用。

了解有关 aelf 的更多信息，并与我们的社区保持联系：

网站| X | Telegram | Discord