找回密码
立即注册
搜索
热搜: Java Python Linux Go
发回帖 发新帖

2690

积分

0

好友

356

主题
发表于 1 小时前 | 查看: 1| 回复: 0

图片来源:RedMonk。文章根据知名前端开发者、Syntax播客联合主持人 Wes Bos 的访谈内容整理。

去年底,一个网站在开发者和设计圈同时刷屏——F1 车手 Lando Norris 的个人官网上线了。原因不在于内容,而在于其极致的浏览体验:层层叠加的 3D 动画、会“呼吸”的页面结构、随着滚动实时变化的头盔模型,以及几乎无处不在的微交互细节。

与其说这是个“看起来不错”的网站,不如说它会让你忍不住停下来、反复探索,甚至去研究其幕后的实现原理。

F1车手Lando Norris个人网站中的3D效果与赛车元素展示

就连 Syntax 联合主持人、知名前端开发者 Wes Bos 也被深深吸引。他进行了一项典型的“极客操作”:将该网站的 7.5 万行代码全部下载下来,逐行研读。结果令他震惊——这个网站远不止于炫技,它是一个被精心打磨到极致的艺术品。

网站背后是多层 3D 渲染、深度图驱动的视差效果、shader 实现的动态遮罩、基于 glTF 的实时头盔渲染,以及一套主要依赖 transform 属性的高性能动画体系。关键在于,这些复杂技术并非为了“展示技术”,而是服务于一个非常明确的目标:让用户沉浸其中,感受品牌魅力。

Wes Bos 直言,这个网站最重要的不是技术,而是“心思”。从一个简单的文字 hover 动效,到头盔反射光的细微差异,再到页面切换时的“帷幕揭开”动画,每一个细节都明显经过反复推敲。“仅一个文字悬停效果,可能就要花上一两个小时。”而正是无数这样的细节,共同构建了网站的独特灵魂。

也正因这种“过度用心”,该网站在 AI 时代产生了一种愈发稀缺的效果:你一眼就能看出,这不是用模板生成的。

这恰恰是 Wes Bos 提出一个大胆判断的起点:2026年,将成为“设计复兴之年”。

在他看来,当 UI框架、组件库乃至 AI 工具已经能让任何人“快速生成一个还不错的网站”之后,真正的差异化不再源于“能不能做出来”,而是源于:

你有没有审美、有没有取舍、有没有能力打造出令人过目不忘的体验。

今年初,Wes Bos 在一期播客中进一步阐述了这个观点。

设计复兴:为什么 2026 年将是设计之年

Kate Holterhoff(主持人,下同): 你和 Scott Tolinski 做了一个关于 2026 年的预测,其中我最感兴趣的是设计方面。你主张说设计正在复兴。为什么这是你的首要预测?

Wes Bos: 我认为设计领域这几年确实在发生转变。早期,设计至关重要,因为许多网站和应用根本无法正常使用。设计确保了可用性与友好性。同时,它也是品牌在互联网上的形象塑造。

后来,出现了大量 UI 框架,让搭建好看的网站变得轻而易举。现在,我们有了 AI,它们能够生成代码,创建出既好用又美观的网站。这很重要,因为我们似乎已经形成了一个基础框架:只需很少的努力,通过 NPM 安装或引入一些 Tailwind CSS 组件并稍作调整,就能得到一个看起来不错、相当易用的产品。这很棒,因为所有内容的基础框架都相当扎实了。

但现在我们面临的问题是:你的差异化在哪里?如果很容易就能获得一个可行的基础框架,那我们该如何进行探索?这有点两面性。在可用性方面,现在做基础事情不那么费力了,我认为我们有更多时间可以投入到风格化上。

比如,我可能会花大量时间琢磨:这个照片选择器的上传界面该怎么设计?或者这个下拉筛选器如何实现优雅的多选?过去,这类功能实现起来可能非常耗时,但现在容易多了。所以我开始注意到,那些优秀的产品正将更多时间投入到产品本身的 UX 可用性设计上。就像几个月前上线的 Lando Norris 网站,令人瞠目结舌。整个网站充斥着前沿的 Web 技术,那些 3D 效果堪称前所未见。

这就是差异化,对吧?如果网络上的一切从一开始看起来都差不多,那可能问题不大。就像你打开 Twitter、Threads、Instagram,有时甚至会忘记正在使用哪个应用,因为它们看起来太像了。很多人喜欢这样,因为熟悉感带来了易用性。

但是,从品牌的角度看,你需要一个引人注目的亮点。你需要让人们停下滚动的鼠标,需要让人们访问你的网站并享受这个过程。我认为,打造像 Lando Norris 那样精美的新一代网站,正成为人们彰显自身特色的重要方式。而且,我们已经开始看到越来越多这样的案例。

Kate Holterhoff: 确实。很多 AI 工具可以让你快速搭建网站,甚至许多 UI 组件库底层都在使用 Shadcn,因为它允许截取代码片段,方便导入。但这背后似乎有更深层的原因,导致许多网站逐渐趋于同质化?

Wes Bos: 我认为部分原因在于开发者不愿做出改变。这不是 Shadcn 出现后才有的新问题,Bootstrap、Foundation、jQuery UI 都曾面临类似情况。很多 Tailwind 相关的设计也是如此,这就是为什么很多 AI 生成的东西都是紫色的——很多开发者不一定具备设计眼光。

对于设计,有时你尝试调整,结果反而弄得更糟。直接套用现成的东西反而简单得多。有趣的是,我们使用的这些 UI 工具本就是为了提供基础框架并允许用户调整而设计的。但几乎没人愿意去做微调。

有太多网站,你几乎一眼就能看出它们使用了什么。除了工具本身,我认为时间也是一个因素。如果能套用一个看起来相当不错的 UI,远比开发者自己拼凑的东西好,他们自然就不愿再花时间微调了。

Kate Holterhoff: 是的,Gergely Orosz 的最新通讯就谈到了设计系统。他举了个例子,如果你的应用没有统一的设计风格,看起来就会像一个毕业设计项目,无法满足用户预期,产生违和感。

Wes Bos: 没错。那完全是东拼西凑。在播客里,我们常讨论“腐化”或“漂移”问题。如果没有设计体系等规范支撑,一念之间,你觉得“这个组件看起来不错,放这里应该也行”。然后不知不觉,两三年过去,界面风格开始漂移变形,最终只剩下一团乱麻般的混搭风格。

Kate Holterhoff: 随着我们迈入 AI 时代,应用程序似乎正以这种临时拼凑的方式被创建,这种趋势恐怕只会加剧。你提到了 Lando Norris 的网站,它带来酷炫体验的关键是什么?

Wes Bos: 他们用了很多有趣的方式来展示信息。比如,图库中的头盔在鼠标悬停时,周围的轮廓会动态变化。赛道以 3D 模型呈现,支持 360 度旋转。这种沉浸式体验让人忍不住想留在网站上继续探索。他们完全可以做一个非常基础的网站,但那不符合 Lando Norris 的品牌调性,对吧?他要做到最好,他做的一切都是其品牌的延伸。

每一个小细节——卡片悬停效果、贝塞尔曲线、缓动函数、边缘处理,乃至鼠标悬停在链接上时文字呈现的精妙特效——都花费了大量时间。仅是文字悬停特效这一项,很可能就需要反复打磨至少一两个小时。而这仅仅是整体的百分之一。显然,他们倾注了大量心血。

正因为投入了如此多的心思,每个人都在谈论它。效果立竿见影。说实话,我根本不看赛车,原本不知道这家伙是谁。但现在,他的个人品牌已经超越了他的圈子,传播得更远。我甚至在 Costco 看到了他的玩具,在电视上听到了关于他的消息。这显然起作用了。

Kate Holterhoff: 你是如何追踪这些优秀设计趋势的?

Wes Bos: 我时刻关注设计圈的社交媒体动态,算法会根据我的互动推送相关内容。大家也经常在推文里 @ 我。还有一些设计奖项,比如 Framer 的奖项、几个网页设计奖项网站。在 CSS 圈,这类奖项曾经是件大事。如今,随着硬件性能提升,人们正全力进军 3D 领域。基本上,只要有什么特别酷的东西出现,你很快就能听到消息。

设计师与开发者的角色融合

Kate Holterhoff: 许多开发者似乎对设计不感兴趣,希望直接使用一套系统,或专注于业务逻辑。但许多前端工程师,尤其那些自视为设计师的人并非如此。Wes,你是否将自己视为设计师?

Wes Bos: 是的,我会这么说。我喜欢设计,虽然对于那些真正的设计师来说,我可能还不够格。但我职业生涯始于设计,做过 T 恤和专辑封面,很早就接触印刷品。我认为自己主要是开发者,但我构建的所有东西,设计都由我自己完成。当然,这不同于那些花时间做深度用户体验研究的设计师,他们是另一个层次。我自认为是个设计师,并且特别享受创造精美的用户界面。

Kate Holterhoff: 这很有趣。当年我还是前端工程师时,如果工程团队超负荷,设计师有时会用 Webflow 之类的工具自己搭建网站。如今在 AI 编程时代,这种现象只会更普遍。我们正目睹这些角色以令人兴奋的方式相互融合。

但更酷的是,有了 AI 工具处理大量基础工作,我们可以使用更复杂的工具。你曾在预测播客里说过,为了运用新工具,当初甚至想成为数学家,而现在 AI 能帮你实现。这为设计师和前端工程师开辟了过去无法触及的美学可能性。

Wes Bos: 确实。AI 让人们能够跳出自己的专业领域。现在,设计师可以更深入地参与实现过程,因为他们最头疼的就是与固执的开发者打交道,后者可能不愿实现天马行空的设计。在过去一年左右,我在硬件项目中开始接触 Swift——一门我从未编写过的语言。AI 拓宽了人们的技能边界。

不过,对于那些在整个职业生涯中都在钻研浏览器内存管理等底层原理的专家来说,他们依然有不可替代的价值。但对于只想高效完成任务的人而言,这些工具太棒了。

Kate Holterhoff: 是的,人们的角色在不断演变。但我觉得唯一缺失的就是创造力和品味。AI 或许能帮你构思创意、探索未知领域,但归根结底,如果你不明白为什么某个设计是好的,那它就不会真正优秀。那些拥有创造力和审美品味的人——比如 Lando Norris 及其团队——才是关键。

Kate Holterhoff: 我想了解 Norris 网站的性能。过去这类交互性强、体验独特的网站往往非常卡顿,但 Lando Norris 的网站显然不是。你提到它没有使用 React 等框架,而是整合了多个库。这是否暗示了未来单页应用的发展方向?

Wes Bos: 我不这么认为。Lando 网站本身也是个 SPA。而且,就算用 React 构建,速度也可以很快。网站卡顿通常不是框架本身的问题。问题通常出在渲染环节,比如网络延迟或输入响应迟缓。但 Lando 网站的开发者们深谙其道。在他们的案例中,核心在于渲染性能。

为了确保极致的速度,他们做了很多优化。例如,你会发现网站上没有任何元素带有阴影效果。如果给所有元素添加阴影,浏览器就需要计算透明度、识别不同图层、处理图层混合,这会增加渲染负担。缓存、资源管理等细节都经过了大量时间的反复打磨。网站之所以流畅,纯粹是因为背后的开发者非常出色,且投入了大量心血优化性能。

Kate Holterhoff: 你联系过构建这个网站的团队吗?

Wes Bos: 是的。视频发布后,我收到了几名开发者的私信。我们尝试过邀请他们上播客,但需要经过 Lando 团队的审批,最终没能成行。不过,他们确实向我透露了不少设计决策的细节。部分原因在于他们设置了一些开发限制,另一部分则是他们花了大量时间优化性能。

设计投资的商业价值与未来趋势

Kate Holterhoff: 我听说这个网站花费了大约 5 万美元。不管具体数字是多少,显然投入了大量资源。这引出了一个问题:关于你预测的 2026 年趋势——即行业将摆脱千篇一律的网站模式,转向更具差异化的定制化设计——你认为其商业价值在哪里?企业如何证明这种高额投资是合理的?

Wes Bos: 这确实是个难题。对很多人来说,花 5 万美元做一个网站,可能永远看不到直接的销售回报。我总是把它归结为品牌策略的一部分。如果他每年在电视广告、户外广告牌上花费巨资,那么这个网站就是一个极佳的品牌延伸渠道。

计算这类项目的投资回报率确实棘手。你完全可以把所有信息用纯文本展示,也能传达相同的内容。但如果你想强化“这就是我们”的品牌形象,那么投入资源打造一个令人惊艳的网站就是值得的。这是一种品牌战略,而非直接的销售工具。

Kate Holterhoff: 我对此有些矛盾。一方面,我曾与才华横溢的设计师共事,他们能构思出工程师无法想象的方案。如果仅由工程师主导设计,结果可能不尽如人意。另一方面,像 Canva 这样的工具让普通人也能做出不错的设计,这提高了基线。问题在于,如何说服决策者,在 AI 能快速生成一个“还不错”的网站之后,为什么还需要投入更多去追求“优秀”的设计?

Wes Bos: 这就是症结所在。作为一个不靠设计谋生的人,我欣喜地看到人们用 Canva 做出的作品——教案、海报——都相当不错。用 Word 打出来的文档也能清晰传达信息。但这只是最基础的要求。现在,要如何更进一步,才能获得真正出色的设计?这是一个非常棘手的问题,尤其是当你试图说服掌握预算的人时。你需要解释,优秀的界面设计、交互体验和品牌调性远不止于表面功夫。

Kate Holterhoff: 那么,如果我们讨论的是精美的网站,是否也包含一种对“奇特网络体验”的怀念?毕竟大家都怀念旧时 Web 的多样性和实验性。

Wes Bos: 是的,“奇特”也可以很酷。当你遇到一个设计上别出心裁的应用时,就能感受到开发者倾注的心思。相反,当我察觉到某个应用只是刻意套用流行模板时,我会立刻关闭它——我无法信任这种东西。

如果页面充斥着千篇一律的紫色渐变和标准按钮,信任感会瞬间消失。所以,当我打开一个界面,只要它看起来稍微与众不同,哪怕不是复杂的交互,只要能吸引我的目光,我立刻会想:哦,这背后有人在用心设计。这让我感觉这是个可靠的产品,而不是某人通过“氛围编码”随便拼凑出来、可能半年后就失效的东西。

网站上的图片也是同样情况。如果我看到一件衬衫明显是用 AI 技术“穿”在模特身上的,我立刻会怀疑这是按需印刷的诈骗公司,或者产品质量低劣。如果是一家正规公司,就应该在这些细节上多用点心。这是一个微妙的平衡。

Kate Holterhoff: 确实如此。这其实已经隐含地谈到了投资回报率。比如,人们更愿意在那些看起来经过精心设计、使用真实模特图片的电商网站消费,因为这建立了信任感,远离了 AI 带来的“恐怖谷”效应。

Wes Bos: 是的。TikTok 就是个好例子。起初,人们用手机手持拍摄,画面不稳定,构图也不完美。后来,品牌开始用专业设备拍摄。但现在,甚至有人故意装作准备不足、狼吞虎咽的样子——刻意追求一种更真实、更原始的感觉。这就像一个钟摆,因为人们总是在追寻真实感。我能在 TikTok 视频的前 10 毫秒内做出判断——如果听到过于专业的声音或看到特定动画,我会立刻滑走,因为感觉像是在被推销。但如果有人是在自家车库用手机拍摄,我反而会觉得更真实、值得一看。

Kate Holterhoff: 最后,我想聊聊技术栈本身。我注意到,很多由“氛围编程”生成的小应用,不仅使用了框架,还总会默认采用 Tailwind CSS,而不是纯粹的 CSS、JavaScript 和 HTML。这似乎造成了一种脱节:简单的应用使用了过于复杂的方法。对于像 Tailwind CSS 这样的工具,其创建者 Adam Wathan 曾表达过对 LLM 直接使用其文档而不再带来网站流量的担忧。对于前端领域辛勤工作、思考视觉体验的人们,你怎么看这个问题?

Wes Bos: Adam 是我的朋友。他创造了一个非常成功的产品,使用量在不断飙升。但问题在于,人们通过大型语言模型来使用它,便不再访问其文档网站了,而这原本是其商业模式(通过向特定用户销售高级产品来盈利并支持开源开发)的重要一环。所幸有像 Syntax 这样的赞助商提供了支持。

我的整个业务也面临类似情况。多年来,我写了数百篇博文,发布了大量内容,而 LLM 直接“吞噬”了这些信息,现在人们可能不再需要访问原始文章了。这令人沮丧。我不知道所有问题的答案是什么。或许未来需要新的价值分配模式,比如根据使用量进行微支付?新闻业也面临类似挑战。让我们拭目以待,但我认为,围绕数据使用和商业模式的讨论还会持续很久。

原文链接: https://redmonk.com/videos/wes-bos-design-2026/

在 AI 辅助开发日益普及的今天,基础功能的实现门槛正在消失。正如 Wes Bos 所洞察的,未来的竞争焦点正在从“能否实现”转向“实现得有多好、多独特”。这要求开发者不仅要有扎实的技术功底,更要培养对美学的感知力和对细节的执着追求。对于想深入探讨前端设计与开发趋势的朋友,欢迎来云栈社区的相应板块交流更多想法与案例。




上一篇:AI Agent 场景下的数据库架构挑战:应对海量短命实例的实战方案
下一篇:国产MPP数据库GBASE 8A在CentOS 7集群下的安装配置与启停管理全指南
您需要登录后才可以回帖 登录 | 立即注册

手机版|小黑屋|网站地图|云栈社区 ( 苏ICP备2022046150号-2 )

GMT+8, 2026-3-28 02:23 , Processed in 0.541358 second(s), 41 queries , Gzip On.

Powered by Discuz! X3.5

© 2025-2026 云栈社区.

快速回复 返回顶部 返回列表