OKO · Memoria · YINA SUSHI

把一家日料自助餐厅,做成值得记住的官网

这份说明记录本次 YINA SUSHI 官网的核心判断:它不是简单把菜单、电话和地址放上去,而是把“自助的高性价比”和“现做日料的精致感”放进同一个体验里。

01 · 项目理解

先把店读懂,再决定怎么设计

YINA SUSHI 位于 Coignieres,经营重点是日式自助、寿司、刺身、热菜、外卖和 click & collect。旧系统数据里确认了地址、电话、营业时间、午晚市价格和真实菜品/图库素材。

所以这一版没有使用 AI 幻想素材,而是优先把 YINA 自己已有的真实图片压缩、裁切、替换进页面。这样老板第一眼看到的是自己的店,而不是一套套模板的“漂亮空壳”。

02 · 视觉方向

墨黑与香槟金:把自助做出料理感

整站控制在深墨黑、暖米白、香槟金三类主色。黑色让菜品在画面里更突出,金色负责把“自助餐”常见的廉价印象压下去,转向更克制、更有质感的日料表达。

墨黑 #0E0B0A

用于全站背景,承托菜品和金色细节。

香槟金 #C2A06B

用于按钮、标题和重点数字。

暖米白 #F3ECDD

用于正文和弱对比信息。

03 · 体验亮点

用动效和结构制造记忆点

开场与 Hero

进入页面先看到品牌和真实主图,配合轻量动效把“日料氛围”建立起来,再迅速给出外卖和 click & collect 入口。

横向菜品画廊

桌面端用横向 pinned gallery 展示菜品,移动端降级为更稳的横向滑动,避免手机上卡顿或溢出。

移动底部快捷栏

手机用户可以随时拨打电话、打开导航、进入点餐,不需要在长页面里反复寻找。

04 · 实用工程

看不见的部分,决定网站能不能真正交付

FR / EN
法语优先,英文备用
/menu
独立 clean URL 菜单页
WebP
真实素材压缩后上线

本次也补齐了 FAQ、法律页、Cookie 说明、Google Maps 加载同意、JSON-LD 结构化数据、robots/sitemap,以及预览路径下的资源兼容处理。

从真实素材、深色料理感,到一键点餐和 clean URL 菜单页,YINA SUSHI 这版已经从模板变成了自己的官网。

下面可以直接打开当前预览站查看。

打开 YINA SUSHI 官网 →
Designed with care by OKO · YINA SUSHI · 2026