타일 및 알림 시각적 자산(Windows 런타임 앱)

이 항목에서는 타일 및 알림에 사용되는 이미지 파일 자산에 대한 크기 요구 사항에 대해 설명합니다.

일반 이미지 요구 사항

타일 및 알림 원본 이미지는 크기가 1024x1024 픽셀보다 작거나 같고, 파일 크기가 200KB보다 작거나 같고, .png, .jpg, .jpeg 또는 .gif 형식이어야 합니다. 이미지가 다른 요구 사항을 충족한다면 비트 수준 또는 색 요구 사항은 없습니다.

정방형 타일 및 큰 타일

타일은 시작 화면에 표시되고 크거나(100% 배율로 310x150 픽셀) 정방형일 수 있습니다. 다음과 같은 여러 가지 크기의 타일이 있습니다.

  • 소형(70x70)(Windows에만 해당)
  • 소형(71x71)(Windows Phone에만 해당)
  • 중형(150x150)
  • 와이드(310x150)
  • 대형(310x310)(Windows에만 해당)

사용자는 앱의 매니페스트 파일(package.appxmanifest)에서 로고 이미지용으로 제공된 크기로만 타일의 크기를 조정할 수 있습니다. 최소한 중형 타일 로고가 필요합니다. 다른 타일을 제공하지 않으면 앱 타일은 항상 중형(150x150)이 되며 앱 타일 알림에 있는 중형 타일 템플릿의 페이로드만 표시됩니다. 일부 시나리오에서는 이 정도면 충분할 수 있습니다.

매니페스트에 여러 로고 이미지가 제공된 경우 타일을 시작 화면에 고정할 때 사용할 기본값으로 중형 또는 큰 타일을 지정할 수 있습니다.

참고   Windows Phone 스토어 앱에는 이 옵션이 없습니다. 타일은 항상 중간 크기로 시작 화면에 고정되지만 사용자가 이 크기를 조정할 수 있습니다.

사용자가 언제든 타일의 크기를 변경할 수 있고, 프로그래밍 방식으로는 현재 사용 중인 크기를 알 수 없으며, 현재 크기와 일치하는 알림만 표시됩니다. 따라서 앱에 전송되는 각 타일 알림은 지원되는 각 크기에 맞는 하나의 템플릿을 포함해야 합니다. 예를 들어, 알림에 큰 템플릿만 포함되어 있는 경우 사용자가 중형 타일을 표시하도록 선택하면, 알림이 만기되기 전에 사용자가 크기를 크게 조정하지 않는 한 알림이 표시되지 않습니다.

타일 모양 선택

  • 앱에서 알림을 사용하여 타일에 업데이트를 보내지 않는 경우 정적 타일에 중형 타일을 사용합니다.
  • 앱에서 짧은 요약 알림을 포함하는 시나리오만 지원하는 경우 중간 크기 타일과 배지를 함께 사용합니다. 예를 들어 수신한 새 메시지의 개수만 표시하는 SMS(Short Message Service) 앱 타일이 있습니다.
  • 앱에서 흥미 있는 새로운 콘텐츠를 사용자에게 표시해야 하고 콘텐츠를 제공하는 알림을 자주(매주 한 번 이상) 보내는 경우에만 큰 타일 또는 대형 타일을 사용합니다. 큰 타일과 대형 타일 콘텐츠는 최신 상태로 "유지"되어야 합니다. 따라서 추가 공간을 확보해야 합니다.

기타 시각적 자산

  • 극소형(30x30)(Windows에만 해당)
  • 극소형(44x44)(Windows Phone에만 해당)

극소형 자산 및 소형 자산은 라이브 타일이 아니므로 앱의 매니페스트에 지정된 대로 타일의 로고만 표시합니다. 소형 타일은 시작 화면에서 사용하지만 극소형 타일은 검색 결과와 목록에서만 사용합니다.

Windows 런타임 앱에서 이미지 크기를 조정하는 방법

Windows 장치의 시작 화면에서는 이미지 크기에 영향을 주는 네 가지 크기 조정 값(80%, 100%, 140% 및 180%)을 지원합니다. Windows Phone 스토어 앱은 매니페스트를 통해 100%, 140% 및 240%를 지원하지만 실제로는 120%, 160%, 180%, 200%, 220%, 300% 및 400%도 지원합니다.

각 크기 조정 값에 맞는 개별 이미지 자산을 제공하거나 해당 이미지의 하위 집합만 제공하여 시스템이 가장 근접한 이미지의 크기를 적합하게 조정하도록 할 수 있습니다. 다양한 장치에서 타일을 표시할 수 있으므로, 시스템에서 장치와 해당 설정에 가장 적합한 버전을 선택할 수 있도록 앱 패키지에 크기가 조정된 이미지 버전을 포함하는 것이 좋습니다. 최상의 결과를 제공하지는 않지만 이미지 자산을 하나만 제공하고 크기 조정을 사용하려면, Windows의 경우 180% 자산을 제공하고 Windows Phone 스토어 앱의 경우 240% 자산을 제공하세요.

매니페스트를 통해 제공된 로고 이미지에는 요청하는 정확한 픽셀 치수가 있어야 합니다. 타일 또는 알림 메시지에 제공된 이미지가 위의 일반 요구 사항을 만족하는 한, 이 이미지에는 이 요구 사항이 적용되지 않습니다. 이미지가 알림 이미지 영역의 크기에 맞지 않으면 시스템이 크기를 조정하여 적절하게 잘라냅니다.

이미지 자산을 명명하고 구성하는 데 대한 자세한 내용은 앱 리소스 정의를 참조하세요.

Windows Phone 스토어 앱의 크기 조정, 안쪽 여백, 배율 및 투명도에 대한 세부 정보:  

앞에서 설명한 대로 Windows Phone 스토어 앱의 경우 scale-240 이상의 자산을 제공합니다. scale-140 및 scale-100 자산을 제공해도 됩니다.

이미지 파일 자산 자체는 배경이 투명해야 합니다(아래 그림의 체크판 효과). 이 그림은 배경 아래에 표시되는 색상에 대해서도 알려 줍니다. 앱 매니페스트에서 해당 속성 값을 "Assets\<assetname>.png"로 설정하고 VisualElements@BackgroundColor 값을 설정합니다. 앱의 브랜드 배경색을 사용하거나 배경색을 "투명"으로 설정하여 기본 제공 앱의 모양과 일치시킵니다.

앱 매니페스트의 속성 이름<assetname>.scale-100.png<assetname>.scale-140.png<assetname>.scale-240.png

Square71x71Logo

(시작 화면 소형 타일)

자산 71x71 px

안쪽 여백 19,19px

로고 32x32 px

자산 99x99 px

안쪽 여백 27,27px

로고 45x45 px

자산 170x170 px

안쪽 여백 46,46px

로고 77x77 px

Square150x150Logo

(시작 화면 중형 타일)

자산 150x150 px

안쪽 여백 45,45px

로고 60x60 px

자산 210x210 px

안쪽 여백 63,63px

로고 84x84 px

자산 360x360 px

안쪽 여백 108,108px

로고 144x144 px

Wide310x150Logo

(시작 화면 와이드 타일)

자산 310x150 px

안쪽 여백 125,45px

로고 60x60 px

자산 434x210 px

안쪽 여백 175,63px

로고 84x84 px

자산 744x360 px

안쪽 여백 300,108px

로고 144x144 px

Square44x44Logo

("모든 앱" 목록)

자산 44x44 px

안쪽 여백 6,6px

로고 32x32 px

자산 62x62 px

안쪽 여백 9,9px

로고 44x44 px

자산 106x106 px

안쪽 여백 15,15px

로고 76x76 px

패키지/속성/로고

자산 50x50 px

안쪽 여백 9,9px

로고 32x32 px

자산 70x70 px

안쪽 여백 12,12px

로고 46x46 px

자산 120x120 px

안쪽 여백 20,20px

로고 80x80 px

 

관련 항목

응용 프로그램 리소스 및 지역화 샘플(영문)
글로벌 마켓에 맞는 디자인
타일 템플릿 카탈로그
타일에 대한 지침 및 검사 목록
빠른 시작: Microsoft Visual Studio 매니페스트 편집기를 사용하여 기본 타일 만들기
빠른 시작: 타일 업데이트 보내기
타일 XML 스키마
앱 타일 및 배지 샘플
타일 및 타일 알림 개요
앱 이미지 선택
앱 리소스 정의

 

 

표시:
© 2015 Microsoft