Notice»

Recent Post»

Recent Comment»

Recent Trackback»

Archive»

« 2024/4 »
1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30

1. 타일(Tile)

타일은 시작화면에 표시되는 앱의 얼굴이며 사용자가 앱을 실행 할 수 있는 시작 점이다. 타 모바일 플랫폼의 아이콘에는 배지라고 하는 숫자 정도만 표시 가능한 것에 비해 윈도우8의 타일에는 숫자 뿐 아니라 앱의 상태나 이미지, 텍스트 등의 정보를 사용자에게 서비스 할 수 있어 라이브 타일이라고 표현한다. 앱의 컨텐츠에 따라 타일을 여러 개 추가해서 정보를 실시간 표시하고 해당 페이지로 직접 실행할 수도 있다.

일의 크기별 종류에는 정사각형(Squre)과 와이드(Wide)가 있다. 앱에서 정사각형 타일은 기본으로 포함되어야 하며 와이드 타일은 옵션사항이다. 두 가지 타일 모두 라이브로 업데이트가 가능하다. 타일의 적용 가능한 이미지와 사이즈는 따로 정리하도록 하겠다.

 

 

 

 

 

<그림1> 정사각형

 <그림2> 와이드

 

< 1> 타일의 구성요소

요소

설명

이름(Name)

타일의 왼쪽 아래에 표시되며 그림 1와 같이 표시된다. 기본 타일(default tile)에는 앱 이름만 표시 할 수 있다. 길이는 13자 이하를 권장하고 있으며 이름이 길경우는 줄임 표시된다.

로고(Logo)

타일의 왼쪽 아래에 표시되며 그림 2와 같이 표시된다. 앱 실행 중에 앱 이름 또는 로고를 선택해서 표시 할 수 있다.

배지(Badge)

타일의 오른쪽 아래에 표시되며 그림 1과 같이 숫자(Numeric)를 표시하거나 그림 2와 같이 시스템에 미리 정해진 문자(Glyph)를 선택해서 표시할 수 있다.

텍스트와 이미지

템플릿 종류에 따라 여러 개의 텍스트와 이미지가 사용될 수 있다.

 

그림 1은 기본 타일에 숫자 배지가 표시되었으며 그림 2는 템플릿을 이용해서 이미지와 텍스트를 표시하고 왼쪽 아래에 로고, 오른쪽 아래에 문자 배지를 표시했다. 윈도우의 설정에 따라 배지의 위치가 왼쪽에 표시 될 수 있다.

 

1.1 기본 타일(default tile) 설정

앱에 기본으로 포함되는 타일 설정은 앱 매니페스트(package.appxmanifest) 파일의 Application UI 탭에서 한다. 기본 타일은 첫 번째 타일 알림을 통해 타일이 업데이트될 때까지 표시되며 표시할 알림이 없을 때마다 기본 타일이 표시된다.

 

  

 

 <그림3> 앱 매니페스트 파일의 기본 타일 설정

 

< 2> 기본 타일 설정

속성

설명

Logo

정사각형 기본 타일 이미지

Wide logo

와이드 기본 타일 이미지

Small logo

검색 및 앱 전체목록, 시작화면의 시멘틱 줌 상태에서 보이는 작은 이미지 등에 사용되며 타일의 왼쪽 아래에 표시되는 로고에서도 사용된다.

Short name

타일의 왼쪽 아래에 앱의 이름을 표시 할 수 있으나 앱의 이름이 길 경우는 짧은 이름을 명시하여 보여줄 수 있다.

Show name

기본 타일에 앱의 이름을 표시할 수 있는 설정이며 정사각형 또는 와이드 일때만 표시하거나 두 가지 모두에 표시 유무를 선택할 수 있다.

Foreground text

타일에 보여지는 앱 이름의 색상을 정하는 것으로 Dark Light를 선택할 수 있다.

Background color

타일의 배경색을 지정해 주는 것으로 타일 위의 로고나 이미지와 어울리는 색을 W3DC 색 문자열(:”#FFFFFF”)로 입력 한다. 배경색은 앱의 모든 대화 상자의 버튼 색과 윈도우 스토어의 앱 설명 페이지에도 반영되므로 다른 앱과의 차별화 요소로 쓰인다.

 

위 설정에서 Logo Small Logo는 필수 사항이고 Wide Logo는 선택사항이다. Wide Logo를 지정해야 와이드 타일을 시작화면에 표시할 수 있고 라이브로 업데이트가 가능하다. 또한 윈도우 스토어에서 앱을 설치 시 기본으로 와이드 타일이 보이고 사용자의 선택에 의해 정사각형 타일로 변경할 수 있는 기능들이 제공된다.

--------------------------------------------------------------------------------------------------------------

로고에 대한 추가 설명

기본 타일에서 로고라는 표현이 여러 곳에서 사용되는데 앱을 대표하는 브랜드로써 기존 윈도우에서 사용되던 아이콘과 같이 앱을 대표하는 이미지라는 표현으로 쓰인다. 프로젝트 설정에서 Logo, Wide logo가 각각 정사각형, 와이드 기본 타일에 사용되는 이미지 이다. 그리고 타일의 왼쪽 아래에 표시할 수 있는 로고에 Small logo 이미지가 표시된다. 기본 타일 외에 타일의 설명에서 나오는 로고는 대부분 왼쪽 아래에 표시되는 로고를 말한다.

--------------------------------------------------------------------------------------------------------------

 

 

: