App기획 [UI/UX 용어]

UI/UX용어

상태바 Status Bar 

3G네트워크 상태, 이통사 브랜드, 와이파이 수신감도, 시계 및 배터리 잔량상태 등이 표시된다.

네비게이션 바 Navigation Bar

다양한 기능을 수행함. 화면의 전환, 화면 내 저장 또는 취소, 화면의 제목표시 등 

커스텀 뷰 Custom View

커스텀이 가능한 뷰, 보여주고자 하는 정보, 서비스가 제공됨

탭바 Tab Bar

앱의 모든 페이지로 이동할 수 있는 아이콘이 표시되는곳

툴바 Toolbar

하나의 뷰 안에서 여러개의 액션을 사용자에게 제공할 경우 화면의 하단에 보여진다.

현재 뷰에서의 실행되는 여러가지 버튼을 담고 있음.

하나의 앱에서 여러 가지 다른 모드로 변경해서는 안된다. 

경고창 Alert 

경고창 디자인 작업시 고려사항

화면방향전환에 따른 사전테스트 필요 - 가로보기에서 세로보기로 화면이 전환되면 경고창의 사이즈가 달라져야한다. 따라서 각각의 화면보기별로 경고창 사이즈를 체크해야한다.

2개의 버튼이 있는 경고창 - 사용자에게 선택의 기회를 제공한다는 점에서 1개보다는 2개버튼 권장한다. 때에 따라서 2개의 버튼을 사용하게 되면 액션시트 대신 사용할 수도 있다. 

적절한 색상의 적용- 경고버튼은 일반적으로 어둡고나 밝은 색상이 적용된다.

두개의 버튼이 있는 경고창을 생각해보면 좌측이 항상 어두운 색상, 우측이 항상 밝은 색상이 된다. 하나의 버튼이 있는 경우, 버튼은 항상 밝은 색상이 된다. 

앱 개발방식

네이티브 앱 iphone Application

일반적인 앱개발을 지칭하는 것

Native 언어로 개발하는 것

애플에서 제공하는 아이폰 앱개발용 툴킷인 SDK를 사용해서 개발하는 방식

웹앱 Web-only content

HTML로 개발하는 것

아이폰에서 제공하는 사파리 브라우저를 통해 서비스 될 수 있다.

하이브리드 앱 A hybrid application

아이폰 앱개발 방식과 웹기반 콘텐츠의 혼합방식

아이폰의 SDK로 프레임을 만들고, 이 내부에서 웹뷰를 통해 웹콘텐츠를 보여주는 방식

iphone 제스쳐 

Tap

가장 일반적인 제스처, pc의 마우스에서 클릭과 유사, 대상의 선택 또는 실행

Drag

특정 요소를 이동시킬 때 사용. 또는 이미지의 위치 변경 

Flick

빠르게 드래그하기

ex) 포토개러리에서 사진 빨게 넘기기 등 

Swipe 

갖다 대기, 한방향으로 길게 드래그하기

ex1) 아이폰 : SMS에서 각 SMS삭제시, 삭제 버튼을 나타나게 하는 제스처

ex2) 아이패드 : 각종광고, 애니메이션에서 영상의 단계별 재생시  

Double tap

확대된 사진을 다시 원래 사이즈로 돌리고 싶을때 (빈대의 경우도 마찬가지)사용하는 제스처

큰 이미지를 여기저기 패닝(또는 스크롤)하다가 원래 위치로 되돌리고 시을 때 사용하는 제스처  

Pinch open

확대

Pinch close 

축소 

터치한 후 계속 누르고 있는 상태

ex)텍스트 편집기에서 텍스트 위로 돋보기가 나타나는 것

광고 호스팅

Ad호스팅 -> 사용자가 Banner View 광고 탭 -> 프로그래밍액션 선택 

(동영상 실행, 인터랙티부한 광고 콘텐츠, 사파리 웹브라우저 실행) 

아이폰 광고배너는 화면의 하단 가까이에 배치한다.

화면 하단에 바가 없다면, 화면 하단 끝자리에 배너뷰를 배치한다. 

출처:https://skwinwin.com/ 

단순 개인 소장용 강의 요약자료입니다. 문제가 될 시 바로 삭제할 것임을 알려드립니다.