与 Instacart 首位设计师共同评审初创公司网站

cover

摘要

本期「设计评审」邀请了重量级嘉宾——Instacart 的首位产品设计师 Zayn Ali。他曾主导 Y Combinator 的内部设计团队,此次与主持人 Aaron Epstein 一起,对三家 YC 冬季 2022 批次初创公司的着陆页进行了现场解剖。评审聚焦于三大核心:布局合理性、视觉传达效果以及用户体验路径。针对 Hokali 的在线运动预订平台,评审团肯定了其清晰的标题和沉浸式视频背景,但指出过早出现的促销弹窗和未做区隔的服务页面会分散用户注意力。对于开发工具 Requestly,他们建议将技术黑话转化为用户痛点语言,并大幅精简首屏元素,以突出核心下载动作。在分析环保插件 Verdin 时,评审强调了用客户能瞬间理解的标语替代内部愿景式口号的重要性,并赞赏了其利用截图直观展示产品价值的做法。贯穿始终的建议是:创始人应直接借用早期用户的口述语言来撰写标题;将冷冰冰的功能列表转化为解决具体痛点的故事;并善用真实用户证言和创始人故事来构建早期信任。这些几乎适用于所有早期产品的设计策略,旨在帮助创业者清理网站噪音,让价值主张一目了然,从而显著提升转化率。

正文

引言:设计评审首秀

本期「设计评审」系列荣幸地邀请到了一位特别来宾——Zayn Ali。他是知名生鲜配送平台 Instacart 的首位产品设计师,此前还领导过 Y Combinator 的内部设计工作。在本期节目中,Zayn 将与主持人一同审视几家由 YC 冬季 2022 批次资助的初创公司网站,这些公司主动提交了他们的着陆页以供公开评审。他们将围绕页面布局(Layout)、视觉设计(Visual Design)和用户体验(User Experience, UX)展开深入剖析,期望这些具体的反馈能帮助所有创业者改进自己的网站,做出更高效的转化页面。

Hokali:在线运动课程预订平台

首先被审视的是 Hokali 的网站。页面刚一打开,一个要求用户“首单立享 65 折”的弹窗便强行跳出。Zayn 指出,这种增长黑客(Growth Hack)手法在面向消费者的产品中确实很常见,数据上往往能实现用户转化,尤其是当用户已有购买意愿时。但它的用户体验并不理想——用户为了弄清这家公司是做什么的,第一反应就是关掉弹窗,之后却又想找回那个折扣,由此产生困惑。这种操作容易造成用户疲劳。他建议,如果一定要用弹窗,至少应补充一些增加紧迫感或简要介绍业务的信息,让用户在做出决定前获得最低限度的认知。

关闭弹窗后,网站的真实面貌才展现出来。评审团对页面上方的标题给予了一致肯定:“学习新运动从未如此简单,三步即可在线预订。”这行字极度清晰,让首次访问者瞬间明白了 Hokali 的业务。自动播放的视频背景极具视觉冲击力,但问题随之而来:高尔夫和网球的画面易于辨认,而一个多人健身的场景起初被误认为只是几个人在锻炼,后来才意识到那是私人教练课程;还有一个远距离的海浪镜头虽然很美,却令人难以立刻联想到冲浪课程。这些模糊性说明,背景视频虽然营造了沉浸感,但如果指向性不明确,反而会造成认知干扰。

页面下滑后,各种服务以卡片形式呈现,悬停效果强烈,引导用户点击。但点击后却仅仅是跳转到页面顶部,这差点让评审团以为站点只有一页。实际上,这些卡片链接到了专门的课程页面。评审团强调,为每种服务(如冲浪、高尔夫)建立专属的着陆页至关重要,这不仅对搜索引擎优化(SEO)和广告投放有利,更重要的是,它能精准回答用户来到网站时心里想的两大问题:“这是什么?”以及“这个适合我吗?”。当一位冲浪爱好者点击“冲浪课程”,却停留在包含了高尔夫课程的主页时,他可能会转身离开;反之,如果立刻看到一个全方面介绍冲浪的专属页面,转化率将大幅提升。

接下来的内容区域出现了一段自动滚动的引言,宣传运动对身心的益处。评审团认为,这种通用的宣传相对较弱,且动效反而分散了用户对下方关键信任信号的注意力。页面虽然出现了“YC 支持”和“迪卡侬”品牌,以及谷歌评价的入口,但这些元素还不足以建立牢固的信任。Zayn 提议,应将真实的用户评价截图放上去,甚至最好嵌入一段十几秒的真人视频——让刚刚上完课的用户对着镜头,随性分享第一手体验。这种临场感远比文字更能激发潜在用户的向往。

主持人进一步补充道,作为初创公司,与大企业相比的核心优势就在于“小”。创始人能够提供个性化的关注。因此,在网站上讲述创始人的故事——比如“我曾和你们一样想学冲浪,但体验糟透了,所以我创建了这个平台”——这种个人的、带有脆弱感的叙述能极大地拉近与访客的距离。这会让用户觉得,屏幕背后是一个活生生的、在意用户体验的人,一旦出现问题,他肯定会负责到底。这种人格化的信任,正是早期产品最有杀伤力的销售武器。总体而言,Hokali 的网站做得相当不错,许多关键要素都已具备,当前只是需要在边缘细节上进行打磨。

暂停:您的网站也能接受评审

在进入下一个案例之前,主持人宣布了一个消息:在未来某一期节目中,我们将直接评审观众中某位创业者的网站。如果您希望得到这份直白的反馈,可以在视频下方的描述区找到谷歌表单链接,提交您的初创公司站点。现在,让我们回到评审现场。

Requestly:开发者的 HTTP 请求修改工具

接下来是 Requestly。页面顶端显眼地标注着“Y Combinator 支持”。评审团首先辨析:尽管 YC 的背书很响亮,但它是否应是用户第一眼就看到的主要信息,这值得商榷。紧接着是一连串专业的对技术的描述:截获并修改 HTTP 请求、修改头部、重定向 URL、切换主机、模拟 API 响应、延迟网络请求、插入自定义脚本等。整段文字充满了极客术语。

主持人认为,术语在这里未必是坏事,它起到了自我筛选的作用:看不懂的人自然不是目标用户。但如何检验这些描述就是最优表述?方法很简单:去问现有的真实用户。直接询问他们:“你会怎么向别人描述我们的产品?”然后,把用户说出的原话,几乎不加改动地放到网站的标题上。用户如何思考和描述这个产品,往往就是那些潜在新用户寻找同类解决方案时使用的语言。也许他们会说 Requestly 是“改 HTTP 请求最爽的工具”,也许会说完全不同的东西。这个“用户原话测试”是检验标题有效性的绝佳方法。

紧接着,页面“首屏”(Above the Fold)部分的混乱感成为了集中抨击的对象。主标题下拖着一个逗号分隔的冗长副标题,紧接着是两个并行的下载按钮(“下载 Chrome 版”和“下载 Mac OS 版”),还有一堆其他浏览器的可用标识,旁边堆砌着五星评分、用户评论数、活跃用户数,右下角还有一个“提问”气泡,以及一张完全看不清内容的缩略截图,背景中一个巨大的亮黄色圆形更是将注意力全部吸走。评审团一致认为:这里信息过载严重。

核心问题是,页面没有引导用户走向一个最主要的行为。团队必须明确最想让用户做的动作是什么,极有可能是“下载”,那就应该清除所有杂音,让这个动作成为首屏唯一的焦点。其他信息可以移至下方。那张微缩的截图尤其需要改变:要么放大,只聚焦于产品的核心界面局部,让用户看清产品究竟如何解决问题;要么索性移除。创始人由于天天面对自己的产品,熟知每个按钮的用途,但访客初来乍到,面对一张没有上下文的全局截图,只会感到迷茫和混乱。

下方内容中,大量区块在罗列产品功能,如“生成自定义 API 响应”。但访客真正关心的是:“这能帮我避免什么痛苦?”而非功能本身。评审团建议,将这些功能重新包装成“痛点解决故事”。例如,如果当前开发者为了模拟一个 API 响应需要辗转多个软件、操作繁琐至极,那么文案就应径直描绘这种痛苦,然后引出 Requestly 能让其“永远告别这种折磨”的承诺。这种从痛点到解脱的叙事,远比干瘪的功能清单更具说服力。

再往下,页面显示了庞大的规则创建数、活跃用户数和共享规则数,这些社交证据开始有效构建信任。但接下来又出现了整整两排密密麻麻的功能特性介绍,并且为了解释“团队协作”,甚至放了一张令人费解的示意图。Zayn 直言,那张图让他看得头疼。对于开发者群体,分享和协作是极其直观的概念,这类视觉解释毫无必要。冗长堆砌的特性让页面过深,用户尚未到达结尾就已感到疲劳。评审团最后强调,应该在页脚再次明确放置核心的行动号召按钮,而不是像现在这样仅请求用户“订阅邮件列表”,因为网站的首要任务仍是驱动用户下载并开始使用产品。

Verdin:电子商务的环保插件平台

最后接受评审的是 Verdin。它的主标题是:“通过自动化叙述实现即时可持续发展”。这行字让评审团瞬间迷茫,它听起来宏大却毫无实质,像一个内部愿景而非对外沟通的语句。幸运的是,下方的副标题和右侧截图力挽狂澜。副标题写道:“将环保承诺附加到任何产品和服务上,使客户参与度提升10倍,并让客户购买后自动追踪其影响。”这张截图处理得非常聪明:它在一个典型的电商太阳镜页面之上,覆盖了一层灰暗遮罩,而跃然其上的环保承诺弹窗则变得异常醒目,明确标示着“由 Verdin 驱动”。这极佳地展示了产品集成的面貌,是运用截图沟通价值的正面典范。

尽管如此,动画切换的速度略快,让人难以一次看清交互细节。且截图仍留下了一个疑问:这个环保承诺是在商家自己的网站上弹出,还是跳转到了 Verdin 的页面?清晰度还有提升空间。但最大的改进空间仍在那句标题上。评审团再次祭出“用户原话测试”:去找当前已经在自家网站上集成了 Verdin 小部件的客户,问问他们如何描述这款产品。几乎可以肯定,没人会说:“哦,Verdin 就是那个‘通过自动化叙述实现即时可持续发展’的东西。”创始人时常会陷入一个误区,试图用最少的词概括产品的所有边界情况,最终造出一个只有自己人能懂的内部黑话。对无背景的新访客而言,它毫无意义。

当访客快速滚动页面时,他们往往只读标题。因此,一个绝佳的自我检测方法是:将自己网站的标题按顺序全部读一遍,看看是否能拼凑出完整的价值主张。如果核心信息全藏在标题下的小字段落里,那就必须重写标题。对于 Verdin,其目标客户——各个品牌方——真正想解决的问题或许是:“我想让我的品牌更环保,但我不知道怎么在产品上实现。”因此,标题直接传达“无需代码,即可瞬间让你的品牌拥有环保属性”之类的概念,将极具杀伤力。

页面下方展示了众多世界级的非营利合作伙伴(如植树、海洋清理等),这一部分蕴藏着巨大的情感拉动力。环保事业本身就带有感召力,如果能让用户一眼看到自己能和这些崇高的组织产生连接,那种“简单几步就能做出贡献”的冲动便会油然而生。评审团认为,Verdin 尤其在无代码集成的便捷性上值得大书特书,这种极低的使用门槛应被提升到画面最中心的位置。好在,页面的视觉基础非常扎实:版式、配色、层级结构都设计得很到位,既易于浏览又富有吸引力,不会让人感到疲倦。上方也展示了信任企业标识和团队真实头像,下方还有客户证言,这些构建信任的核心要素一应俱全。当前的任务就是拨开标题的迷雾,让清晰、直白、富有情感吸引力的信息直达用户内心。

结语

本期的三场设计评审揭示了创业公司着陆页的几个共性问题:价值主张的表达常常陷入自我陶醉,亟待转化为用户语言;首屏内容承载过量,需要为最核心的行动号召(Call To Action)让路;功能罗列无法动人心弦,唯有描绘痛点解决之路才能引发共鸣;而真实的评价与个人化的叙事,是早期公司对抗大牌的终极信任武器。感谢 Zayn Ali 带来的精彩剖析,如果您喜欢第一期的「设计评审」,请在评论区告诉我们哪些建议或点评对您有所启发,这将帮助我们塑造这个新系列未来的内容。谢谢观看。