UI FLOWKNOWLEDGE SYSTEM

色彩与装饰 · Color & Decoration

材料设计
Material Design

以真实材料隐喻、海拔层级、明确状态和系统化组件为核心的 Google 设计语言。

Google’s material metaphor system built around elevation, surfaces, states, motion, and systematic components.

交互预览

这是 mianhua UI Glossary 的原生 Preview Runtime,不是静态截图。

可以直接对 Agent 说

请以「材料设计 / Material Design」为核心方向重设计这个界面。

角色:你是一名熟悉 Google Material 体系、可访问性和组件状态的产品 UI 设计师。

设计理念:界面由材料化界面层组成,通过海拔层级、容器色、状态层和动效表达层级,而不是随意堆阴影。

适用场景:移动应用、工具型产品、表单流程、设置页、跨平台产品和需要成熟组件规范的业务系统。

视觉要求:建立主色、辅助色、界面层、错误色等语义色彩角色;卡片、导航、列表、悬浮操作按钮、表单和按钮使用一致圆角与间距;阴影只表达真实层级。

交互要求:所有按钮、列表项、输入框都要有悬停、聚焦、按下、禁用、加载和错误状态;动效应体现进入、退出、容器转换和状态反馈。

输出格式:给出色彩角色、界面层/海拔层级、组件清单、状态层、动效、无障碍、移动端适配和避免把材料设计做成普通卡片流的反例。

相关可运行档案研究

该术语暂未建立精选案例映射,可从馆藏中继续搜索。

返回术语实验室 · 浏览完整馆藏 · 读取术语 API