Fluent 2
フルーエント2 / 2022– / 양식 / 마이크로소프트 UI
색과 서체, 여백과 모서리와 깊이를 토큰화하고 Solid·Acrylic·Mica·Smoke 머티리얼을 역할에 따라 마이크로소프트 제품 전반에 배치한다.
한눈에 판단
시각적 특징
- Mica와 Acrylic
- 중성 톤의 위계
- 부드러운 모서리
- 토큰화된 깊이
적합한 용도
- 윈도우와 Microsoft 365에 어울리는 업무용 UI를 여러 팀이 똑같이 맞춰야 할 때
- 여러 제품에서 일관된 테마와 상태 표현을 기존 제품에 단계적으로 옮겨 놓을 때
이 양식 사용하기
짧은 지침을 프로젝트에 적용하거나 구조화된 사양을 AI 도구에 넘길 수 있습니다.
자세한 제작법과 출처제작 규칙, 실제 사례, 비교, 연구, 인용 형식
사전 항목
- 타이포그래피
- 글자 크기와 행간을 토큰으로 정의하고 화면 쪽에 값을 직접 쓰지 않는다
- 구성
- 간격은 하나의 기준값의 배수로 고정하고 밀도 차이는 별도 토큰으로 둔다
- 재료
- 창의 바탕에는 Mica를 쓰고 Acrylic은 잠시 나타나는 면에만 쓴다
- 주의
- 흐림과 그림자를 면의 역할과 창 상태, 라이트와 다크, 고대비에 맞춰 대응시킨다. 화면마다 일회성 색과 여백을 더하면 통일을 위한 구조가 관리할 대상만 늘리는 꼴이 된다.
- 더 읽을거리
- Fluent 2 / Acrylic / Mica / design tokens
관련 항목
- Glassmorphism (グラスモーフィズム)공통 인상: Calm.Fluent 2와 Glassmorphism 비교
- Material Design (マテリアルデザイン)공통 인상: Trust / Technique.Fluent 2와 Material Design 비교
마이크로소프트 UI 더 보기
마이크로소프트 UI에서 공통 인상이 많은 항목을 우선해 골랐습니다.
- Metro (メトロ)공통 인상: Technique / Trust.
- Windows 95 Interface (Windows 95 インターフェース)공통 인상: Trust / Technique.
- Ribbon (リボン)공통 인상: Trust / Technique.
이 항목을 인용하기
사전은 링크되기 위해 있다. 글을 쓰는 자리에 맞는 형식을 그대로 가져가면 된다.
- Link
- https://indexstyle.org/ko/styles/fluent-design
- Markdown
- [Fluent 2 — IndexStyle](https://indexstyle.org/ko/styles/fluent-design)
- HTML
- <a href="https://indexstyle.org/ko/styles/fluent-design">Fluent 2 — IndexStyle</a>