ai可以摸平技术,但抹不平品味

48 阅读5分钟

年初熬了几个通宵,用 cursor 搓了一个浏览器插件,经过几个月的产品沉淀,目前已经积攒超过 8000 的活跃用户。

自从 2016 年开始工作,近10 年最大的震撼就是来自于 AI Coding

技术护城河被打破之后,我开始重新想一个问题:当 " 会不会写代码 ” 不再稀缺,真正还值钱的,也许只剩暂时无法被 AI 替代的品味与决策能力。

虽然和专业产品设计比,我还差得很远,但我想聊聊这半年来,我在产品品味和设计决策上的一些思考。

网页高亮标记 方案设计比较

我做的插件叫全提问,可以同时提问多个 AI,获得更全面更准确的答案。在页面上我希望增加一个马克笔标注的功能,用户在查看 AI 答案时,可以标记重要内容,方便对比重要观点。

线上地址:aichatproxy.com

方案一:我的拙略设计

方案一是我的设计思路,我认为开启马克笔高亮标记,应该通过一个开关来控制,开启后,用户鼠标划线立即高亮内容,如果需要改颜色?可以通过点击高亮内容,然后二次修改。具体效果如下。

插件的右上角功能区展示了 马克笔高亮按钮。然后选中内容效果如下 image.png

image.png

方案二:优秀产品的设计

方案二设计思路:用户鼠标选中内容后,展示弹框,用户如果需要马克笔标记则点击标记,如果不需要忽略即可。具体如下所示;

用户可以马克笔标记,也可以直线、曲线标记,也可以复制内容,添加想法。 image.png

方案比较

很容易就会发现第二个方案 B 对用户更加友好。

为什么呢?因为用户只有少部分情况下需要标记内容,如果用户开启马克笔标记后,后续选中内容会自动被马克笔标记,可能会造成误伤。几次无操作后,用户就会失去耐心。

而第二个方案B的设计更加符合用户直觉。用户选中了内容,他可能想要标记内容,也有可能仅仅是随手选中了一批内容,方案二在选中内容后展示弹框,给了用户更多的灵活性。此外弹框还可以展示更多功能,不仅仅局限于马克笔标记。功能扩展性更强。

问题导航功能的设计

为什么需要问题导航条?先说痛点:在AI 长对话中,用户已经发起多轮提问,如果用户想回到历史问题中,就需要不停地滚动网页,才能定位到历史问题。 因此很多用户在群里要求我增加问题导航功能。

大家来看看我的方案设计和专业设计的区别。

方案一,我的方案

考虑到当时已经有了历史会话列表,因此我在想,用户在查看历史会话列表时,可以查看每个会话的问题列表,点击问题列表,就能在网页中定位跳转到对应的问题。页面效果如下

第一层列表是会话列表,用户可以新建多个会话,每个会话里可以发起多轮提问。点击具体问题就能定位导航到该问题。无需用户手动滚动鼠标翻历史记录。

image.png

就在我沾沾自喜两周后,我发现 智谱 GLM 提供了类似的历史问题导航功能,接下来,看看专业产品的设计思路。

方案二,专业方案。

GLM 产品设计的方案里,将问题导航条整体放在了会话右侧,上下两个箭头可以顺序导航,也可以鼠标查看问题,点击即可立即导航到历史问题。非常方便~

image.png

因此我很快在产品中借鉴了他的设计思路。我的做法是在插件左侧增加单独的问题导航条,可以折叠,可以展开。

为了更加突出导航条,我将上下的箭头设计更加突出,用户点击问题后,能在所有的平台里快速定位导航到该问题。非常方便。

image.png

对于用户而言,方案二比我的方案一更加专业,用户的理解成本低、更加符合用户直觉,操作上也更加方便。

两个案例放在一起看,会发现一个规律:我之前的方案,往往是在解决「功能能不能做」,而专业方案解决的是「用户此刻想做什么」。

马克笔高亮功能里,我默认用户会长期处在「标记模式」,问题导航功能,我默认用户会先打开会话列表、再层层点进问题。这两种设计背后,是同一种工程师思维———— 把功能拆成模块,再找一个「合理」的入口塞进去。

功能确实都有了,路径也说得通,但推给用户时才发现,你的设计不符合用户直觉!

后来慢慢悟到的一点:品味,很多时候不是页面功能的花哨,而是对用户直觉的尊重和理解

尊重用户的直觉!

我现在对自己的定位也在变。技术的护城河虽然已经被打破,但是这是基本功,很多复杂的项目依然需要人的决策能力和经验。

除此之外,未来我们需要持续打磨的,是多看优秀产品、多问自己几个问题:用户在这一秒最可能想干什么?我设计的这一步,是在帮他,还是在打扰他?有没有更自然的方案?当人人都能 vibecoding 出一个能用的产品时,差距就不再是谁会写代码,而是谁更懂用户

AI 抹平了技术,但抹不平品味。