产品护城河杂感

Photo by Zane Persaud on Unsplash

一个产品必定有其竞品,而一个优秀的产品则有他特有的被市场认可的模式(这个模式可以是用户体验也可以是生态),以至于其他参与者无法轻易获取这部分市场。比如微信,他的护城河是他的产品体验以及庞大的社交基础,后来者很难轻易的再造一个微信从他这里夺走用户。而这个能力就是所谓的护城河。

在打造一个产品的时候,很多时间也需要考虑护城河的问题。因为 UI 界面,交互这些都是可以被轻易复制的东西,而打造模式才是将竞争对手甩在身后的有利武器。我也做过没有护城河的产品,因此深深知道,类似的产品一旦被人模仿,利润就会被打得很薄,而不能额外获取更多的利润。

我在 W2SOLO 上也看到过某开发者投诉被碰瓷的事情(像素级抄袭),虽然很同情他,但这是一般工具类产品都会遇到的问题。一般工具类产品都是为了解决某个特定的小问题,非衣食住行等消费类每天都会接触,一般比较低频,这也导致了品牌建立困难,用户留存度低,从赛道来讲是先天不足,第二、工具类产品技术壁垒也很低,一般由个人开发者开发维护,项目逻辑复杂度低,技术难度小,容易复制。

继续阅读产品护城河杂感

独立开发者宣言

宣言两字用的比较大,但是很符合独立开发者渺小又要发声的定位。本文节选自 W2SOLO chicken(肯德鸡)自我介绍

全职开发者和独立开发者工作性质不同。全职 APP 开发者处理的是公司的业务中的一部分,面对的是产品经理、测试人员、美工设计、后端工程师等。按组织的项目计划和要求尽好自己的职责完成工作,月底(到)公司收工资。

(而)独立开发者的工作更像一种创业活动,为了容易接触广大消费者和其他平台公司合作,需要注册公司,商标注册,亲自了解市场客户需求,产品设计、产品开发测试迭代、产品推广运营等工作,和创业一样需要承担经营风险,(以防)竞争对手模仿,自负盈亏(等)。 独立开发者工作是一个成长过程也是一种对自己的投资。

我觉得每个 APP 的核心价值和用户群体需要沉淀,也不是每个开发者运气那么好都像买股票一样能追上风口,但怀着帮助人们更好地生活,解决问题烦恼的心,加深对用户的沟通了解,一定会找到自己的客户贡献。

微信小程序 Canvas 滑动抖动解决流程

Photo by raphaelle on Unsplash

为了完成产品中的环形进度条的动画,尝试了搜索引擎中能提供的所有方法,包括 Canvas 绘图,CSS 遮罩旋转,最后只有 Canvas 2D 能够完美实现动画效果。现把所有坑和能够实现的方法提供在此留给大家做参考。

继续阅读微信小程序 Canvas 滑动抖动解决流程

Windows Server 设定 eggjs 自启

Windows Server 总是感觉很心虚,有些程序相性不太好,一旦八字不合就要调试半天,若非单位有这使用 Windows Server 的传统,我是绝不用它作为主力系统。这不,今天又碰到一个 eggjs 写的转接口应用需要在 Windows Server 2012 做自启,不出所料又折腾半天。

半天时间,我试了很多种方案,比如 pm2-windows-startup,任务计划+node-cmd,无一例外失败了。其中只有 pm2-windows-service 竟然在折腾之下意外成功,这里记录一下关键点。

继续阅读Windows Server 设定 eggjs 自启

颜色术语——来自 Happy Hues

今天看了 Happy Hues 这个网站,很有意思,其中的动效很棒值得借鉴。除此之外,也收获了一些色彩方面的术语,Hues、Tint、Shade、Tone、Value、Saturation

Hues 是指原色,Tint 是指在原色上加入白色(在 PS 中一般降低饱和度来调节),Shade 是指在原色上加入黑色(在 PS 中一般通过明度来调节),Tone 是指在原色上加入灰色,Value 是指原色的亮度,Saturation 是指原色的纯度(饱和度),色彩越纯就越鲜艳和亮、否则就会越暗淡。

我在 PS 中操作了一下的确也验证了。饱和度 S 实际上是通过加入白色多少来控制,亮度 B 实际上是通过加入黑色多少来控制,颜色 Hue 实际上是通过设定色轮上的度数(0-360)来控制。

走火入魔做产品

在业余时间一直开发一款小程序应用,陆陆续续也有大半年的时间。半年时间来,我的感受是产品和开发不同,开发侧重与实现与做到,产品注重是做好。

做好相对于做到没有一个明确的目标,因此需要反复迭代。半年以来设计了很多 UX/UI,过了一段时间觉得很不好用,又推翻重来。这种自虐的感觉真的很难受。

UX/UI 到组件封装复用其实每个过程都是渐进迭代,过程很曲折,但是想到也算慢慢接近目标,也就宽慰了。放上目前的阶段性成果留作纪念。

继续阅读走火入魔做产品

HTTPS 理解关键问题

Photo by stefan moertl on Unsplash

防止中间人攻击

为了防止中间人拦截攻击,对于采用证书机构来加密服务器端公钥。这样中间人假如拦截了 HTTPS 流量,并且使用自己生成公私钥对,使用自己的私钥加密数据发给客户端,那么客户端无法使用机构提供的服务器公钥对密文进行解密,从而导致协议出错。

防止中间人窥探

由于在握手阶段是协议出一个双方都可以对称密钥,客户端采用机构认证的服务器公钥对协商好的对称密钥进行加密。这样即使中间人劫持到,由于没有服务器私钥所以无法对这段密文进行解密。

证书防篡改

证书颁发机构将服务器公钥等一系列信息首先做摘要算法,然后使用 CA 机构的私钥(非服务器公钥)对服务器公钥信息进行加密,作为数字签名,在客户端需要使用机构的公钥对证书内容进行解密。

继续阅读HTTPS 理解关键问题

z-index 层叠的一些细节

最近要把一个筛选的功能做组件化,涉及到了z-index 和定位的一些细节。z-index 的最大特点是它只有作用于定位的组件之上才有效果,比如 relative,absolute 或者 fixed。

其中 relative 很特殊,它不会脱离文档流,因此一旦 relative 定位的组件被渲染,会把父结点撑开,然后不管你怎么移动 transform 那个坑都会在。

相反 absolute 和 fixed 都脱离了文档流,因此它不会把父组件撑开,也不会留一个空白坑。其中 fixed 和 fixed 的图层处于同一维度。同一维度意味着父组件的范围可以限制子组件的表示范围,假如父组件写了 overflow:hidden,那么子组件也不会显示出来。

absolute 和其最近定位的父结点处于同一维度。同一纬度在上一段落已经得到解释。

最后,微信小程序组件中使用 fixed 定位很奇怪,模拟器可以但是 IOS 端不行。

Throttle 与 Debounce 使用场景

Photo by Cristina Gottardi on Unsplash

不管什么技术概念,都要落到实际使用场景比较容易理解。Throttle 和 Debounce 也是一样,这里我分别解释一下。

单位时间只做一次使用 Throttle

单位时间只做一次使用 Throttle。PC 上有些操作在小程序真机上延迟特别明显,比如点击按钮展开菜单的动画,假如用户点击频率过高就会导致小程序显示异常。为了解决这个问题,需要在单位时间比如 500ms 之内对用户点击只响应一次,这样可以减少动画调用的频率。

等待操作不再发生使用 Debounce

等待操作不再发生使用 Debounce。比如我们搜索根据关键词从实时后台拿到商品名称,我们不知道用户什么时候结束输入。假如每监听一个关键字就去后台拿数据会导致后端压力比较大。那么再前端就可以做一个 Debounce。当用户键入一个关键字后等待 500ms,若这 500ms 之内没有新的输入,当作用户结束输入,然后再去后台请求数据,可以减轻后端压力。

2020的最后一篇

2020年我迎来了宝贝女儿的诞生。

2020年我通过了系统架构师考试。

2020年我做了很多小玩意儿。

2020年我思考了两年的小程序也在慢慢做起来。

2020年我慢慢开始学习理财、关注投资。

疫情之下,2020 仍然给我带来了很多惊喜。感恩、努力!