에에에에에에에 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
에버랜드 Guideline for Android
BG 이미지 사이즈는 가로 기준으로 세로 사이즈를 가변으로 삽입
가로기준 : 720(720x1280) 고해상도 , 480(480x853) 최적화 사이즈Crop 은 TOP 기준 , 하단의 이미지가 남는 방식 .
Cover Image AreaFill parent x Fill parent (Center, Top)
gate-event
5
에버랜드 Guideline for Android
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
에버랜드 Guideline for Android
44
48
20
34
54 54
YY
XX2
gate- 뉴스 & 공지
7
img_list_arrow.png44 x 44
에버랜드 Guideline for Android
기본 : 나눔고딕볼드 / 18dp / center, middle / FFFFFF 밝기 : 나눔고딕볼드 / 18dp / center, middle 기준 위로 1px / db5400
title_bg.png320x 44 (Center, Top)
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
에버랜드 Guideline for Android
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
에버랜드 Guideline for Android
44
48
2
114
10
기본 : 나눔고딕볼드 / 18dp / center, middle / FFFFFF 밝기 : 나눔고딕볼드 / 18dp / center, middle 기준 위로 1px / db5400
title_bg.png320x 44 (Center, Top)
44
16
Font : NanumGothic (Bold) 10dpColor : FF7300, Color : 008DE7Align : Left, Top
Font : NanumGothic (Bold) 14dp Color : 333333Align : Left, Top
2
XX 44
bg_colorDefault : FAF7F0, Press : F2EFE6
104
1488
16
16
16
10 20
Font : NanumGothic (Bold) 10dp Color : 999999Align : Left, Top
img_list_arrow.png44 x 44
img_list_line.9.png10 x 2
gate- 우대정보 에버랜드 Guideline for Android
ScrollArea
통이미지 )
10
48
44
10
bg color F2EFE6
10
btn_back.png btn_back_press.png44 x 44 (Left 0)
img_textbox.9.png
Scroll Area 통이미지 영역 - img_textbox.png 의 가운데 영역이 컨텐츠 높이만큼늘어난다 .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- 쿠폰행사
11
에버랜드 Guideline for Android
44
48
2
64
10
기본 : 나눔고딕볼드 / 18dp / center, middle / FFFFFF 밝기 : 나눔고딕볼드 / 18dp / center, middle 기준 위로 1px / db5400
title_bg.png320x 44 (Center, Top)
img_list_arrow.png44 x 44
10
10
44
16
Font : NanumGothic (Bold)14dp / Color : 333333Align: Left
img_list_line.9.png10 x 2
2
10 XX 44
bg_colorDefault : FAF7F0, Press : F2EFE6
16
32
20
Gate- 쿠폰행사
12
img_coupon_small.png74 x 48
에버랜드 Guideline for Android
ScrollArea
통이미지 )
bg color F2EFE6
10 10
48
img_textbox.9.png
Scroll Area 통이미지 영역 - img_textbox.png 의 가운데 영역이 컨텐츠 높이만큼늘어난다 .10 10
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
img_bold_line.9.png10 x 2
48
btn_back.png btn_back_press.png44 x 44 (Left 0)
Center 기준
74 10
bg_bottom_bar.png320 x 48Center, Bottom
28
10
10
140
10
Gate- 쿠폰행사
13
에버랜드 Guideline for Android
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 : 666666Align: 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
Font : NanumGothic (Bold)15dp / Color : 333333Align: Left, Top
img_bold_line.9.png10 x 2
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
Font : NanumGothic (Bold)14dp / Color : 666666Align: Left, Top
16
img_table_line.9.png,쿠폰번호 밑에도 들어감10x 2, Center, left, right padding 각각24 img_textbox.9.png
에버랜드 Guideline for Android
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
에버랜드 Guideline for Android
10 10
bg color F2EFE6
Scrollarea)
10
44
10
20
36
20
XX
Font : NanumGothic (Bold)15dp / Color : 333333Align: Left, Top
img_bold_line.9.png10 x 2
10
44
15
15
Gate- 설문
btn_poll_next / press.png60 x 28Right, Middle
bg_bottom_bar.png320 x 48 Center, Bottom
Font : Helvetica (Bold)20pt / Color : FF6301Align: Center, Middle
Font : Helvetica (Bold)20pt / Color : A6A19DAlign: Center, Middle
에버랜드 Guideline for Android
10 10
bg color F2EFE6
10
44
44
btn_poll_end / _press.png140 x 28 Center, Middle
10
10
28
10
bg_bottom_bar.png320 x 48 Center, Bottom
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
title_bg.png320x 44 (Center, Top)
68
에버랜드 Guideline for AndroidList- 지도
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
에버랜드 Guideline for AndroidList- 지도
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
에버랜드 Guideline for AndroidList- 지도
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
Font : Nanum Gothic (Bold)12dp, Color : 333333Left, Middle
Font : Nanum Gothic (Bold)12dp, Color : 666666Left, Middle
BG Color : FFFFFF
36
36
21
에버랜드 Guideline for AndroidList- 지도
44
36
2
btn_list_xclose_large /_press.png36 x 36, (Right, Middle)
Divider full x 2Color : C7C4BFCenter, 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 : Nanum Gothic (Bold)12dp, Color : 333333Left, Middle
Font Color : FFFFFFLeft, Middle
22
에버랜드 Guideline for AndroidList- 지도
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
Divider full x 2Color : C7C4BFCenter, Middle
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
Font : Nanum Gothic (Bold)16dp, Color : 000000Align: Left, Top
Font : Nanum Gothic (Bold)12dp, Color : 333333Align: Left, Top
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
List- 필터링 에버랜드 Guideline for Android
44
title_mypage_bg.png320x 44 (Center, Top)
기본 : 나눔고딕볼드 / 18dp / center, middle / FFFFFF
밝기 : 나눔고딕볼드 / 18dp / center, middle 기준 위로 1px / 0F0D0A
44 44
44
btn_back.png btn_back_press.png44 x 44 (Left 0)
50
50
5010
btn_poll_off.png44 x 44Right 3, Top 3
btn_poll_on.png44 x 44Right 3, Top 3
XX
Divider full x 1Color : E0E0E0
1
OFF : 나눔고딕볼드 / 14dp / left, middle / 333333
ON : 나눔고딕볼드 / 14dp / left, middle / FF6301
bg color : 2A231D
default bg color : 000000
List- 필터링 에버랜드 Guideline for Android
44
50
50
5010
btn_poll_off.png44 x 44Right 3, Top 3
btn_poll_on.png44 x 44Right 3, Top 3
XX
Divider full x 1Color : E0E0E0
1
Divider full x 1Color : C1917
List- 검색 에버랜드 Guideline for Android
btn_filter_close /_press.png58 x 44 align : Right, Top
title_mypage_bg.png320x 44 (Center, Top)
기본 : 나눔고딕볼드 / 18dp / center, middle / FFFFFF
밝기 : 나눔고딕볼드 / 18dp / center, middle 기준 위로 1px / 0F0D0A
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
List- 검색 에버랜드 Guideline for Android
46
Divider full x 1Color : C7C5BF
BG COLOR : F2EFE634
XX6
img_searchbox.9.png34 x 34 align : Center, Middle
12
img_searchicon.png34 x 34 align : Right, Middle
Font : Nanum Gothic (Bold)14dp, Color : 333333Align: Left, Middle
4
btn_cancel /_press.png58 x 44 align : Right, Middle
6
6
Dim BGColor : 00000075% 반투명
List- 검색 에버랜드 Guideline for Android
46
Divider full x 1Color : E0E0E0
Divider full x 1Color : E0E0E0
10
Font : Nanum Gothic (Bold)14dp, Color : 333333Align: Left, Middle
BG COLOR : FFFFFFPRESS COLOR : F2EFE6
XX
Divider full x 1Color : C7C5BF
BG COLOR : F2EFE634
XX6
img_searchbox.9.png34 x 34 align : Center, Middle
12
img_searchicon.png34 x 34 align : Right, Middle
Font : Nanum Gothic (Bold)14dp, Color : 333333Align: Left, Middle
4
btn_cancel /_press.png58 x 44 align : Right, Middle
6
6
Detail- 갤러리 에버랜드 Guideline for Android
44
96
14
btn_back.png btn_back_press.png44 x 44 (Left 0)
기본 : 나눔고딕볼드 / 18dp / center, middle / FFFFFF
밝기 : 나눔고딕볼드 / 18dp / center, middle 기준 위로 1px / db5400
title_bg.png320x 44 (Center, Top)
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
btn_back.png btn_back_press.png44 x 44 (Left 0)
BG COLOR : 000000반투명 85%
Font : Nanum Gothic (Bold)14dp, Color : FFFFFFAlign: Center, Middle
기본 : 나눔고딕볼드 / 18dp / center, middle / FFFFFF
밝기 : 나눔고딕볼드 / 18dp / center, middle 기준 위로 1px / db5400
title_bg.png320x 44 (Center, Top)
이미지 사이즈는 가로 기준으로 세로 사이즈를 가변으로 삽입가로기준 : 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)