Menu

Individual skill

finesse-ui

0upvotes

支持 Apple 苹果风设计语言：官网展示、应用界面与空间材质，按需加载规范及七个交互示例。做「不廉价」的高质感网页界面。覆盖四类：品牌页（落地页·官网·个人主页·作品集·发布页，含 WebGL/Three.js/Canvas/GSAP 真视觉引擎）、产品与工作台（dashboard·管理后台·数据看板·控制台·发布流程·配置页·数据表格）、AI 工作台与智能体控制台（运行流·工具调用·人工审批·成本账单）、电商页（商详·列表·购物车·结算）与 H5 手机端页面（活动页·app 原型·移动端商详·报告 H5，390×844 帧、安全区与拇指热区）。按 register 分流：brand 走灵魂+奇观引擎，product 走配色系统+组件+密度，commerce 走防暗黑模式骨架，h5 是容器再包一层内容语法。自带反同质化五轴、反廉价黑名单、动效六路线×十族效果目录、移动端六条底线，以及 scripts/detect.mjs 机器自检。触发词：让它高级点、有质感、别像 AI 做的、每次都差不多、落地页、官网、个人主页、作品集、dashboard、后台、工作台、每日工作台、打卡页、数据看板、控制台、AI 工作台、智能体控制台、商详页、结算页、H5、活动页、手机端页面、app 原型、动效、炫酷、加点动画、让它动起来、滚动动画、页面转场、微交互、单个组件、按钮、弹窗、抽屉、手机端错位、finesse。凡是要求「好看/高级/有设计感/别廉价」的页面、H5 或组件，先读本 skill 定标准再动手；即使代码由别的工具生成，这里的视觉与质感规则依然适用。

.doubao/skills/finesse-ui/SKILL.md

Read pinned source

Source commit c7a91448baf6e98fecf542915cdb7e3155bddc45

What was checked

Matches the observed repository HEAD
Yes
Scanner rules are current
No
Repository scan complete
No
Skill scan complete
No
Observed behavior
Not checked yet
Last checked
Nov 4, 2026

These are observations at the recorded commit, not a guarantee of safety. Review the source before running it.

Install this skill

Choose an agent in your Stack or copy a command below. Commands fetch the pinned commit and copy only this skill directory. Existing destinations are refused. Copying a command does not install anything.

An install command is unavailable: current rules, complete repository and skill scans, an eligible behavior level and a permitted license are required.

Repository context

Repository stars (not skill ratings)
967
Repository last updated
Oct 23, 2026
License
MIT

Observed agent integration: No specific integration evidence. Standard SKILL.md installation does not imply verified compatibility.

Files and excerpt

File metadata and permitted, redacted excerpts come from the recorded scan. Source links are pinned to that commit.

Browse files
Read excerpt

# finesse — Technically Spectacular · Soul-Distinct · Never Cheap

> **finesse builds two kinds of interface and routes by register (§0):**
> - **brand** — design IS the product: landing pages, brand sites, launches, portfolios, hero pages. Optimize for **spectacle + soul + first impression** — a real visual engine, an opinionated personality.
> - **product** — design SERVES the product: dashboards, admin panels, analytics, data tables, app shells, settings. Optimize for **clarity + density + usability** — and still never cheap.
>
> The through-line is identical: **high craft, zero AI-slop.** What applies to **both** is the **universal craft floor** (tinted neutrals, no `#fff`/`#000`, translucent/hairline borders, tinted shadows, contrast floors), the cheapness blacklist (§6), and the pre-flight (§8). What **forks** is the *substrate above that floor* and the middle: **brand** lays the §3 brand substrate (`design-dna.md` — grain, vignette, display type) and reaches for a hero engine (§4); **product** lays its **own** substrate (`product-ui.md` §0 — surfaces, cards, KPI tiles, density) and reaches for a component system + data viz. A dashboard is a **different design language**, not a brand page with charts — it does **not** inherit grain / vignette / giant hero type / dark-default / a hero engine.
>
> **Two more registers sit alongside them, and they work differently from each other.** **commerce** (PDP/PLP/cart/checkout) is a *hybrid* — route it to brand or product by what the specific page is doing. **h5** (phone-only screens: app UI, 活动页, mobile PDP, report H5) is a **container**: it fixes the frame, the safe areas, the thumb hierarchy, and the OS furniture, then wraps one of the other three for the content grammar underneath. A mobile PDP is `h5` + `commerce`; an app dashboard screen is `h5` + `product`. h5 never replaces a content register — it wraps one.
>
> Every rule below is **contextual**. Nothing fires automatically. Read the brief, set the register, then pull only what fits. A skill that produces the same page for every brief has failed.

---
Back to top