Léo Parpeix - Portfolio 2026

作品集通常一打开就是项目，Léo Parpeix 的作品集一打开却是一间三维渲染的雕塑工作室。房间里有奶油色的灰泥墙、三扇拱形窗、人字拼的木地板、一架靠墙的木梯，几个台子上摆着几何小样。正中的台子上就是那朵长着脸的石膏雏菊，它的设计图挂在右边墙上。页面在旁边只配了一行字，Driven by detail. Obsessed with seamless motion.（被细节驱动，执着于流畅的动效。）成品和图纸并排摆着，这个画面把那行字说的对细节的执着直接摆到了访客眼前。

这个站会直接告诉访客哪里可以动手玩。页面中段有一只黄色的三维蜜蜂在飞，页面上配着一行小字，写着点一下喂蜜蜂。访客一动鼠标，光标旁边也会出现一个黄色的小胶囊，上面写着点一下开声音。Léo Parpeix 没有把这些彩蛋藏起来等人发现，说明就写在旁边，访客不用自己摸索就知道哪里能点。

工作室之后，访客往下滚，镜头会走进别的房间，其中一间是图书室。这些房间是这个站的主角，占去了页面上最显眼的位置。

他做过的项目反而排在房间后面，而且摆得很紧凑。二十多个项目的缩略图和视频横着排成一条条带，访客可以用鼠标拖着看。完整的项目清单放在作品档案页 Archives 里，做成了一张表格，这是这个站在内容上最实在的地方。作品集常见的做法是一张大图配一个标题，Léo Parpeix 换成了表格，每个项目一行，列出年份、拿过几个奖、团队有几个人、在哪家公司做的，以及他本人具体负责什么。比如 Dioriviera 那一行写的是五人团队，在 ImmersiveGarden 做的，他的角色是艺术总监，兼做界面、三维和交互设计。一份用来找工作的作品集主动说明自己只是五个人里的一个，看的人反而更容易判断他到底能做什么。

这个站的画面由一间间三维渲染的房间撑着。图书室里有暖色的木书架、粉彩色的书脊、斜靠的梯子和几幅剪纸风格的画。所有房间都用同一套画风，柔和的光、哑光的石膏、背景虚化的浅景深，还有没上漆的素木头。这套画风在近几年的三维渲染图里经常能看到，并不是 Léo Parpeix 发明的。站上真正属于他自己的形象是那朵长着小脸的石膏雏菊，他把它当作自己的标志，让它在站里反复出现。那只蜜蜂则不属于任何一个房间，直接浮在版面上面，一路跟着页面走。

版面上的文字只用了两款字体，分量几乎全压在少数几个巨大的词上。排大字的那一款只写了 247 个字符，最大到 216px，排正文的那一款则写了 9,712 个字符。大字按字数只占 2.5%，按在屏幕上占的面积算，却占了六成。

这些巨大的字里还藏着一个拼写错误，一个 216px 的标题把 Passionate（充满热情的）拼成了 Passionnate，多了一个 n。这份作品集开场就说自己被细节驱动，却在全站最大的字号上拼错了词。

界面上的颜色用得极少，大字看上去是黑的，其实是一种极深的墨绿。全站的文字只有纯黑、这种墨绿和米白三种颜色，大字差不多全用墨绿，只是它深到几乎看不出是绿。房间里那些暖色调都来自三维渲染，版面自己的颜色近乎素净。页面上鲜艳的颜色只出现在四个地方，那只蜜蜂、跟着鼠标的黄胶囊、项目条带上一个写着 DRAG（拖动）的黄标签，以及页脚单词 JOURNEY 里字母 U 中间嵌着的一个橙点。黄色只用在访客可以动手的地方，它和旁边的说明文字一起告诉访客哪里能点。

在三维房间那几段，访客往下滚时推动的是一台在房间里往前走的虚拟摄影机，镜头一路穿过房间。Léo Parpeix 把滚动交给了平滑滚动库 Lenis，它把滚轮的每一下都拉成一段带缓动的滑动，镜头因此是平稳地往前推，而不是一格一格地跳。

这台摄影机走得很稳，只在一个地方慢了一下。页面停着不动时，帧率是 60.1 fps，一帧都不掉。访客一边滚动一边看时，帧率平均是 58.9 fps，也几乎没有损失。唯一的波动出现在从三维首屏过渡到内容区的那一段，这时画布还在跑，页面上普通的文字和图片又同时进场，帧率一度掉到 55 和 49。过了这一段，帧率就一路稳在 60，直到页面底部。

那只蜜蜂和那个黄胶囊是页面上两个会回应访客的小角色，它们的动法都很轻。蜜蜂跟着页面飘，访客点它，它会有反应。黄胶囊跟着鼠标走，可鼠标一停下，它就缩到看不见。这个站的四条音轨要等访客点一下才会开，而开声音的提示就写在这个胶囊上，所以不习惯动鼠标的人很容易漏掉它。

这个站完全没有理会减少动态效果的设置。操作系统里的这个设置是给容易被动画弄得不舒服的人用的，可不管访客开不开它，页面上跑的动画都一模一样，摄影机照样在房间里穿行。

这个站是用构建工具 Vite 打包的单页应用，换内容时不重新加载整页，代码都在一个主文件里。三维画面是两块 three.js 画布，声音交给音频库 Howler，滚动交给 Lenis。

访客打开一次要下载 31.8 MB，其中 25.5 MB 是贴在房间表面的图片，也就是纹理，一共 89 张。最大的几张是树的前后两层、地板、地面和石头，每一张都在 1.25 MB 到 1.7 MB 之间。房间里的三维模型有 6 个文件，共 2.3 MB。剩下的图片、声音、脚本和字体加起来不到 4 MB。

这些纹理用的是 KTX2 压缩格式，这种格式在显卡的显存里也保持压缩状态。普通的 PNG 图片送进显卡之前要先解压，占的显存会比下载体积大好几倍，KTX2 就不会。纹理格式却只管显存，管不了下载，这个站没有做任何分批加载，访客第一次进来仍然要把 25 MB 的纹理全部下载完。

即使要下这么多东西，页面的版面还是很快就出来了。版面出现的时间不太稳定，快的时候 380 毫秒，慢的时候 590 毫秒，都远快于 Google 建议的首次内容绘制 1.8 秒。页面上最大的那块内容也几乎同时画完，加载过程中也没有东西跳位置。原因是三维资源要等页面加载完之后才由代码去取，所以它们不会挡住版面。

三维物体的边缘一点锯齿都没有，因为 Léo Parpeix 让画布按两倍的宽和高来渲染。两块画布里的一块实际渲染的尺寸是 3840×1890，显示出来却只有 1920×945。这种做法叫超采样，画面先按四倍的像素数画出来，再缩小贴到屏幕上，物体边缘的锯齿就在缩小的过程中被平均掉了。这样画出来的边缘最干净，只是显卡每一帧都要画四倍的像素。

Léo Parpeix 的作品集在无障碍上只做对了两处，最严重的几处问题又恰好都把人挡在门口。页面做对的是声明了语言，装饰性图片的替代文字也全部留空，读屏软件会直接跳过它们。可访客用键盘浏览时，页面上完全没有焦点框，焦点走到哪里都看不出来。访客第一次按 Tab，焦点就落在声音按钮上，而这个按钮上既没有文字，也没有给读屏软件念的名字。键盘用户因此一进门就卡住，既不知道自己停在哪，也不知道按下去会发生什么。

页面的结构也几乎没有标出来，读屏用户很难在页面里找路。读屏用户靠一种叫地标的标记在页面各区域之间跳转，整页却只有一个主内容地标，页眉、导航和页脚都没有标，也没有让键盘用户直达正文的跳转链接。216px 的 INTERACTIVE DESIGNER 和拼错的 Passionnate 这些最大的字，在代码里都没有标成页面的主标题。页脚那句 LET'S CREATE A REMARKABLE JOURNEY（一起创造一段难忘的旅程），视觉上是一句话分三行，在代码里却是三个标题，读屏软件会把它当成三个标题分别念出来。

Awwwards 的四项设计评分里，这个站只有创意（Creativity）上了 8 分，易用性（Usability）最低，7.34。创意分高大概来自那间可以走进去的工作室，易用性偏低则可能和容易漏看的声音提示、键盘用户一进门就卡住有关。五位评委的总分是 7.00、7.20、7.00、7.40、7.40，挤得很紧，没有一位明显偏低。

开发奖各分项之间的差距要大得多。动画（Animations）8.40，明显高出一截，语义（Semantics）和无障碍（Accessibility）并列最低，都是 7.00。一位乌克兰评委的打分拉得最开，他给动画打了 10 分满分，给语义、无障碍和性能都打了 6 分。这张评分卡和站上的情况几乎逐条对得上，动效这边滚动平稳、边缘干净，语义和无障碍这边只有一个地标，键盘焦点完全看不见。

FWA 在 9 月 28 日把当日站给了它，离 Awwwards 的两个奖正好 14 天，分数是 83。FWA 不公布分项分数，奖项页上登的说明只有一句，说这是艺术总监兼交互设计师 Léo Parpeix 的作品集，他专门做注重创新、以用户为中心的独特网站。这句说明只是一段自我介绍，没有提到那间可以走进去的工作室，也没有提到站上的三维场景和声音。FWA 给这个站归的三个类别是动画、好玩可互动（Fun & Playable）和个人作品集，其中动画和好玩可互动这两类，说的正是那间工作室、三维场景和声音。

这个站是 Léo Parpeix 第一次拿到 Awwwards 当日站（SOTD），在这之前他拿过五次荣誉提名。他在 Awwwards 主页上写明自己在数字设计公司 Locomotive 任职，同时挂着一句，我在找一份好公司的自由职业工作。这句话解释了这份作品集的写法，那张主动交代团队规模和个人角色的 Archives 表，正是写给想雇他的人看的。Awwwards 和 FWA 给这个站写的署名并不一样。FWA 这次只署了 Thoma Lecornu 一个人，Léo Parpeix 本人不在署名里。Léo Parpeix 的 FWA 主页上只有一次获奖，是 8 月 7 日 Gabriel Beaugonin 的作品集，81 分，他在那个站上是三位署名者之一。Thoma Lecornu 在 Awwwards 上没有可查的主页，他的 FWA 主页是 9 月 24 日才建的，上面没有简介，所以他在这个项目里负责什么仍然无从得知。