跳至内容
NextClick

概念作品,Premium 配套

Hone.

预约制理发室,吉隆坡茨厂街. 咖啡店楼上的三张椅子,还有一道你靠滚动走进去的大门。

打开线上版本
Hone 首页的桌面版画面

当初设定的目标。

概念简报:卖一个从街上根本看不见的房间。没有招牌,不接散客,第一印象必须替一个店面完成它平常在做的事。

  • Next.js
  • Scroll-scrubbed film
  • Generated photography
  • Static rendering

你推开门,滚动带你走进去.

首屏是一张从门内侧拍的照片。滚动会擦洗一段真实的五秒推轨镜头,穿过那道门往前走,直到你站在房间正中央。影片以很短的关键帧间隔编码,所以定位是精准的;而且它追的是一个带阻尼的目标值而不是原始滚动位置,因此看起来像有人端着摄影机在走,而不是一本翻页动画书。

一家理发店或沙龙能从这里得到什么:一个在任何人开口问之前,就已经回答了「你们在哪、多少钱、怎么预约」的页面,以及一则抵达 WhatsApp 时已经写好的预约讯息。

量出来的,不是讲出来的。

Largest Contentful Paint
48 ms
Cumulative Layout Shift
0
Median frame
8.3 ms
Anti-patterns found
0

在正式构建版本上以 Chromium tracing 实测。重点不在这几个数字本身,而在于你的网站上线时,也会有属于它自己的数字。

WhatsApp 联络下一个作品: AZ Car Automotive