晚饭后:通过记忆重回家庭晚餐

2026年8月14日2 次浏览来源:Dev.to阅读原文

这是针对前端挑战的呈文 - 舒适食品版,完美登陆 我建造了ATER SUPPER, 一个互动的登陆网页 关于舒适食物,记忆, 和周围的人。

而不是从一盘完美的食物开始, 体验在20:47开始 - 晚饭结束后。

盘子几乎是空的。

服务碗被刮倒了 餐巾被压碎。

一相相相坐出处.

有碎屑,污渍,水环, 和所有小痕迹 人们留下 当一顿饭 已经实际生活。

中心互动很简单:你通过晚餐向后移动.

时间跨度:20:47 - 晚饭后:20:31 - 倒数:20:09 - 秒 19:43 - 服务19:21 - 食谱18:58 - 晚餐前 19:14 - 全面重建.

随着时间倒流,桌子会慢慢地重建自己.

粮还入盘.

服务碗又填满了.

眼镜再充填.

餐巾直线。

椅子向后移动到桌子上。

室取暖而还.

直到最终:大家都还在.

对于这个项目,我想探索一种想法, 舒适的食物很少只是关于食物本身。

也是这个人总是在自己面前为所有人服务。

说他们不饿 然后问几秒钟的人 食谱卡上有类似“Pepper——你知道的”。

古老的污点没人记得 这把椅子总是有点不合适 因此,与其建立餐厅网页,食谱目录,或食品交付界面,我把餐桌本身做成界面.

可以检查桌上的几件物品,以揭示一些小的记忆:一个盘子连接第二道帮助中央菜肴和家庭菜谱,一个与反复出现的仪式相捆绑的饮用玻璃,服务勺子一个旧的被子餐巾,一张被磨损的菜谱卡片 视觉系统将生成的3D/编辑风格的食品资产与本地前端交互,打字,运动,以及无障碍控制结合起来.

目标是让一个普通的家庭晚餐 觉得值得记住。

Demo Live Demo: https://after-supper.vercel.app/ 出处代码:https://github.com/xyzbutworesse/after-supper.

通过时间戳向后移动来重建晚餐,再检查桌子周围被标记的物体.

经验设计围绕一个持续晚餐的场景,从20:47的后期到大家还在现场的那一刻,这一场景一直到傍晚都在变化.

旅程 该项目起先是更传统的舒适食品登陆页.

这个想法持续了大约5分钟.

已经有无数美丽的餐厅网页,食谱网站,美食画廊,以及菜单体验.

我希望互动本身能够沟通主题,而不是简单地用被打磨的布局来包装好摄影.

由此产生了界定整个项目的问题: 如果你看到的第一件事 不是晚餐, 但是什么留 之后呢?

从那里,这种经验变成了反向重建。

最重要的设计决定之一 就是把一切 放在一个持续的晚餐场景里 与其跳出不相干地段,同一张桌子在傍晚的不同时刻变化.

每一次印章都代表同一地的不同状态.

这使得"纪事"既成为了导航系统,也成为了讲故事的装置.

建造视觉系统 我希望桌子能感觉到触觉和电影 而不把项目变成一个普通的光泽3D登陆页 物质语言被有意地保留为家用:温暖的磨损的木质垫子陶瓷板 清净的饮用眼镜 刷取的金属餐具 软衬纸 手写米粒 酱料痕迹 碎屑 污渍 以及其他不完善之处 我利用AI辅助的图像生成为晚宴创造一个连贯的视觉世界,包括不同的桌状和单个物品.

这些资产随后被作为可控层并入前端,而不是作为

分享