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

我们最终决定使用Rete.js生态系统，从而形成了当前的技术堆栈:

• GitHub— 问题跟踪，项目管理，托管，CI

• Husky — Git提交/推送钩子

• Webpack — 构建系统

• Jest — 测试库

• ESLint , lint-staged — 代码风格执行

• React— 渲染框架

• Bootstrap — 风格约定

• Sass，样式化组件—对Bootstrap的补充

• Feather — 干净，简约的图标

• Rete — 节点和连接渲染逻辑

• Monaco — 语法突出显示的代码编辑器

• WebAssembly — 静态智能合约验证

设计过程

I互联网计算机的可视化低代码环境将减少最初的学习曲线，并使生态系统对新开发人员更容易接近。

为了在实现上取得进展，我们开始同时地设计和开发。为了让用户了解这个项目在过去几个月里的发展情况，下面是一些以前版本的编辑器的截图:

     Blocks编辑器的一个非常非常早期的原型

       Nate创建的早期中保真模型 

当我专注于编辑器工作流、编译器功能和区块实现时，Nate贡献了主题、图形和项目的登录页面。由于功能和用户体验对于可视化编辑器都是至关重要的，因此我们的技术专长最终为这个项目带来了高效率。

一个使用带有可选鲜艳边框的深色主题的简单示例

使用受 UE4 启发的灰色主题的稍微复杂一点的示例

   从To-Do List示例生成的Motoko源代码

评价研究

我们的第一轮用户测试比我想象的要有用得多。在这一点上，应用是基于Unreal Engine Blueprint，所以我们希望用户有类似的期望和反应。相反，我们最终发现了一些问题和解决方案，这些问题和解决方案允许我们推动我们的用户体验超越大多数可视化节点编辑器的现状。

• 首先，尽管编辑器包含基于类型的智能区块建议，但大多数用户并没有意识到这是如何工作的，而是痛苦地在全局放置菜单中搜索每个区块。与我们的直觉相反，通过移除这个全局菜单并强迫用户使用我们的上下文建议，我们成功地提高了用户的学习速度和整体生产力。

    类型套接字的上下文块建议

• 我们的许多alpha测试人员都没有使用可视化节点编辑器的经验。虽然来自 Blender 或 Unreal Engine 的颜色编码输入/输出套接字连接是有意义的，但一些用户无法理解哪些套接字相互兼容。底层类型系统加剧了这种混乱，其中一些颜色在特定方向上相互兼容。我们发现，通过在拖拽连接时添加清晰的视觉指示，用户可以很容易地理解哪些套接字是兼容的，而不需要理解颜色或连接规则。这是用户体验的一个范式转变，需要被其他视觉编辑器采用。

    添加新连接时，兼容的套接字会变大。