oil-oil / oil-ui
oil-ui
Design, improve, and review interfaces for websites, apps, dashboards, and components: explore directions, generate side-by-side comparisons, and refine visual hierarchy against real screenshots. Delivers a comparison page, design notes, a comp, or a working interface when asked. Design judgment only. Hand off to oil-ui-pro when that skill is installed.
Install
npx skills add https://github.com/oil-oil/oil-ui --skill oil-ui说服型页面首屏骨架
落地页、品牌页、产品发布页、展览页等以说服、传递理念为主的页面,按本规范选定首屏骨架(整体设计方向流程见 设计方向 [blocked])。
模型最顽固的习惯是左右分栏,它在写文案之前就定下来了:先想好标题、一段说明、一个按钮,摆好就是左右两栏。所以骨架要在写任何文案之前决定。
每个方向先从下表选一个首屏骨架,再用 3–5 个方框画出首屏线框:每块是什么、占首屏多大面积、阅读从哪里开始。
规则:
- 同一轮的方向,骨架互不相同。
- 所谓“大标题九栏、说明三栏”同样算左右分栏。
- 骨架定好之后再写文案。文案去适应骨架,不让骨架去适应“标题 + 说明 + 按钮”的组合。
构图的大胆程度和调性无关。安静精致的产品,一样可以把一句话放在空白首屏正中,或让纵排标题贯穿整屏,或让界面本身占满首屏。调性决定音量,骨架决定结构;不要因为调性偏安静,就退回左右分栏。