Wear OS 생태계는 화면 크기가 다양한 기기로 구성됩니다. 적응형 UI 원칙을 활용하는 것은 모든 사용자에게 최상의 환경을 제공하는 데 중요합니다.
적응형 UI란 무엇인가요?
적응형 UI는 렌더링되는 화면 크기와 관계없이 사용 가능한 모든 화면 공간을 최대한 활용할 수 있도록 확장되고 변경됩니다.
적응형 UI는 레이아웃 로직에 직접 빌드된 구성요소와 메서드를 사용하여 반응형으로 변경됩니다. 또한 이러한 레이아웃은 다양한 화면 크기에 다른 디자인을 적용하는 화면 크기 중단점을 활용하여 사용자에게 훨씬 더 풍부한 환경을 제공합니다.
키 화면 크기
새로운 환경을 설계할 때 유의해야 할 주요 참조 크기에 대해 알아보세요.
레이아웃 유형
원형 화면에서 적응형 레이아웃을 디자인할 때 스크롤 뷰와 비스크롤 뷰에는 각각 UI 요소를 확장하고 레이아웃과 컴포지션의 균형을 유지하기 위한 고유한 요구사항이 있습니다.
모든 상단, 하단 및 측면 여백은 클리핑을 방지하고 요소의 비례 배율을 제공하려면 백분율로 정의해야 합니다.
모든 여백은 백분율로 정의되어야 하며 세로 제약 조건은 사용 가능한 영역을 채울 수 있도록 중간에 있는 기본 콘텐츠가 늘어나도록 정의되어야 합니다.
적응형 레이아웃 및 디자인 관행을 통해 가치 높이기
원형 화면에서 적응형 레이아웃을 디자인할 때 스크롤 뷰와 비스크롤 뷰에는 각각 UI 요소를 확장하고 레이아웃과 컴포지션의 균형을 유지하기 위한 고유한 요구사항이 있습니다.
다음 이미지는 광범위한 제안입니다. 예시는 설명을 위한 것입니다. 각 구성요소 또는 노출 영역 페이지를 보고 자세한 상황별 반응형 안내를 확인하세요.
반응형 레이아웃을 사용하면 한 화면에 더 많은 칩, 더 많은 카드, 더 많은 텍스트 줄, 더 많은 버튼을 표시할 수 있습니다.
정의된 화면 크기 중단점에서 적용되는 새 레이아웃을 활용하여 가능한 경우 새 콘텐츠를 도입할 수 있도록 하여 화면 크기가 큰 기기에서 사용자에게 추가 가치를 제공합니다.
추가 화면 공간을 사용하여 더 큰 컨테이너, 더 큰 텍스트, 더 두꺼운 링, 더 세분화된 데이터 시각화를 제공하여 사용자가 더 쉽게 살펴볼 수 있도록 합니다.
추가 화면 공간을 사용하여 더 큰 탭 타겟, 더 큰 시각적 계층 구조, 콘텐츠 항목 사이에 추가 공간을 제공하여 인터페이스를 더 쉽고 편하게 상호작용할 수 있도록 합니다.
업데이트된 구성요소 및 템플릿을 활용하여 모든 화면 크기에서 UI의 디자인과 분위기를 개선합니다.
앱 품질
Google 품질 가이드라인은 다음과 같은 3가지 수준으로 구성됩니다. 3가지 등급 모두에서 가이드라인을 준수하여 사용자에게 최상의 환경을 제공하세요.
|
모든 화면 크기에서 지원 |
반응형 및 최적화 |
적응형 및 차별화 |
설정된 표준 레이아웃 활용
설정된 표준 레이아웃을 사용하여 다양한 기기 크기에 맞게 UI가 원활하게 조정될 수 있도록 합니다.
Google의 표준 레이아웃은 모든 화면 크기에서 고품질 환경을 제공하기 위해 신중하게 개발되었습니다.