에버랜드리조트 Guideline for Android (480x800) 2013.2.26 Updated

에버랜드리조트Guideline for Android (480x800)2013.2.26 Updated

2

No. Date Version File Name List

1 2013.02.20 V1.0 Everland_guide_android_130220_v1.0 - 문서 발행

2 2013.02.26 V1.1 Everland_guide_android_130225_v1.1 - 지도 / 시설목록리스트 , 필터링 , 검색 , 갤러리 페이지 추가

3 2013.02.26 V1.2 Everland_guide_android_130225_v1.2

- 전반적으로 커팅 이미지 480 기준으로 잘못 커팅한 이미지 -> 720 기준 으로 다시 커팅 , 이미지 폴더 전체 덮어써주세요 !!- UI 간격 조절 , 지금 하고 계시는 게이트 관련 페이지는 수정이 없고 금일 수정된 부분은 아직 진행하지 지도 리스트부터 수정이 있었습니다 . 참고하세요 ~

Document History 에버랜드 Guideline for Android

SPLASH

3

BG 이미지 사이즈는 가로 기준으로 세로 사이즈를 가변으로 삽입

가로기준 : 720(720x1280) 고해상도 , 480(480x853) 최적화 사이즈Crop 은 TOP 기준 , 하단의 이미지가 남는 방식 .

img_intro_logo.png160 x 178align : center

img_intro_copyright.png160 x 18 align : center

bg_intro.jpg(Center, Top)

158

36

80 80

178

에버랜드 Guideline for Android

COVER

4

bg_cover_basic.jpg(0, 0)

bg_cover_season_1.jpg(0, 0)

cover_season_1 ~ 8cover_basic


BG 이미지 사이즈는 가로 기준으로 세로 사이즈를 가변으로 삽입

가로기준 : 720(720x1280) 고해상도 , 480(480x853) 최적화 사이즈Crop 은 TOP 기준 , 하단의 이미지가 남는 방식 .

Cover Image AreaFill parent x Fill parent (Center, Top)

gate-event

5


44

48

20

34

btn_gate_home /_press.png54 x 44 align : Left, Top

기본 : 나눔고딕볼드 / 18dp / center, middle / FFFFFF 밝기 : 나눔고딕볼드 / 18dp / center, middle 기준 위로 1px / db5400

btn_gate_close /_press.png54 x 44 align : Right, Top

Event Img AreaFill parent x Fill parent (Center, Top)가로 기준으로 세로 사이즈를 가변으로 삽입

bg_title_shadow.png320 x 2

btn_event_arrow_left /_press.png42 x 40 (Left 12, Middle)

btn_event_arrow_right /_press.png42 x 40 (Right 12, Middle)

Event Img 높이기준으로 Middle 정렬

btn_event_go.9.png320 x 34 (Center, Middle)

bg_event_status.png320 x 20 (Center, Middle)

img_event_status_off.png8 x 8 (Center, Middle)

6

6

4

title_bg.png320x 44 (Center, Top)

54 54

YY

XX

btn_event_go_press.9.png320 x 34 (Center, Middle)

img_event_status_on.png8 x 8 (Center, Middle)

off on

2

title_bg_shadow.png320x 2 (Center, Top)

gate-event

6

btn_gate_event.9.png80 x 48

btn_gate_news.9.png80 x 48

btn_gate_benefit.9.png80 x 48

btn_gate_coupon.9.png80 x 48

btn_gate_event_hightlight.9.png80 x 54

btn_gate_news_hightlight.9.png80 x 54

btn_gate_benefit_hightlight.9.png80 x 54

btn_gate_coupon_hightlight.9.png80 x 54


44

48

20

34

54 54

YY

XX2

gate- 뉴스 & 공지

7

img_list_arrow.png44 x 44




44

48

2

64

10

10

10

44

18

8

Font : NanumGothic (Bold)10dp / Color : 999999Align : Left, Top

Font : NanumGothic (Bold)14dp / Color : 333333Align : Left, Top

img_list_line.9.png13x 2

2

10 XX 44

bg_colorDefault : FAF7F0, Press : F2EFE6

16

14

8

20

gate- 뉴스 & 공지

8

btn_back.png btn_back_press.png44 x 44 (Left 0)

2

20

10 XX 10

20

Font : NanumGothic (Bold)15dp / Color : 333333Align: Left, Top

img_bold_line.9.png10 x 2

ScrollArea

통이미지 )

bg color F2EFE6


10 10

48

36

44

img_textbox.9.png

Scroll Area 통이미지 영역 - img_textbox.png 의 가운데 영역이 컨텐츠 높이만큼늘어난다 .10 10

10

10

컨텐츠영역

10

bg_bottom_bar.png320 x 48Center, Bottom

btn_direct_go.pngbtn_direct_go_press.png140 x 28Center, Middle

28

10

10

140

Gate- 우대정보

9


44

48

2

114

10



44

16

Font : NanumGothic (Bold) 10dpColor : FF7300, Color : 008DE7Align : Left, Top

Font : NanumGothic (Bold) 14dp Color : 333333Align : Left, Top

2

XX 44


104

1488

16

16

16

10 20

Font : NanumGothic (Bold) 10dp Color : 999999Align : Left, Top


img_list_line.9.png10 x 2

gate- 우대정보 에버랜드 Guideline for Android

ScrollArea

통이미지 )

10

48

44

10

bg color F2EFE6

10


img_textbox.9.png


10

10

컨텐츠영역


btn_direct_go.pngbtn_direct_go_press.png140 x 28Center, Middle

28

10

10

140

Gate- 쿠폰행사

11


44

48

2

64

10




10

10

44

16

Font : NanumGothic (Bold)14dp / Color : 333333Align: Left

img_list_line.9.png10 x 2

2

10 XX 44


16

32

20

Gate- 쿠폰행사

12

img_coupon_small.png74 x 48


ScrollArea

통이미지 )

bg color F2EFE6

10 10

48

img_textbox.9.png


10

10

컨텐츠영역

btn_coupon_down.pngbtn_coupon_down_press.png140 x 28Center, Middle

2

14

10 XX 10

14

Font : NanumGothic (Bold)15dp / Color : 333333Align: Left, 쿠폰 Center 기준 Middle


48


Center 기준

74 10


28

10

10

140

10

Gate- 쿠폰행사

13


10 10

bg color F2EFE6

10 14

10

16

2

16

8

8

16

14 10

10

28

Font : NanumGothic (Bold)14dp / Color : 9C4C16Align: Left, Top

img_table_line.9.png,쿠폰번호 밑에도 들어감10x 2, Center, left, right padding 각각24

Font : NanumGothic (Bold)12dpColor : F6301, 333333Align: Left, Top


Font : NanumGothic (Bold)14dp / Color : FF6301Align: Left, Top

img_line_arrow.9.png16 x10, Center

img_qr.png158 x158, Center

icon_coupon.png60 x 36, Left, Top

img_textbox.9.png

28

10 1414

Scrollarea)

44

XX

Gate- 설문

14

10

10 10

10



66

icon_poll.png66 x 56

10

10

14

16

8 10

2

14

Font : NanumGothic (Bold)14dp / Color : 9C4C16Align: Left, Top

Font : Nanum Gothic (Bold)14dp Color : 333333Align: Left, Top


16

img_table_line.9.png,쿠폰번호 밑에도 들어감10x 2, Center, left, right padding 각각24 img_textbox.9.png


10 10

bg color F2EFE6

Scrollarea)

10

44

56

10 XX

1414

XX

bg_bottom_bar.png320 x 48 Center, Bottom

btn_poll_start / _press.png140 x 28 Center, Middle

10

10

28

140

Gate- 설문

15

10

14

44

246 44

8

Font : NanumGothic (Bold)14dp / Color : 805D46Align: Left, Middle

Font : NanumGothic (Bold)14dp / Color : FE4F13Align: Left, Middle

img_poll_article.9.png44 x 44 Center, Top

btn_poll_off.png44 x 44Right, Top

btn_poll_on.png44 x 44Right, Top


10 10

bg color F2EFE6

Scrollarea)

10

44

10

20

36

20

XX



10

44

15

15

Gate- 설문

btn_poll_next / press.png60 x 28Right, Middle


Font : Helvetica (Bold)20pt / Color : FF6301Align: Center, Middle

Font : Helvetica (Bold)20pt / Color : A6A19DAlign: Center, Middle


10 10

bg color F2EFE6

10

44

44

btn_poll_end / _press.png140 x 28 Center, Middle

10

10

28

10


10

10

28

140

16

에버랜드 Guideline for AndroidList- 지도

44

56

44

XX94 94 56

4

4

XX

btn_list_mymenu / _press.png56 x 44Left, Top

btn_list_event / _press.png56 x 44Right, Top

btn_list_map / _hightlight.png94 x 36Center, Top

btn_list_table / _hightlight.png94 x 36Center, Top

816

4XX

16 16 8

1

816

832

68

86 78

50

18

78 78

btn_list_home / _press.png86 x 68Left, Top

btn_list_course / _press.9.png78x 50Left, Top

btn_list_search / _press.9.png78 x 50Left, Top

btn_list_qr / _press.9.png78 x 50Left, Top

Font : Nanum Gothic (Bold)12dp, Color : 333333Align: Left, Top

img_list_alarm.png16 x 16Left, Top

btn_list_xclose_small / _press.png16 x 16Right, Top

36

17

divider304 x 1Color : e0e0e0Center, Middle


68


44

18

btn_pin_attraction / press.png38 x 44

btn_pin_entertain / _press.png38 x 44

btn_pin_zoo / _press.png38 x 44

btn_pin_rest / _press.png38 x 44

btn_pin_comforts / _press.png38 x 44

btn_pin_info / _press.png38 x 44

img_map_mission.png56 x 26

img_map_coupon.png56 x 26

img_map_mylocation.png24 x 24

img_map_locationcircle.png82 x 82

btn_map_facility / _press.png44 x 44, (Right 4, Bottom)

btn_map_mylocation / _highlight.png44 x 44, (Right 4, Bottom 4)

4

4

4

68

어트랙션 동물원 편의시설

엔터테인먼트 레스토랑 /선물샵 이용정보

19


44 44

30

36

4 3636

4

36

48

4

img_map_checkinbox.png84x 118

btn_map_facebook_on / off.png36 x 36

btn_map_twitter_on / off.png36 x 36

btn_map_checkin_small / _press.png76 x 36

btn_map_checkinlogo.png44 x 44, (Right 4, Bottom 4)

6850

20


44

2

2

10

8

36

28

28

36

10 6XX 62

XX

10

10

4148 148

54

208

btn_map_detail / _press.png148 x 36, (Center, Bottom 8)

img_list_mission_on / off.png54 x 20img_list_coupon_on / off.png54 x 20

img_map_stop.png62 x 36, (Left, Middle)

btn_map_checkin_large / _press.png148 x 36, (Center, Bottom 8)

img_list_xclose_large /_press.png36 x 36, (Right, Middle)

Divider full x 2Color : C7C4BFCenter, Middle

Divider full x 2Color : 4D4D4DCenter, Middle

4

Font : Nanum Gothic (Bold)16dp, Color : 333333Left, Middle



BG Color : FFFFFF

36

36

21


44

36

2

btn_list_xclose_large /_press.png36 x 36, (Right, Middle)


img_list_course_title.png76 x 20, (Left, Middle)

76 XX

1014

6

26

10 Divider full x 1Color : e0e0e0Center, Middle

99

1

BG Color : FF6301

10 36

36XX

Font : Nanum Gothic (Bold)14dp, Color : FF6301Left, Middle


Font Color : FFFFFFLeft, Middle

22


44img_map_coursepin.png30 x 48 img_map_courseline.9.png

4 x 4

30

48

14

18

Pin_Number18 x 14나눔고딕 16dpColor : FFFFFFCenter, Middle

8

26

36

2

img_list_course_icon /_press.png36 x 36, (Right, Middle)

XX10

XX

2Divider full x 2Color : 4D4D4DCenter, Middle

74

36

36

36

img_list_xclose_large /_press.png36 x 36, (Right, Middle)

2


10

10

20

126

Font : Nanum Gothic(Bold)12dp, Color : 333333Left, Middle

img_list_course_arrow.png18 x 12

btn_list_xclose_large /_press.png36 x 36, (Right, Middle)

Font : Nanum Gothic (Bold)16dp, Color : FF6301Left, Middle

List- 시설목록 에버랜드 Guideline for Android

44

34

92

92

160 160

10

10

10170 38

btn_list_align /_highlight.9.png160 x 34, (Center, Top)

btn_list_facility / _highlight.9.png160 x 34, (Center, Top)

16

6

6

28

16

20

438

112

34

1

38

XX



img_gallery_thumb.9.png 32 x 32

btn_love_on / _off.png38 x 38 (Right, Top)

Divider full x 1Color : C9C2B7Center, Middle

54

img_list_mission_on / off.png54 x 20

img_list_coupon_on / off.png54 x 20

List- 필터링 에버랜드 Guideline for Android

44

title_mypage_bg.png320x 44 (Center, Top)

btn_cancel /_press.png58x 44 align : Left, Top

기본 : 나눔고딕볼드 / 18dp / center, middle / FFFFFF

밝기 : 나눔고딕볼드 / 18dp / center, middle 기준 위로 1px / 0F0D0A

btn_ok /_press.png58 x 44 align : Right, Top

44

58 58

44

50

50

50

50

50

select bg color : F2F2F2

bg color : 2A231D

bg color : 41352C

default bg color : FFFFFF

50btn_arrow_up / _press.png50 x 50, (Right, Top)

btn_arrow_right / _press.png50 x 50, (Right, Top)

btn_arrow_down / _press.png50 x 50, (Right, Top)

XX

어트랙션 : 나눔고딕볼드 / 14dp / left, middle / 333333

키 : 나눔고딕볼드 / 14dp / left, middle / FF6301

테마 , ZONE : 나눔고딕볼드 / 14dp / left, middle / FFFFFF

레스토랑 : 나눔고딕볼드 / 14dp / left, middle / 33333

Divider full x 1Color : E0E0E0

Divider full x 1Color : C1917

1210 12

img_subfilter_on.png12 x 14, (Left, Middle)

img_subfilter_off.png12 x 14, (Left, Middle)

1


44




44 44

44


50

50

5010

btn_poll_off.png44 x 44Right 3, Top 3

btn_poll_on.png44 x 44Right 3, Top 3

XX


1

OFF : 나눔고딕볼드 / 14dp / left, middle / 333333

ON : 나눔고딕볼드 / 14dp / left, middle / FF6301

bg color : 2A231D

default bg color : 000000


44

50

50

5010

btn_poll_off.png44 x 44Right 3, Top 3

btn_poll_on.png44 x 44Right 3, Top 3

XX


1

Divider full x 1Color : C1917

List- 검색 에버랜드 Guideline for Android

btn_filter_close /_press.png58 x 44 align : Right, Top




44

58

44

Divider full x 1Color : C7C5BF

BG COLOR : F2EFE6

XX6 6

img_searchbox.9.png34 x 34 align : Center, Middle

12

img_searchicon.png34 x 34 align : Right, Middle

44

46

126

118

212

img_searchtext.png212 x 118 align : Center, Middle

XX XX

Font : Nanum Gothic (Bold)14dp, Color : 333333Align: Left, Middle

34

6

6

BG COLOR : FFFFFF


46


BG COLOR : F2EFE634

XX6


12



4

btn_cancel /_press.png58 x 44 align : Right, Middle

6

6

Dim BGColor : 00000075% 반투명


46



10


BG COLOR : FFFFFFPRESS COLOR : F2EFE6

XX


BG COLOR : F2EFE634

XX6


12



4

btn_cancel /_press.png58 x 44 align : Right, Middle

6

6

Detail- 갤러리 에버랜드 Guideline for Android

44

96

14



밝기 : 나눔고딕볼드 / 18dp / center, middle 기준 위로 1px / db5400


8

966

966

96

96

8

img_gallery_thumb.9.png 32 x 32

BG COLOR : 000000반투명 85%

Font : Nanum Gothic (Bold)16dp, Color : FFFFFFAlign: Center Middle

34

Detail- 갤러리 에버랜드 Guideline for Android


BG COLOR : 000000반투명 85%

Font : Nanum Gothic (Bold)14dp, Color : FFFFFFAlign: Center, Middle


밝기 : 나눔고딕볼드 / 18dp / center, middle 기준 위로 1px / db5400


이미지 사이즈는 가로 기준으로 세로 사이즈를 가변으로 삽입가로기준 : 720(720x1280) 고해상도 , 480(480x853) 최적화 사이즈Crop 은 TOP 기준 , 하단의 이미지가 남는 방식 .

44

YY

34

btn_detail_arrow_next / _press.png50 x 50 (Right 0, Middle)

btn_detail_arrow_prev / _press.png50 x 50 (Left 0, Middle)

Documents

에버랜드리조트 Guideline for Android (480x800) 2013.2.26 Updated