最近半年一直在做APM的监控产品，从流利说到哈啰单车。主要面临的挑战就是做APM产品的规划，前期可以借鉴一些产品，但是到后期就需要非常多有创新性的东西了。这里开始探索如何做好技术创新，产品规划。

提出问题，什么是好的技术创新，如何做好技术创新？

  • 技术创新，一定是有价值的才是好创新。

先说结论

  • 先，提出宏大愿景，提出问题。
  • 最最重要的，一定是基于需求，痛点，价值。深入了解用户的痛点。需要洞察力，发现别人看不到的点。
  • 多看。需要具备逛过的视野。

  • 思考能力。结构化思考，本质思考，高维思考

  • 积累一些创新模型。有很多通用的模型。

  • 积累可以提升改造的问题。

如何锻炼？

创新是守破离

和学习一样

  • 守 先在这里领域模仿，在模仿过程中理解
  • 破 然后在对产品，业务深入理解，结合当下特定问题，进行特定的创造，破局
  • 离 创造自己的特色理论

哪些方法

0 提出宏大愿景，提出问题，格局

案例

对未来代码方面的lowCode，noCode

1 最重要的，深入了解用户需求，洞察力，数据分析

创新的价值，一定是解决了用户的需求，有了需求的了解，才能做出好产品，否则都是在空中的

  • 对用户痛点深入了解，成为专业用户。
  • 洞察力，观察到别人看不到的点。提出问题。
  • 数据分析

用户痛点深入了解

  • 所有的创造，价值判断，都需要以用户的需求为依据

洞察力 对日常工作的观察

  • 洞察到前后端协作的问题，创造了BFF，FAAS

数据分析

  • 基于数据说话，来佐证哪些是重要，哪些存在问题

3 具备广阔的视野

看到很多创新都是基于某个启发，或者是基于过去的优化，或者有新技术的支持新一轮创新

怎么做？

  • 不止前端领域，还要借鉴学习其它领域

为什么？

  • 视野可以启发
    • 如NPM包管理者，是从不满足于PHP和Pear的包管理创造的
  • 引入前沿技术带来创造
    • 如Nodejs的出现后，带来前端的巨大创新

4 业务理解的深度 高维思考

也可以转换为对行业，产品，用户的理解深度。

如刘飞对滴滴司机端的思考，最后变成提出4个核心问题

5 思考能力

  • 提炼，抽象，模型化
  • 结构化思考
  • 本质思考，高维思考(深度思考)
  • 抽象出模型，追求表现下更深层，本质的模型
  • 系统化思维
  • 横向思维(借鉴)
  • 抽象化思维 联想思维

  • 多角度思考

  • 闭环思维

  • 生态思维
  • 体系化思维
  • 全局思维
  • 策略思维

提炼，抽象，模型

这个和抽象化思维一起，提炼，抽象，最终总结成一个简单的模型

能否用一两句话精简的把系统表达出来，精简后也方便进行扩展思考。

提炼成简单的模型，关键词，公式

  • 如，性能白屏时间，由两个元素构成，网络渲染加载时间，渲染时间
  • 如，APM系统就是发现问题，定位问题
  • 如，杨戬的B端系统，提炼成关键词就是降本提效
  • 如，管理的本质就是育人成事
  • 如，商家成交的公式就是，营业额=访客量 成交率 客单价

提炼成一定的模型

  • 如，服务端MVC，前端的MVVM
  • 如，规划的PDCA循环

结构化思考

能用某种结构把涉及到的因素都穷尽出来，比较有逻辑性

对要素的深度拆解，然后再各个层面进行优化。

如有赞质量保障体系，开发过程垂直的各个层面思考，出相应的解法。

本质思考，高维思考 (深度思考)

从现象到理解本质，站在更高维度看，然后沿着本质更好的思考创造

如何深度思考

  • 站在更高维度，业务理解的深度，如刘飞对滴滴司机端业务的思考

如

  • 语雀核心竞争力，知识的管理，流动，价值，知识就是财富

  • 对问题的深度思考，为什么前端不重视质量，性能

系统化思维

**

横向思维(从其它领域启发)

一些案例

  • 如前端监控，可以借鉴服务端的监控，有SLA，有MySql慢请求。

  • 如两个输入框有联动逻辑关系，可以搜索密码框和确认密码(因为有成熟方案)。

  • 如解决前端不重视监控，质量这个难题，可更广泛一点，搜索团队重视质量这个问题，得到不少答案。甚至更广看别人是如何解决招聘难题，不重视前端的问题，如何赢得Nodejs机会等方法。

  • 前端质量监控，可以借鉴前端测试质量的度量。

**

抽象化思维 联想思维

即技术产品，非常需要，对日常行为的观察，然后抽象出可复用的工具。

如

  • yeoman-generator，是对我们日常中项目的抽象，抽象为一个项目模板。
  • 如魔切，淘宝制作的商家页中，有可点击的区块，通过类似抠图的方式，切一块然后填上链接。

联想思维

  • 热力地图，通过过去的地图和颜色的叠加，来表示不同地区数据的高低。
  • 将热力图中的地图换为网页，可以展示网页的点击率。
  • 漏斗模型，用生活中的漏斗，来表现数据的。

多角度思考

站在不同角度思考，老板角度，工具角度，业务角度，技术角度

闭环思维

闭环思维

如监控系统

性能优化的循环，监控 -> 数据分析 -> 优化改进

督促业务方改进的循环，打分 -> 低得分督促改进 -> 再打分

生态思维

**

**
微软的生态思维，开发者生态，Github，NPM，

体系化思维

不再是单点解决问题，而是成体系系统

如学习SRE体系化思维，DEF是体系化思维

策略思维

如，

主次策略，惊喜首屏优化，分清哪些是主要模块，哪些次要模块，优先渲染展示主要模块。

关键策略，即抓住解决那些关键的问题，而不是每个点都要抓，都做不好。

预加载策略，首屏渲染后，在空余的时间，预加载其它页面的资源，其它页面的数据。

6 积累一些创新模型

XYZ轴思维(树状结构)

其实也是也是一种结构化，树状结构的表现
**

  • X横，广度
  • Y轴，深度
  • Z轴另个维度


VSCode为例

X轴，集成化了Git，Terminal，Debugger
Y轴，在代码理解上，低量无用代码，TS代码提示，ESLint的错误提醒
Z轴，诞生了WebIDE

以Github为例

X轴，社交，项目管理协作，自动
Z轴，项目管理协作，

集成化，X轴横向

**

本质，将过去需要多次跳转的操作，集成在一起，并有更好的互相联动能力。提升开发效率和体验。

VSCode的集成案例

VSCode的ESLint，显示当下文件检测结果，错误可视化展示在编码中红色提醒，右键还可直接做fix操作。
VSCode的Git，展示修改文件列表，可视化对比修改，可视化展示Merge冲突，代码行的修改信息，极大提升开发效率和体验。
VSCode还集成了Terminal，Debugger等。

Github的全链路

DEF的全链路

界面化

**

本质，界面化不需要记忆繁琐的命令，更好的UI展现形式，

**
VSCode的Git菜单，有Diff，有History，右键有各种常用命令。

缩短操作路径，简化繁琐操作

本质，将过去较为繁琐的操作简化。

如Android手机上的，下拉快捷菜单，可快速开关wifi，长按跳转到wifi选择网络界面。到Ipad os上更进一步，长按直接有小弹窗进行wifi选择。

如一加7手机，收到短信验证码时，在页面中会有辅助弹窗，点击自动填入到输入框中。

如Chrome出了记住密码的功能，(过去输入账号，密码，可能还忘记或混淆)。

自动化

汽车的后视镜盲区警示
汽车的自动驾驶

换一个层面解决

  • 性能优化，从设计层面增强，添加骨架屏
  • 性能优化，从产品层面增强，美团单车的扫码直接开锁 VS 还要等待按钮出现点击确认

更高用户体验

  • Ajax，SPA的诞生都极大的提升了开发体验

更进一步，智能化

这也需要洞察力，看平时是人是如何操作的，能不能系统自动化做掉，抽象化为一个功能。

汽车的自动驾驶。
汽车的自动大灯。(过去要人为判断天气，再开启大灯。但是过隧道等忘记开关等。-> 自动判断并开启)
监控的智能预警。AIOPS，根据过去的表现学习，然后再判断
根因分析。监控中，需要肉眼去判断问题在哪里，自动根因分析，背后自动计算差值，得出结果。

7 积累可优化创新的方向

在你做的产品方向，团队定位上，一定是有要解决的核心问题，沿着这些问题去思考提升

工程化团队有哪些可提升的点

  • 性能
  • 效率
  • 质量
  • 用户体验
  • 研发效能
  • 。。。

讨论 头脑风暴

旧瓶装新酒

看演进历史

如何做

  • 扩大视野认知，业内交流，同事交流，优秀的团队，多看分享
  • 讨论

  • 多展望未来，代入思考
  • 学习他们思考的方法

  • 阅读技术体验部的几篇，云凤蝶，？这个用处大吗？

  • 像技术前辈请教，阅读他们的文章，看他们更高维的思考

  • 产品学习

    • 阅读产品前辈，他们的文章，日常，看他们更高维的思考。(刘飞，)

  • 阅读图书

    • 阅读《程序员进阶心法》第三部分，技术主管，技术架构师和升维部分。
    • 阅读《全面解决问题》一书的创新部分。
    • 阿里毗卢分享的文章
    • 阿里工程师的心法

  • 阅读，视野

    • 极客时间的那些视频如何
    • 极客时间的SRE课程
    • 蚂蚁金服的那些文章，各个部分
    • 产品
      • 阿里的生意参谋
    • 文章阅读，inoreader订阅
    • 知识星球
    • 多看技术产品？

  • 能力学习

    • 前辈的请教学习
    • 如何具有创新力？

我的学习计划是什么？


哪些创新性产品

  • Github 两个方面
  • Gitlab
  • VSCode
  • Antd
  • 语雀
  • 谷歌在线文档 石墨文档

  • Vue-CLI | DEF -> yeoman -> 服务端CLI

  • Chrome

技术上的

  • generator
  • npm包管理

借鉴

思考能力