Material Design
머티리얼 디자인
머티리얼 디자인은 구성 요소와 상호작용을 위한 시스템입니다. 계층화된 표면, 목적 있는 모션, 유연한 레이아웃 및 공유 디자인 토큰을 사용합니다.
다른 예시
Android 서비스 앱은 색 역할을 명확히 하고 익숙한 부품들을 써요. 겹치는 부분이 있을 때만 입체감을 보여줍니다.
주요 부분
- 01Content surface
- 02Distinct visual treatment
- 03Action and readability check
사용할 때
사람들이 익숙한 플랫폼 동작을 기대할 때는 해당 규칙이나 공식 부품을 사용하세요. 이는 시스템이 안정적으로 성장하는 데에도 도움이 됩니다.
다음 경우에는 사용하지 마세요
외형만 복사하지 마세요. 동작, 상태, 접근성에 대한 Material Design 규칙도 따르세요.
코드에서 사용된 이름
Material tokens + components 출시하기 전에
Check content order, shared design values, component consistency, contrast, zoom, and layout changes by screen size. Verify every theme, language, and state. If there is motion, offer an equal reduced-motion experience.
Outcome：Complete the task with 머티리얼 디자인 (Material Design)。 User context：Android 서비스 앱은 색 역할을 명확히 하고 익숙한 부품들을 써요. 겹치는 부분이 있을 때만 입체감을 보여줍니다. Design concept to apply：머티리얼 디자인 (Material Design)。 Why it fits：사람들이 익숙한 플랫폼 동작을 기대할 때는 해당 규칙이나 공식 부품을 사용하세요. 이는 시스템이 안정적으로 성장하는 데에도 도움이 됩니다. Do not use it when：외형만 복사하지 마세요. 동작, 상태, 접근성에 대한 Material Design 규칙도 따르세요. Design requirements: Set the content order, shared design values, and reusable components. Define how the layout changes by screen size and state. Keep useful design choices separate from decoration. Inclusion and resilience: Check contrast, zoom, languages, themes, and reduced motion when needed. Do not use color or effects as the only way to show meaning. Acceptance criteria: The design stays clear on phones and desktops, at zoom, in every theme, and in all supported languages. Interactive states stay clear and consistent. Evidence and limits (evidence boundary)：해당 출처에 대해 공식적인 것입니다. 다른 플랫폼이나 팀은 그 용어를 다른 방식으로 사용할 수 있습니다. Unknowns to confirm: Brand limits, amount of content, supported themes and languages, target devices, and design-system rules.
이 요청을 확인하세요
Review how 머티리얼 디자인 (Material Design) is used now. Definition: 머티리얼 디자인은 구성 요소와 상호작용을 위한 시스템입니다. 계층화된 표면, 목적 있는 모션, 유연한 레이아웃 및 공유 디자인 토큰을 사용합니다. Release checks: Check content order, shared design values, component consistency, contrast, zoom, and layout changes by screen size. Verify every theme, language, and state. If there is motion, offer an equal reduced-motion experience. Before changing code, list the evidence, gaps, severity, and the smallest safe fix.