Google for Developers Korea Blog: 태블릿용 앱 디자인 도움말

Google for Developers Korea Blog

한국의 개발자들을 위한 Google for Developers 국문 블로그입니다.

태블릿용 앱 디자인 도움말

2013년 1월 17일 목요일

작성자: Roman Nurik
작성일: 2012년 11월 26일
원문: http://android-developers.blogspot.hk/2012/11/designing-for-tablets-were-here-to-help.html

Google Play에 아주 괜찮은 안드로이드폰 앱을 출시했고, 사용자 반응이 아주 좋습니다. 이제 뒷짐 지고 치솟는 다운로드수를 감상하고 계시군요. 축하합니다! 하지만 여느 진취적인 개발자처럼, 여러분도 “어떻게 하면 내 앱이 더 큰 성공을 거둘 수 있을까? 라고 고민하실 것입니다. 해결책은 바로, ‘동일하게 훌륭한 사용자 경험을 제공하는 태블릿용 앱을 만들라!’는 것입니다.

사용자들은 태블릿용 앱을 좋아합니다. 예를 들어 Mint.com은 넓은 화면 공간을 제공하는 태블릿이 휴대폰보다 7배 가량 더 많은 예산 데이터를 활용하게 만든다는 사실을 파악했습니다. 그리고 TinyCo는 평균적으로 사용자가 휴대폰보다 태블릿에서 35% 더 많은 지출을 한다는 것을 알아냈습니다. 따라서 지금이야말로 더욱 포괄적이고 일상적인 컴퓨터 사용에 대한 소비자들의 욕구를 만족시키기 위하여, 대형 화면 디바이스로 옮겨가기 위한 전략을 세우기에 적절한 시기입니다.

본 포스팅에서는 사용자에게 훌륭한 태블릿 경험을 제공하는 앱을 만들기 위해 활용할 수 있는 일부 리소스에 대해서 설명 드리겠습니다. 이는 상품 관리자, 디자이너, 개발자, QA 엔지니어에 이르기까지 앱 개발 단계에 있는 모든 사람에게 유용한 정보입니다. 안드로이드 디자인 가이드라인

안드로이드 앱 디자인이나 개발에 대한 내용을 다루기 위해서는, 먼저 안드로이드 디자인 가이드라인을 참고해야 합니다. 대부분 섹션에서 안드로이드 디바이스 전체와 관련된 사항을 다루지만, 어떤 섹션에서는 특히 태블릿 디자인과 관련된 내용을 주로 다루고 있습니다.

디바이스와 디스플레이(Devices and Displays) 페이지에서는 밀도 독립성에 대한 개념을 소개합니다. 예를 들어 넥서스 4, 넥서스 7, 모토로라 XOOM 모두 비슷한 픽셀 해상도를 가지고 있지만 (각각 1280x768, 1280x800, 1280x800) 화면 크기는 매우 다릅니다. 픽셀 대신, dip(density-independent pixels)로 생각해 봅시다. dip의 경우, 넥서스 4(640x384 dp)와 넥서스 7(960x600dp), 넥서스 10 혹은 모토로라 XOOM(1280x800 dp)의 차이를 이해하기 쉬워집니다.

매트릭스와 그리드(Metrics and Grids)에서 논의된 48dp 리듬을 따르면 (특히 태블릿용에서) 크기 요소를 어림 짐작하지 않아도 됩니다. 미심쩍은 경우에는 가로 및 세로 크기 엘리먼트로 48dp (혹은 16dp finer grid) 배수를 사용하세요. 예를 들어, 큰 화면에서 띄엄 띄엄 콘텐츠를 보여줄 때, 96dp 혹은 144dp로 넉넉한 사이드 여백을 사용하세요. 혹은 10인치 태블릿의 마스터/디테일 레이아웃에서 마스터 창의 너비를 결정할 때, 240dp 혹은 288dp 폭으로 마스터 콘텐츠가 어떻게 보이고 어떤 느낌을 주는지 확인하세요.

멀티창 레이아웃(Multi-pane Layouts) 가이드에서는 앱 방향 탐색을 개선하는 동시에 사용 가능한 화면 공간을 최적화하기 위해 연관된 뷰를 단일 화면으로 결합시키는 용례와 예제를 다룹니다. 또한 모든 방향에서 동일한 기능을 유지하면서 가로 및 세로로 콘텐츠를 배열하기 위한 전략도 다룹니다. 사용자가 가로와 세로 방향을 모두 즐겨 사용하기 때문에 휴대폰용 앱 개발보다 방향 전환에 더욱 적절하게 대응해야 합니다.

다운로드 가능한 스텐실(Downloadable Stencils)에서는 레퍼런스 디바이스 초안 및 정확한 사이즈의 액션바 등을 갖추어 디자이너들에게 최고의 모형을 위한 출발점을 제공합니다. 개발자를 위한 안드로이드 교육

개발자 사이트의 교육 섹션에서는 과제 기반의 기술 교육 자료를 제공하며 플로우 다이어그램, 예제 코드, 샘플 프로젝트 등을 갖추고 있습니다. 몇몇 강좌에서는 개발자에게 모든 화면 사이즈에 앱 크기를 조정하는 방법을 제공하고 있습니다.

앱 개발 프로세스의 초기 디자인 과정에 더욱 초점을 맞춘 ‘효과적인 방향 탐색 디자인 강좌(Designing Effective Navigation)’는 효과적으로 태블릿에서 화면을 구성하고 그룹화하는 방법을 제공하며, 이러한 방법으로 간단한 뉴스 읽기 애플리케이션을 위한 와이어 프레임 예제도 보여줍니다.

화면 분할로 다이나믹 UI 만들기(Building a Dynamic UI with Fragments)와 다중 화면을 위한 디자인(Designing for Multiple Screens) 강좌에서는 안드로이드 리소스 프레임워크와 결합하여 어떻게 화면 분할을 사용하는지 보여줍니다. 강좌를 통해서 리소스 alias를 활용하여 코드 재활용을 최대화하고 애플리케이션 크기를 최소화하면서 런타임 시 태블릿과 휴대폰 레이아웃 사이에서 쉽게 선택하는 방법을 보여줍니다. 또한 현재 레이아웃에 기반하여 UI 플로우를 조정하는 기술을 보여줍니다.

마지막으로, 엄밀히 말하면 교육 강좌는 아니지만, 태블릿 및 휴대폰 지원하기(Supporting Tablets and Handsets) 문서에서는 주요 우수 사례에 대한 정보를 제공합니다. 텍스트는 건너뛰고 바로 코딩 작업을 시작하고 싶으다면, 이클립스용 안드로이드 개발자 툴을 사용하여 클릭 몇 번으로 여러분의 앱에 휴대폰 및 태블릿 지원을 갖춘 마스터/디테일 플로우를 추가할 수 있습니다.

안드로이드 다지인 인 액션 하이라이트

Developer Relations 팀에서 함께 모여 안드로이드 디자인 우수 사례에 대해 토론하기 위해 매주 Android Design in Action 라이브 쇼를 진행합니다. 또한 안드로이드 앱의 형태나 느낌을 설명하기 위해서 오리지널 ‘재설계’ 모형을 제공합니다. 최근 에피소드에서는 반응형 디자인(responsive design), 즉 어떤 화면 사이즈나 폼팩터에서도 실행될 수 있도록 구성할 수 있는 유연한 앱 디자인에 초점을 맞췄습니다.

해당 에피소드에서는 Google 캘린더에서 캘린더 이벤트를 만드는 것에서부터, Pattrn 및 Pocket에서 월페이퍼와 스토리를 둘러보고 TED에서 동영상을 보며 오픈 소스 Google I/O 2012 앱에서 컨퍼런스 스케줄을 관리하는 것에 이르기까지 안드로이드에서 실행되는 성공적인 반응형 디자인 예제를 소개하였습니다. 또한 주기적으로 태블릿 디자인 컨셉을 선보이고 있으니, 디자인 아이디어를 얻으시려면 매주 라이브 쇼를 시청해주세요.

태블릿 앱에 대한 더욱 많은 아이디어를 원하시면, 다음의 앱들을 확인해 보세요.
Expedia Hotels & Flights, Pulse News, SeriesGuide, Tasks, Timer

태블릿 품질 체크리스트

developer.android.com에서 “배포(Distribute)” 섹션에서 최근에 공개된 태블릿 앱 품질 체크리스트를 통해서 본인의 앱이 태블릿용으로 적절한지 다양한 기술 측면에서 확인할 수 있습니다. 해당 체크리스트는 Google Play 팀에서 직원이 선정한 태블릿용 컬렉션에 추천 앱으로 선정되는 방법 중에 하나입니다. 따라서 해당 체크리스트에 정의된 기준을 모바일 상품에 관련된 모든 사람이 숙지하도록 해야 합니다.

지금 바로 시작하세요!

2013년은 안드로이드 태블릿을 위한 또 다른 흥미로운 해가 될 것 같습니다. 본 포스팅과 developer.android.com에서 다루었던 우수 사례 및 예제를 참고하여 진화하는 디바이스 환경에서 여러분의 앱이 성공적으로 자리매김할 수 있도록 만들어 보세요! 본인의 앱에 대해서 구체적인 질문이 있으면 구글플러스(+Android Developers)나 트위터(@AndroidDev)로 문의하세요!

Contents

ML/Tensorflow
Android
Flutter
Web/Chrome
Cloud
Google Play
Community
Game
Firebase

검색

Tag

Archive

2025
- 1월

2024
- 12월
- 11월
- 10월
- 9월
- 8월
- 7월
- 6월
- 5월
- 4월
- 3월
- 2월
- 1월

2023
- 12월
- 11월
- 10월
- 9월
- 8월
- 7월
- 6월
- 5월
- 4월
- 3월
- 2월
- 1월

2022
- 12월
- 11월
- 10월
- 9월
- 8월
- 7월
- 6월
- 5월
- 4월
- 3월
- 2월
- 1월

2021
- 12월
- 11월
- 10월
- 9월
- 8월
- 7월
- 6월
- 5월
- 4월
- 3월
- 2월
- 1월

2020
- 12월
- 11월
- 10월
- 9월
- 8월
- 7월
- 6월
- 5월
- 4월
- 3월
- 2월
- 1월

2019
- 12월
- 11월
- 10월
- 9월
- 8월
- 7월
- 6월
- 5월
- 4월
- 3월
- 2월
- 1월

2018
- 12월
- 11월
- 10월
- 9월
- 8월
- 7월
- 6월
- 5월
- 4월
- 3월
- 2월
- 1월

2017
- 12월
- 11월
- 10월
- 9월
- 8월
- 7월
- 6월
- 5월
- 4월
- 3월
- 2월
- 1월

2016
- 12월
- 11월
- 10월
- 9월
- 8월
- 7월
- 6월
- 5월
- 4월
- 3월
- 2월
- 1월

2015
- 12월
- 11월
- 10월
- 9월
- 8월
- 7월
- 6월
- 5월
- 4월
- 3월
- 2월
- 1월

2014
- 12월
- 11월
- 10월
- 9월
- 8월
- 7월
- 6월
- 5월
- 4월
- 3월
- 2월
- 1월

2013
- 12월
- 11월
- 10월
- 9월
- 8월
- 7월
- 6월
- 5월
- 4월
- 3월
- 2월
- 1월

2012
- 12월
- 11월
- 10월
- 9월
- 8월
- 7월
- 6월
- 5월
- 3월
- 2월
- 1월

2011
- 12월
- 11월

Feed

Google
Privacy
Terms