대형 화면은 앱 개발 기회를 확대해 줍니다. 태블릿, 폴더블, ChromeOS 기기의 대형 화면은 콘텐츠를 표시하고 멀티태스킹을 원활하게 하며 작은 화면에서는 불가능한 사용자 인터페이스를 지원합니다.
대형 화면용 개발을 시작하려면 대형 화면 앱 품질 가이드라인을 따르세요. 대형 화면에서 최적으로 작동하는 앱을 만드는 데 필요한 요구사항을 종합적으로 모아 놓은 가이드라인입니다.
품질 가이드라인은 대형 화면 지원, 대형 화면 최적화, 대형 화면 차별화의 세 단계로 구성되어 있습니다. 대형 화면 지원부터 점진적으로 단계를 진행하여 앱에 대형 화면 기능을 추가하세요. 기존 앱이 있는 경우 품질 가이드라인 테스트를 사용하여 현재 앱에서 지원하는 단계가 무엇인지 확인한 다음 앱이 대형 화면에 맞춰 고유하게 차별화될 때까지 단계별로 기능을 구현합니다.
대형 화면 지원
사용자가 대형 화면 기기에서 앱의 모든 기능에 액세스할 수 있는 경우 앱은 대형 화면 지원 단계입니다. 앱은 세로 모드와 가로 모드 및 멀티 윈도우 모드를 지원해야 하나, 앱 레이아웃과 사용자 인터페이스는 최적이 아닐 수 있습니다.
구성 및 연속성
기기 회전, 멀티 윈도우 모드에서의 창 크기 변경, 폴더블 기기 접기/펼치기와 같은 구성 변경으로 인해 사용자가 컨텍스트(또는 더 심각한 경우에는 데이터)를 잃을 수 있습니다.
앱이 구성을 변경하는 중에 상태를 유지 및 복원하고, 진행 중인 프로세스(예: 미디어 재생)를 재개해야 합니다.
자세한 내용은 다음 개발자 가이드를 참고하세요.
멀티 윈도우 모드
대형 화면에서는 멀티 윈도우 모드의 활용성과 생산성이 더 높습니다. 앱이 화면 분할 모드 또는 자유 형식 모드에서 다른 앱과 함께 멀티 윈도우 모드로 실행되도록 지원합니다.
앱이 멀티 윈도우 모드에 있을 때 WindowMetrics API를 사용하여 앱 창의 크기를 정확하게 확인합니다.
멀티 윈도우 지원을 참고하세요.
다중 재개
Android 10(API 수준 29)부터 기기가 멀티 윈도우 모드에 있을 때 포커스가 없는 활동이 RESUMED 상태로 유지됩니다. Android 10 전에는 포커스가 없는 활동이 STARTED 상태이지만 RESUMED 상태로 유지되지는 않았습니다.
앱이 포커스가 지정된 앱이 아닌 경우 미디어 재생, 파일 다운로드와 같이 진행 중인 프로세스를 계속 진행함으로써 앱에서 다중 재개가 지원되는지 확인합니다. 또한 기기의 카메라, 마이크 같은 독점 리소스 손실도 앱에서 처리되는지 확인해야 합니다.
멀티 윈도우 지원에서 멀티 윈도우 수명 주기를 참고하세요.
카메라 미리보기
앱에 카메라 미리보기가 포함되어 있으면 대형 화면의 방향과 가로세로 비율에 맞게 미리보기를 확인하세요. 세로 모드의 대형 화면 폴더블은 가로 모드의 가로세로 비율을 사용할 수 있습니다. 멀티 윈도우 모드에서는 기기가 가로 모드일 때 크기 조절이 가능한 창에서 세로 방향의 앱을 표시할 수 있습니다.
다음을 참고하세요.
미디어 프로젝션
미디어 프로젝션은 실제(소스) 디스플레이의 경계를 기반으로 가상 디스플레이를 만듭니다. 기기가 멀티 윈도우 모드를 사용 중이고 미디어 프로젝션을 만든 앱이 창에서 실행 중인 경우에도 실제 디스플레이는 전체 기기 화면이 됩니다.
대형 화면 미디어 프로젝션의 올바른 경계를 가져오려면 Android 11(API 수준 30)에서 도입된 WindowMetrics API를 사용하거나 API 수준 14까지의 호환성을 위해 Jetpack WindowManager WindowMetrics API를 사용합니다.
대형 화면에서의 미디어 프로젝션을 참고하세요.
외부 입력 장치 기본 지원
사용자는 외장 키보드나 마우스를 태블릿에 연결하는 경우가 많습니다. Chromebook에는 키보드와 트랙패드가 내장되어 있습니다. 앱이 키보드, 마우스, 트랙패드의 다음과 같은 작업을 처리할 수 있도록 외부 입력 장치를 지원합니다.
- 버튼, 입력란, 탐색 아이콘 선택
- 메뉴 항목, 라디오 버튼, 체크박스, 텍스트 선택
- 목록과 같이 스크롤 가능한 요소에서 수직/수평 스크롤
대형 화면에서의 입력 호환성을 참고하세요.
대형 화면에 최적화
앱이 대형 화면에 최적화되면 몰입도, 생산성, 참여도 면에서 향상된 사용자 경험을 제공할 수 있으며, 사용자는 대형 화면 기기에서 앱을 충분히 즐길 수 있습니다.
반응형/적응형 레이아웃
대형 화면과 소형 화면을 지원하려면 모든 종류의 기기에 최적의 사용자 환경을 제공하는 반응형/적응형 레이아웃을 디자인해야 합니다.
먼저 다음 내용을 숙지하세요.
- Material Design — 레이아웃 이해
- 다양한 크기의 화면 지원
창 크기 클래스
창 크기 클래스는 반응형/적응형 디자인을 구현할 수 있는 체계적인 표시 영역 중단점입니다. 창 크기 클래스를 사용하여 앱에서 사용할 수 있는 디스플레이 영역을 소형, 중형 또는 확장형으로 분류한 다음 최적화된 레이아웃을 적용합니다.
다양한 화면 크기 지원에서 창 크기 클래스를 참고하세요.
적응형 앱 탐색
소형 화면에서는 하단의 탐색 메뉴가 잘 작동하지만, 대형 화면에서는 탐색 레일 또는 탐색 창으로 늘어난 화면 공간을 더 효과적으로 활용할 수 있습니다. 앱 탐색을 화면 크기 변경에 맞게 조정합니다.
Material Design — 레이아웃 적용을 참고하세요.
반응형 UI 요소
화면 크기에 따라 UI 요소의 형식을 지정합니다. 작은 화면에서 전체 너비로 되어 있는 버튼, 카드, 텍스트 필드의 너비를 대형 화면에서 기능상 적절한 크기로 제한합니다. 대화상자나 다른 모달 창으로 전체 화면이 채워지지 않도록 하세요. 위치 컨텍스트 메뉴와 기타 요소 관련 팝업은 사용자가 선택한 요소 옆(화면 중앙 아님)에 표시되도록 합니다.
Material Design의 버튼, 텍스트 필드, 메뉴, 대화상자와 같은 구성요소를 참고하세요.
접근성
탭 및 화살표 키 탐색과 같은 접근성(a11y) 기능에 맞게 앱을 최적화합니다. 선택, 복사, 잘라내기, 붙여넣기 등 흔히 사용되는 작업을 위한 단축키를 제공합니다. 미디어 재생에 키보드 컨트롤을 사용하도록 설정합니다. 예를 들어 미디어를 재생 및 일시중지하는 데 스페이스바를 사용하거나 Enter 키를 사용해 커뮤니케이션 앱에서 메시지를 보낼 수 있도록 합니다.
접근성이 더 높은 앱 빌드를 참고하세요.
외부 입력 장치 고급 지원
대형 화면에 최적화된 앱은 키보드, 마우스, 트랙패드 입력을 위한 지원을 강화합니다. 마우스 및 트랙패드 오른쪽 버튼을 클릭하는 동작으로 옵션 메뉴에 액세스할 수 있습니다. 마우스 스크롤 휠과 트랙패드 손가락 모으기 동작을 사용하여 앱 콘텐츠를 확대/축소할 수 있습니다. UI 요소에는 마우스 오버 상태가 있습니다.
대형 화면 차별화
대형 화면 차별화 앱은 앱 스토어에서 제공하는 다른 앱보다 돋보입니다. 차별화된 앱은 소형 화면에서는 결코 제공할 수 없는 사용자 경험을 제공합니다.
멀티태스킹
대형 화면에서는 멀티태스킹을 용이하게 할 수 있습니다. 멀티 윈도우 모드는 멀티태스킹뿐만 아니라 특수 표시 모드인 PIP 모드와 멀티 인스턴스도 지원합니다.
PIP 모드
앱이 동영상 콘텐츠를 재생하는 경우 PIP 모드를 구현하여 사용자가 다른 앱과 상호작용하는 동안 앱이 동영상 재생을 계속할 수 있도록 합니다.
PIP 모드 지원을 참고하세요.
멀티 인스턴스 모드
앱 인스턴스 두 개 이상을 동시에 실행하여 문서 편집기나 콘텐츠 관리자와 같은 앱의 생산성을 높입니다.
폴더블
대형 화면 폴더블 기기는 휴대전화와 태블릿을 하나로 합친 것과 같습니다. 탁자 상태 및 도서 상태와 같은 접기 기능은 새로운 사용자 환경의 가능성을 제공합니다. 폴더블 기기의 고유한 기능을 지원하여 앱을 차별화합니다.
다음을 참고하세요.
드래그 앤 드롭
대형 화면은 앱 내 또는 멀티 윈도우 모드의 앱 간(Android 7.0(API 수준 24) 이상)에 드래그 앤 드롭 상호작용에 아주 적합합니다.
앱에 드래그 앤 드롭 기능을 추가하여 사용자 생산성과 참여도를 높이세요.
드래그 앤 드롭을 참고하세요.
외부 입력 장치의 차별화된 지원
외부 입력 장치를 데스크톱과 유사하게 지원합니다. 맞춤설정 가능한 단축키 모음을 만듭니다. 키보드와 마우스 또는 키보드와 트랙패드의 조합(예: Ctrl+클릭/Ctrl+탭, Shift+클릭/Shift+탭)을 사용 설정하여 확장된 기능을 제공하세요.
사용자가 마우스나 트랙패드를 사용하여 콘텐츠를 스크롤하는 중에 스크롤바를 표시합니다. 마우스나 트랙패드를 사용한 마우스 오버 시 플라이아웃 메뉴나 팁과 같은 숨겨진 콘텐츠 요소를 표시합니다. 데스크톱 스타일 메뉴 및 컨텍스트 메뉴를 포함합니다. 마우스나 트랙패드로 UI 패널의 크기를 조절할 수 있도록 만듭니다. 마우스로 여러 번 클릭, 트랙패드로 여러 번 탭하기를 사용 설정합니다.
스타일러스
최고 단계 앱은 스타일러스를 갖춘 대형 화면 기기를 지원합니다. 스타일러스는 사용자가 그리기, 쓰기, 삭제, 드래그 앤 드롭과 터치 및 동작 상호작용을 할 수 있도록 지원합니다.
스타일러스 고급 지원에는 압력 감도, 기울기 감지, 손바닥 및 손가락 움직임 무시가 포함됩니다(잘못된 터치는 등록되지 않음).
스타일러스 입력을 완전히 지원하여 프리미엄 기기에서 탁월한 사용자 경험을 제공하세요.
대형 화면에서의 입력 호환성에서 스타일러스를 참고하세요.
다음 단계
대형 화면 앱 품질 가이드라인을 참고하여 대형 화면 지원, 최적화, 차별화 단계에 따라 앱을 빌드하세요.
추가 리소스
동영상 컬렉션: