일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
- frozensea
- 심리학
- 경영전략
- 광고
- 손자
- 소비자
- 광고학개론
- 손자병법
- 커뮤니케이션
- research
- 올포스트
- 60d
- 광고조사
- olpost
- 마케팅
- 대인관계
- Advertisement
- communication
- 카메라
- 리서치
- cmos00
- 경영전쟁
- 매체
- Dslr
- 브랜드
- 손자병법 활용
- ad
- Marketing
- 손무
- 차가운바다
- Today
- Total
cmos00
6-1. 콘텐츠 디자인 - iOS 본문
1. iOS 콘텐츠 디자인
- 사용자가 기존 UI/GUI, 혹은 OS에서 제공하는 기본 UI/GUI에 대한 교육/경험이 있으므로
이를 최대한 따르는 것이 유리
1) Activity View Controller
- 특정 목적을 달성하기 위한 액션 기능
2) Collection View
- 하나의 이미지 사이즈는 손가락으로 터치하기 적합한 사이즈로 구성
3) Map View
- Map View에 사용하는 핀, 기타 GUI의 경우 일관성있는 컬러와 사용성 적용
4) Pop Over
- Pop Over가 나타날 경우 뒤 화면을 어둡게 하거나 Blur효과를 줄 것을 권장
- 별개의 X(닫기)버튼 불필요
- Pop Over는 변경사항이 있을 경우 즉시 저장/적용
- Pop Over가 어느 위치에서 나오게 되었는 지 표시
- Pop Over 내 내용만으로도 충분히 조작할 수 있어야 하며, 뒤에 있던 콘텐츠를 봐야 이해할 수
있도록 제공하면 안됨
- 한번에 하나의 Pop Over 노출
- 또 다른 Modal View 노출 지양
- Pop Over View가 너무 커서 화면 전체를 가리면 안됨
5) Table View
- 스크롤 가능한 싱글 칼럼 리스트 형태의 뷰
(1) Plain Style Table View
|
- 필요에 따라 Header와 Footer를 붙일 수 있음
(2) Group Style Table View
- 옅은 그룹 단위로 보여지게 되며, 각 그룹에는 최소 1개 이상의 열이 포함되어 있어야 함
(3) Table View Elements Icons
아이콘
|
명칭
|
역할
|
|
Check Mark
|
선택한 열에 체크마크 표시
|
|
Disclosure Indicator
|
열과 관계된 다른 테이블로 이동
|
|
Information Button
|
추가 정보를 새 뷰에서 노출
|
|
Reorder |
위치이동 |
|
Insert Control |
새로운 열 삽입 |
|
Delete button Control |
노출된 열 삭제 버튼 노출/숨김 |
|
Delete |
해당 열 삭제 |
(4) Cell Style
이미지
|
종류
|
설명
|
|
Default |
열 좌측에 이미지가 들어가고 좌측 정렬로 텍스트 배치 |
|
Subtitle |
Default상태에서 텍스트 밑에 Sub텍스트 추가 |
|
Value1 |
Default상태에서 우측에 추측정렬로 옅은 컬러의 텍스트 배치 |
|
Value2 |
이미지는 들어가지 않고 우측정렬의 파란색 폰트가 좌측에, 좌측 정렬의 검은색 폰트가 우측에 배치 |
6) Temporary View
(1) Alert View
|
|
|
|
- 사용자가 앱/디바이스를 사용하는 데 큰 영향을 미치는 중요한 정보를 제공하는 역할
- 충분히 이해할 수 있는 짧은 내용의 정보 제공 (설명이 길어질 경우 스크롤을 넣을 수 있기는 하나 지양)
- 하나이상의 선택 버튼 필수 (일반적으로 2개 제공, 1개 버튼만 제공하는 것은 지양, 3개이상도 가능하나
사용자 입장에서 복잡하게 여겨지기에 지양)
- 별도의 디자인 적용 불가
(2) Action Sheet
|
|
- 사용자가 선택할 수 있는 몇가지 선택지를 제공하는 뷰
- 2개 이상 버튼 제공 (단, 너무 많이 제공하여 스크롤이 되도록 만드는 것은 지양)
- 사용자에게 위험한 결과를 초래할 경우 경고성 및 확인차 보여주는 방식으로도 사용
(3) Modal View
- 앱 사용에 있어 특정 행동을 수행하기 위해 설정해야 할 사항이 있을 경우 이를 위해
띄워주는 뷰
'+ 정리하기 > 모바일 GUI 디자인' 카테고리의 다른 글
7. 아이콘 디자인 (0) | 2017.05.07 |
---|---|
6-2. 콘텐츠 디자인 - Android (0) | 2017.05.07 |
5. 컨트롤 컴포넌트 (0) | 2017.05.05 |
4. 구조구성 컴포넌트 (0) | 2017.05.03 |
3. 컴포넌트의 이해 (0) | 2017.05.03 |