이 페이지는 Cloud Translation API를 통해 번역되었습니다.

적응형 레이아웃 시작하기

Wear OS 생태계는 화면 크기가 다양한 기기로 구성됩니다. 적응형 UI 원칙을 활용하는 것은 모든 사용자에게 최상의 환경을 제공하는 데 중요합니다.

적응형 UI란 무엇인가요?

적응형 UI는 렌더링되는 화면 크기와 관계없이 사용 가능한 모든 화면 공간을 최대한 활용할 수 있도록 확장되고 변경됩니다.

적응형 UI는 레이아웃 로직에 직접 빌드된 구성요소와 메서드를 사용하여 반응형으로 변경됩니다. 또한 이러한 레이아웃은 다양한 화면 크기에 다른 디자인을 적용하는 화면 크기 중단점을 활용하여 사용자에게 훨씬 더 풍부한 환경을 제공합니다.

새로운 환경을 설계할 때 유의해야 할 주요 참조 크기에 대해 알아보세요.

원형 화면에서 적응형 레이아웃을 디자인할 때 스크롤 뷰와 비스크롤 뷰에는 각각 UI 요소를 확장하고 레이아웃과 컴포지션의 균형을 유지하기 위한 고유한 요구사항이 있습니다.

스크롤 보기
모든 상단, 하단 및 측면 여백은 클리핑을 방지하고 요소의 비례 배율을 제공하려면 백분율로 정의해야 합니다.

스크롤하지 않는 뷰
모든 여백은 백분율로 정의되어야 하며 세로 제약 조건은 사용 가능한 영역을 채울 수 있도록 중간에 있는 기본 콘텐츠가 늘어나도록 정의되어야 합니다.

다음 이미지는 광범위한 제안입니다. 예시는 설명을 위한 것입니다. 각 구성요소 또는 노출 영역 페이지를 보고 자세한 상황별 반응형 안내를 확인하세요.

더 많은 콘텐츠를 한눈에 확인
반응형 레이아웃을 사용하면 한 화면에 더 많은 칩, 더 많은 카드, 더 많은 텍스트 줄, 더 많은 버튼을 표시할 수 있습니다.

더 많은 콘텐츠 요소 표시
정의된 화면 크기 중단점에서 적용되는 새 레이아웃을 활용하여 가능한 경우 새 콘텐츠를 도입할 수 있도록 하여 화면 크기가 큰 기기에서 사용자에게 추가 가치를 제공합니다.

한눈에 보기 쉽게 개선
추가 화면 공간을 사용하여 더 큰 컨테이너, 더 큰 텍스트, 더 두꺼운 링, 더 세분화된 데이터 시각화를 제공하여 사용자가 더 쉽게 살펴볼 수 있도록 합니다.

사용성 개선
추가 화면 공간을 사용하여 더 큰 탭 타겟, 더 큰 시각적 계층 구조, 콘텐츠 항목 사이에 추가 공간을 제공하여 인터페이스를 더 쉽고 편하게 상호작용할 수 있도록 합니다.

최적화된 구성
업데이트된 구성요소 및 템플릿을 활용하여 모든 화면 크기에서 UI의 디자인과 분위기를 개선합니다.

Google 품질 가이드라인은 다음과 같은 3가지 수준으로 구성됩니다. 3가지 등급 모두에서 가이드라인을 준수하여 사용자에게 최상의 환경을 제공하세요.

모든 화면 크기에서 지원
앱이 모든 화면 크기에서 고품질 환경을 제공하는지 확인합니다. 사용 가능한 앱 공간을 완전히 사용하는 레이아웃을 만듭니다.

반응형 및 최적화
허용되는 기기에서 사용자에게 더 많은 콘텐츠를 게재하고 다양한 화면 크기에 맞게 자동으로 조정되는 반응형 레이아웃을 활용합니다.

적응형 및 차별화
중단점을 활용하면 작은 화면의 기기에서는 불가능했던 강력하고 새로운 환경을 큰 화면에서도 제공하여 추가적인 공간을 최대한 활용할 수 있습니다.

설정된 표준 레이아웃을 사용하여 다양한 기기 크기에 맞게 UI가 원활하게 조정될 수 있도록 합니다.

Google의 표준 레이아웃은 모든 화면 크기에서 고품질 환경을 제공하기 위해 신중하게 개발되었습니다.