没有软件开发背景的人也能参与智能合约开发？Blocks可能真的能够实现！

Blocks是一个在线可视化节点编辑器，它简化了在Internet计算机上构建去中心化应用程序(dapp)的学习曲线。

下面是如何构建Blocks的故事，用户可以用它做什么，以及Blocks计划从这里走向何方。

什么是智能合约?

智能合约是一种直接运行在区块链或类似P2P网络上的软件。这通常与以太坊区块链及其“Web 3.0”dapp有关，其中一些app在2018年初获得了病毒式新闻报道，如CryptoKitties。

OpenSea是一款极受欢迎的 dapp，月 NFT 交易量超过 15.4 亿美元

对于现实世界的应用程序来说，dapp正变得越来越实用。虽然以太坊网络确认每笔交易至少需要5分钟，但最近的一个名为Internet Computer (IC) 的竞争对手可以在大约 1-2 秒内处理请求。对于去中心化软件的未来，这是一个很有希望的迹象，在所有区块链生态系统中，已经有数百个dapp使用了IC技术栈。

为什么要使用可视化编辑器?

软件工程的基本目标是定义清晰的、易于理解的业务逻辑来解决给定的问题。我们通过创建抽象层来做到这一点，相当于说“做一个花生酱三明治”，而不是“拿两片面包，把它们放在桌子上，打开一罐花生酱”，等等。这些高级的描述使得重用、组合、记录和测试软件变得更加容易。

在Blocks编辑器中已经实现的一些简单的加密功能

可视化编辑器通常用于连接以传统编程语言编写的高级模块。这些环境使非技术用户能够理解程序的逻辑，同时还可以作为强大的学习工具和底层代码库的参考点。

特别是在区块链dapp开发领域，每一行代码都必须仔细检查可能存在的漏洞。任何一个错误或疏忽都可能给项目带来灾难，这使图形编辑器在发现安全问题和鼓励更好的代码封装方面非常实用。

竞争

去年，在用户体验(UX)设计课上对视觉编辑器进行了实验，我学到了一些意想不到的东西：dapp或智能合约开发几乎没有相同的编码风格。快速搜索一下浏览器，你会发现有一个简单的拖放编辑器，叫做EtherScripter，还有废弃的登陆页面，比如SmartChain和HyperLedger Composer，很明显，这些项目目前都不能用于构建和部署真实世界的智能合约。

然而，这显然引起了市场的兴趣。2018年，Erik Marks写了一篇Medium文章，名为《图形智能合约编辑器的案例》(The Case for graphics Smart Contract Editors)，他在文中呼吁开发者尝试解决基于视觉流编辑器的用户体验问题。例如，Erik强调了一个几乎普遍存在的问题，即“对于技术用户来说，它们不如文本方便，而对于非技术用户来说，它们很难被理解。”我个人经历过这两种问题，并很快意识到极短的用户反馈循环将是一个新的可视智能合同编辑器成功的关键。

生成研究

为了最大限度地创造一些对用户友好的东西，我进行了一个生成式研究，由来自学术、专业和非技术背景的六个人组成。在每次采访中，我都要求参与者探索Motoko Playground (Motoko智能合约的在线代码沙箱)和Unreal Engine Blueprint，一种流行的可视化节点编辑器，在必要时只给出最少的指示。

   通过Motoko Playground部署的示例智能合约

    UE4 蓝图中Blocks编辑器的概念验证模拟

虽然每个人对这些应用程序的理解都略有不同，但我被许多参与者意想不到、和非常具体的反馈所吸引。例如，虽然我没有注意到或介意Motoko Playground上的工具栏是不可调整大小的，但一些用户提到这对他们来说是一个主要问题。最终，我找到了共同点：他们使用的是屏幕空间相对有限的笔记本电脑。

这些见解让我真正体会到作为软件工程过程一部分的用户体验研究的力量。特别是在开发一个非常非传统的用户界面时，我很惊讶地发现，从简单地询问几个人20分钟的时间中，我学到了多少东西。

以下是我们所学到的总结:

• 说到视觉编辑器，形式就是功能。键盘快捷键和符合人体工程学的设计决定了工作流程的成败，类似于基于文本的 IDE。

• 自然语言比代码语法和标识符更容易被理解。

• 人们总是想要更多的例子！应该提供最常见的用例，作为模板。

• 实时反馈/评估循环对于探索性学习至关重要。

时间表和优先级

在这个过程中，Blocks获得了25,000美元的DFINITY开发赠款。

 以下是我们早期的应用路线图:

以下是我们与UE4 Blueprint、Motoko Playground和Remix IDE的beta版特性的比较:

我们还使用了以下的HMW问题来进一步细化计划中的功能列表:

• 我们如何帮助软件工程社区关于中心化和非中心化应用程序之间的权衡?

• 我们如何让dapp开发对非区块链开发者来说更平易近人?

• 我们该如何减少Solidity或Motoko等智能合同语言的学习曲线?

技术堆栈

由于目前的开源可视化流程编辑器库文档和维护都非常少，所以我花了几天时间研究各种替代方法，以找到最适合这个项目的方法。

• Node-RED — 被一个类似的废弃项目使用；非常固执己见的

• React Flow — 美丽的流程图库React；类似于Node-RED的用例

• LiteGraph — 奇妙的内置小工具；作为一个数据流编辑器而不是AST生成器

• Rete—受欢迎和相对不受束缚；功能强大，但需要自定义钩子和配置

• Flume— 一个更新、更闪亮、更加流行的Rete.js替代品；缺少一些重要的特性，比如自定义样式