前端开发流程 – 搞英语 → 看世界

我的新产品前端开发流程：

行之有效的执行是基本要求。这里的一切都不容商榷。

1.1 覆盖率：所有必需的屏幕、流程和组件都应该存在。首先由设计师创建，然后前端开发人员根据设计进行开发。考虑到大多数开发人员都是一次性完成第一版，我在此阶段不太注重像素级的完美设计，而是确保所有组件和流程都存在。您可以将此阶段理解为将静态组件转化为代码。

1.2 功能性：所有组件都应按预期运行。这意味着需要与后端 API 集成，确保流程顺畅。按钮、输入框、筛选器、标签页、交易操作、导航和状态变更都应表现正常。产品不仅看起来可点击，而且必须真正有效。

1.3 正确性：现在要确保用户界面与设计稿完全一致。做到像素级精准。这包括布局、间距、字体、颜色、组件大小、视觉层级、响应式设计以及设计师的反馈。

1.4 所有状态、极端情况和错误：每个屏幕都应处理各种实际应用场景，包括加载、空白、错误、成功、禁用、待处理、部分数据、离线和权限状态。产品在出现问题时也应表现良好。

你也可以先选择 1.4 而不是 1.3。

1.5 可扩展性：前端的构建方式应能支持未来的版本更新。组件应可重用。布局应能处理更多内容。

我们不应该以增加第二版本开发难度的方式来构建第一个版本。

至此，第一阶段完成。

产品感受：在产品功能完善之后，我们会改进它的感受。

2.1 性能：产品运行速度应快。屏幕加载速度应快。交互操作应立即响应。滚动应流畅。

2.2 愉悦感：愉悦感应该服务于产品，而不是装饰产品。动态效果、过渡动画、悬停状态、确认提示、价格变动提示和微交互都应该让产品感觉更清晰、更快捷、更令人满意。如果动态效果会减慢用户速度或分散用户注意力，那就应该移除。

2.3 信息架构和文案：层级结构应清晰。文案应简洁明了。操作步骤应一目了然。移动端体验应与原生应用保持一致。普通用户无需培训即可轻松上手。

2.4 品牌和产品优化：品牌塑造不仅仅是设计落地页。设计系统（品牌塑造的一部分）完成后，应该确保所有内容保持一致。这包括字体、字号、颜色、间距、图标、插图、动态效果、图表、文案、空白状态以及产品个性。我之所以将品牌和产品优化放在后面讨论，是因为很多公司在开始产品开发之前，并不会等到品牌塑造完成。

2.5 游戏化：最好的产品感觉就像游戏。

第二阶段完成。

用户主导的发明和迭代：随着产品发布日期的临近，您将从早期用户那里学到很多东西。

3.1 可用性测试：进行可用性测试。观察用户在哪些地方感到困惑，在哪些地方放弃使用，他们点击了什么，忽略了什么，误解了什么，以及他们尝试了哪些我们未预料到的操作。用户反馈应该有助于改进产品。用户行为比内部意见更重要。

3.2 最后发明，而不是最先发明：只有现在我们才能创造真正的新事物。解决别人尚未解决的问题。

大多数团队脑子里都有这些东西。他们错在顺序上。他们先从创新（发明）入手，因为这令人兴奋。产品还没成型就开始讨论品牌。他们忽略极端情况，因为用户还没抱怨。基本流程都还没搞定，他们就急着添加动态效果。

首先，我们打造现有产品。然后，我们对其进行改进。最后，我们进行创新。