이 글의 원문은 여기서 확인할 수 있으며 블로그 리뷰에는 노현석(GDE)님이 참여해주셨습니다.
태블릿, 폴더블, ChromeOS 기기를 통틀어 Android를 실행하는 대화면 기기의 수는 2억 5천만 개가 넘습니다. 지난 12개월 동안에만 거의 1억 건의 새로운 Android 태블릿 활성화 건수를 확인했는데, 이는 전년 대비 20% 성장한 수치입니다. 현재 가장 빠르게 성장하는 데스크톱 플랫폼인 ChromeOS는 92%나 성장했죠. 또한, 폴더블 기기도 연간 성장률 265% 이상의 상승세에 있음을 확인했습니다! Android를 실행해 사용 중인 대화면 기기는 총 2억 5천만 개 이상입니다. 이 모든 모멘텀을 바탕으로, 저희는 사용자와 개발자를 위해 대화면 기기에서 Android를 훨씬 더 나은 OS로 만드는 데 계속 투자하고 있습니다.
지난 Android Dev Summit에서는 대화면용으로 특별히 제작된 Android 12의 기능 출시를 발표했는데, 이 기능을 12L이라 부르며 대화면용으로 더 쉽게 빌드하게 해주는 새로운 API, 도구, 지침을 함께 제공합니다. 아울러, 사용자가 대화면에 최적화된 앱을 더 쉽게 찾을 수 있도록 Google Play의 변경 사항에 대해서도 말씀드렸습니다. Android의 대화면을 위한 새로운 기능을 소개하는 내용을 계속 읽어보세요!
12L 프리뷰: 대화면용 기능 출시
Android 12의 대화면 사용을 개선하는 출시 예정 기능이 담긴 12L의 개발자 프리뷰를 공개합니다. 이 프리뷰를 통해 새로운 대화면 기능을 사용해 보고, 앱을 최적화하고, 사용해 본 후 여러분의 의견을 알려주세요.
12L에서는 알림, 빠른 설정, 잠금 화면, 개요, 홈 화면 등에 걸쳐 대화면의 UI를 개선했습니다. 예를 들어, 600dp 이상의 화면에서는 알림 창, 잠금 화면, 기타 시스템 영역이 새로운 2열 레이아웃을 사용하여 화면 영역을 활용합니다. 시스템 앱 또한 최적화되었습니다.
2열 레이아웃은 더 많은 정보를 보여주고 사용하기도 더 쉽습니다.
또한, 멀티태스킹을 더욱 강력하고 직관적으로 만들었습니다. 12L에는 사용자가 언제든 즐겨찾기에 등록된 앱으로 즉시 전환할 수 있는 새로운 작업 표시줄이 대화면에 포함됩니다. 작업 표시줄 덕분에 그 어느 때보다 쉽게 화면 분할 모드를 활용할 수 있는데, 작업 표시줄에서 앱을 드래그 한 후 놓기만 하면 화면 분할 모드에서 앱을 실행할 수 있습니다. Android 12 이상에서 화면 분할 모드의 사용 경험을 개선하기 위해, 앱 크기 조정 가능 여부에 관계없이 자동으로 모든 앱이 화면 분할 모드로 전환될 수 있도록 함으로써 더 편리한 사용을 보장합니다.
앱을 드래그 한 후 드롭해 화면 분할 모드를 이용할 수 있습니다.
마지막으로, 기본적으로 사용자에게 더 나은 레터박스 환경을 제공하고 앱이 더 보기 좋게 표시되도록 시각적 디자인과 안정성의 개선으로 호환성 모드를 강화했습니다. 기기 제조업체에서 레터박스를 쉽게 사용자 설정 할 수 있도록 했으므로, 제조업체에서는 이제 맞춤형 레터박스 색상 또는 처리 방법 설정, 인셋 창의 위치 조정, 맞춤형 둥근 모서리 적용 등의 작업을 수행할 수 있습니다.
Android 12 태블릿 및 폴더블이 물밀듯이 밀려올 2022년 초에 맞춰 12L 기능을 출시할 예정입니다. 이미 OEM 파트너와 협력해 이러한 기능을 대화면 기기에 제공하고 있으니, Lenovo P12 Pro에 곧 제공될 12L의 개발자 프리뷰를 살펴보세요. 새로운 기능이 기기에 적용될 때까지 몇 달 남지 않은 지금이 대화면에 맞게 앱을 최적화할 적기입니다.
개발자는 다양한 크기의 창이 있는 화면 분할 모드에서 개발한 앱이 어떻게 작동하는지 반드시 확인해 보는 것이 좋습니다. 앱을 아직 최적화하지 않았다면, 다양한 구성에서 앱이 어떻게 보이는지 확인하고, 해당될 경우 새로운 호환성 모드를 적용해 보세요. 대화면 기능과 함께, 12L에는 새로운 API 레벨 외에도 개발자를 위한 몇 가지 새로운 API도 포함됩니다. 앱에 중대 변경 사항이 도입되지 않도록 주의를 기울였으므로, Google Play 요구 사항을 충족하기 위해 앱을 12L에 타겟팅 할 필요는 없도록 할 것입니다.
12L을 시작하려면 Android Studio의 최신 프리뷰 출시를 통해 제공되는 12L Android 에뮬레이터 시스템 이미지와 도구를 다운로드하세요. 기능 및 변경 사항을 검토하여 앱에서 테스트할 부분에 대해 알아보고 일정과 출시 세부 정보는 프리뷰 개요에서 확인하실 수 있습니다. 특이사항이 발견되면 여기로 알려주세요. 언제나처럼 여러분이 보내주시는 의견에 감사드립니다!
12L은 스마트폰에도 적용되지만, 새로운 기능이 대부분 작은 화면에서는 보이지 않을 것이기에 현재으로서는 태블릿, 폴더블, ChromeOS 기기에 계속 주력하고 있습니다. 추후에 프리뷰에서 Pixel 기기용 Android 베타 등록을 시작할 계획입니다. 더 자세한 내용은 developer.android.com/12L에서 살펴보세요.
대화면용으로 더 쉽게 빌드하기
지금이 바로 어떤 종류의 화면에도 적합하도록, 완벽한 적응형 앱 디자인을 시작할 타이밍입니다. 저희는 이 과정을 더 쉽게 만들고자 노력하고 있습니다. OS와 Play에서 이루어지는 이런 변화에 대비할 수 있도록 개발자 프리뷰와 함께 API, 도구, 지침에 대한 업데이트를 발표합니다.
대화면 패턴을 염두에 둔 디자인
적응형 UI를 지원하는 첫 번째 단계는 앱이 작은 화면과 큰 화면에서 모두 제대로 동작하도록 디자인하는 것입니다. 저희는 모든 화면에서 앱 UI의 크기를 조절하는 데 도움이 될 새로운 머티리얼 디자인 가이드라인에 대한 작업을 해오고 있습니다. 이 지침은 개발자의 노력에 영감을 주고 작업을 시작하는 데 도움이 될 생태계에 널리 퍼져 있는 공통 레이아웃 패턴을 다룹니다.
머티리얼 디자인 가이드라인의 적응형 UI 패턴
새로운 탐색 구성 요소를 사용한 반응형 UI 빌드
사용자에게 가능한 최상의 탐색 환경을 제공하려면 사용자 기기의 창 크기 클래스에 맞춤 설정된 탐색 UI를 제공해야 합니다. 권장되는 탐색 패턴에는 작은 화면용 Navigation bar와 중간 너비 이상(600dp 이상)의 기기 클래스용 Navigation rail의 사용이 포함됩니다. 너비가 확장된 기기의 경우 SlidingPaneLayout을 사용하여 구현할 수 있는 List/Detail 구조와 같이 새로 발표된 머티리얼 디자인 가이드라인에 더 큰 화면 레이아웃에 대한 여러 가지 아이디어가 소개되어 있습니다. Views와 Compose에서 적응형 UI에 대한 탐색을 구현하는 방법에 대한 지침을 확인하세요.
탐색 패턴을 업데이트하고 SlidingPaneLayout을 사용하는 것은 Fragment가 있는 기존 애플리케이션에 대화면에 최적화된 레이아웃을 적용하는 훌륭한 방법이지만, 많은 개발자가 여러 Activity를 기반으로 하는 애플리케이션을 보유하고 있다는 점 역시 저희는 잘 알고 있습니다. 이러한 앱의 경우, Jetpack WindowManager 1.0 베타 03에서 출시된 새로운 Activity 삽입 API를 통해 TwoPane 뷰와 같은 새로운 UI 패러다임을 쉽게 지원할 수 있습니다. 이러한 API를 지원하고자 현재 SlidingPaneLayout 업데이트 작업이 진행 중입니다. 앞으로 몇 달 후에 나올 업데이트를 기대해 주세요.
Compose를 사용하여 화면 변경에 더 쉽게 반응 가능
Jetpack Compose를 사용하면 대화면에 알맞게 빌드할 수 있고, 다양한 레이아웃을 더 쉽게 만들 수 있습니다. Compose를 채택하기 시작했다면 그 과정에서 대화면에 맞게 최적화하기에 좋은 시점입니다.
Compose는 선언형 UI 툴킷입니다. 모든 UI가 코드로 설명되어 있으며, 사용 가능한 크기에 맞게 조정할 방법을 런타임에서 쉽게 결정할 수 있습니다. 따라서 Compose는 다양한 화면 크기 또는 구성 요소에서 UI 변경 사항을 무척 쉽게 처리할 수 있으므로 적응형 UI 개발에 특히 적합합니다. Compose로 적응형 레이아웃 빌드 가이드에 알아야 할 기초적인 내용을 다룹니다.
WindowManager API를 사용하여 반응형 UI 빌드
Jetpack WindowManager 라이브러리를 사용하면 이전 버전과 호환되는 방식으로 앱에서 창으로 작업하고 모든 기기에 대해 반응형 UI를 빌드 할 수 있습니다. 새로운 내용은 다음과 같습니다.
Activity 삽입
Activity 삽입을 통해 List-Detail 패턴의 경우와 같이 여러 Activity를 한번에 표시하여 대화면의 추가 표시 영역을 이용할 수 있는데, 앱의 리팩터링이 거의 또는 전혀 필요하지 않습니다. XML 구성 파일을 만들거나 Jetpack WindowManager API를 호출하여 앱이 Activity를 나란히 표시하거나 스택형으로 표시하도록 결정합니다. 나머지는 시스템이 처리하여 사용자가 만든 구성을 기반으로 표시 방식을 결정합니다.
Activity 삽입은 폴더블 기기에서 원활하게 작동하며 기기를 접고 펼 때 Activity를 쌓거나 펼칩니다. 앱에서 여러 Activity를 사용하는 경우, Activity 삽입으로 대화면 기기에서 사용자 환경을 향상할 수 있습니다. Jetpack WindowManager 1.0 베타 03 이상의 릴리스에서 Activity 삽입 API를 사용해보시고 여기서 더 자세히 살펴보세요.
Jetpack WindowManager를 사용한 Activity 삽입
창 크기 클래스를 사용한 창 크기 감지
창 크기 클래스는 크기를 조절할 수 있는 애플리케이션 레이아웃을 디자인, 개발, 테스트할 때 사용할 수 있는 독단적인 표시 영역 중단점의 집합입니다. 창 크기 클래스 중단점은 소형, 중형, 확장의 세 가지 카테고리로 나뉩니다. 이런 중단점은 레이아웃의 단순성과 가장 고유한 사용 사례에 맞게 앱을 최적화할 수 있는 유연성이 균형을 이루는 동시에, 생태계에 있는 대다수의 기기를 대표하도록 특별히 설계되었습니다. WindowSizeClass API는 Jetpack WindowManager 1.1을 통해 곧 선보일 예정으로, 반응형 UI를 더 쉽게 빌드 할 수 있게 해줍니다. 여기서 자세히 알아보세요.
Jetpack WindowManager의 창 크기 클래스
앱이 접는 동작을 인식하도록 하기
WindowManager는 폴드와 힌지 같은 다양한 창 기능을 위한 공통 API 표시 영역도 제공합니다. 앱이 접는 동작을 인식하면 폴드와 힌지를 방지하거나 이들을 통해 자연스럽게 창을 분리할 수 있도록 창의 콘텐츠를 조정할 수 있습니다. 이 가이드에서 앱이 접는 동작을 인식하도록 만드는 방법을 알아보세요.
Android Studio를 사용한 대화면용 빌드와 테스트
레퍼런스 기기
Android 앱이 모든 기기와 카테고리에 반응하고 적응하도록 빌드해야 하므로, Android Studio 전반에 걸쳐 UI와 레이아웃을 디자인, 개발, 테스트하는 많은 도구에서 레퍼런스 기기를 도입합니다. 네 가지 레퍼런스 기기는 스마트폰, 대형 폴더블 내부 디스플레이, 태블릿, 데스크톱을 나타냅니다. 저희는 이러한 레퍼런스 기기 디자인 시 시장 데이터 분석을 바탕으로 인기있는 기기나 빠르게 성장 중인 부문을 대표할 수 있도록 했습니다. 또한, 이런 레퍼런스 기기를 사용해 인기있는 중단점과 새로운 WindowSizeClass 중단점의 조합 전반에 걸쳐 앱이 작동하도록 함으로써 앱이 최대한 많은 사용 사례를 포괄하도록 할 수도 있습니다.
Reference Device 정의
레이아웃 유효성 검사
대화면에 맞춰 UI를 조정하는 작업을 어디서부터 시작해야 할지 잘 모를 경우, 가장 먼저 할 수 있는 일은 새로운 도구를 사용하여 대화면 기기에 영향을 미치는 잠재적인 문제를 식별하는 것입니다. Android Studio Chipmunk에서, 저희는 영향을 받는 레퍼런스 기기를 포함하여 Layout Validation에서 UI 경고와 추천 사항을 사전에 표시하기 위한 새로운 시각적 린팅 작업 도구를 개발하고 있습니다.
레퍼런스 기기 클래스가 있는 레이아웃 유효성 검사 도구
크기 조정 가능한 에뮬레이터
Android Studio Chipmunk와 함께 제공되는 크기 조정 가능한 새로운 에뮬레이터 구성을 사용하여 런타임에서 앱을 테스트할 수 있습니다. 크기 조정 가능한 에뮬레이터를 사용하면 네 가지 레퍼런스 기기, 즉 스마트폰, 폴더블, 태블릿, 데스크톱 간에 빠르게 전환할 수 있습니다. 따라서 동일한 레퍼런스 기기를 사용하여 더 쉽게 디자인 타임에 레이아웃의 유효성을 검사하고 런타임에서 동작을 테스트할 수 있습니다. 새로운 크기 조정 가능 에뮬레이터를 생성하려면 Android Studio의 Device Manager를 사용하여 새 가상 기기를 만들고 Android 12L(Sv2) 시스템 이미지로 크기 조정 가능 기기 정의를 선택하세요.
크기 조정 가능한 Android 에뮬레이터
대화면에 대한 Google Play 변경 사항
태블릿, 폴더블 및 ChromeOS 기기에서 최상의 앱 환경을 사람들이 더 쉽게 찾을 수 있도록, Google Play에서 기기에 최적화된 앱을 강조 표시하는 변경 작업이 진행 중입니다.
해당 기기에서 가능한 최상의 앱이 확실히 표시되도록, 대화면 앱 품질 지침에 비추어 각 앱의 품질을 평가하는 새로운 검사를 추가할 예정입니다. 대화면에 최적화되지 않은 앱의 경우, 앱의 Play 스토어 목록 페이지에 고지를 띄워서 대화면 기기 사용자에게 안내할 것입니다.
또한, 2021년 초에 발표한 것처럼 대화면에 관한 앱 평점도 도입할 예정이며, 이를 통해 사용자가 대화면 기기에서 앱이 어떻게 작동하는지 평가할 수 있게 됩니다. 이러한 변화는 2022년에 있을 예정이므로 개발자 여러분이 앱을 그에 맞춰 준비할 수 있도록 알려드립니다!
또한 Google Play에서 개발자 요구사항을 지원하기 위한 비즈니스 모델의 진화를 잘 보여주는 게시물도 확인해보세요.
자세히 알아보세요!
대화면과 폴더블을 위한 빌드를 시작하는 데 있어 Views를 사용하든, Compose를 사용하든 상관없이 모두에게 도움이 됩니다! 새로운 앱과 기존 앱 모두에서 다양한 화면 크기를 지원하는 방법, Views와 Compose 모두에 대한 탐색을 구현하는 방법, 폴더블 기기를 활용하는 방법 등 업데이트된 신규 지침을 발표합니다. Views 지원에 대한 대화면 가이드 섹션이나 Compose 가이드 섹션에서 확인해 보세요.
코드보다 더 확실한 설명은 없기에, 반응형 UI를 지원하고자 다음 샘플을 업데이트했습니다.
실습 작업에 대해서는 업데이트된 Codelab Jetpack WindowManager로 폴더블 및 듀얼 화면 기기 지원을 확인하세요.
