[UXUI 사전캠프 3주차] UX/UI디자인 관련 용어 정리 Ver.2

가변영역

나인패치를 사용하면 유동적으로 개수나 크기를 고정하지 않고 활용할 수 있는데, 이 때 유동적으로 변하는 영역을 뜻한다.

 

나인패치

대화장에 주로 사용되는 기술로 고정되지 않고 유동적으로 활용된다. 대화형 UI에서 사진, 영상, 링크 등 다양한 요소로 활용할 수 있다.

 

계층적 네비게이션

하위메뉴가 있는 계층구조로 연결된 네비게이션

 

고스트버튼

사용자의 행위를 유도하는 버튼. 얇은 테두리선에 내부는 평범한 텍스트와 투명한 배경으로 구성.

플랫한 화면과 어울리고 높은 대비효과를 주므로 사용자가 터치하기 편하다는 장점이 있다.

 

그리드 리스트 UI

그리드 리스트는 스프링보드나 사진 앨범과 같은 갤러리 화면에서 사용하는 UI로 여러 셀이 격자 모양으로 배치된다.

셀 내부에는 주로 이미지를 삽입하지만 아이콘이나 텍스트 삽입도 가능하다. 콘텐츠가 세 줄 이상 포함된 카드 리스트도 그리드 리스트에 속한다고 할 수 있다.

 

글리프

앱에 시스템 아이콘으로 표시할 수 없는 작업이나 모드가 포함되어 있거나 시스템 아이콘이 앱의 스타일과 일치하지 않는 경우에는 사용자 정의 아이콘을 제작하는 것이 가능하다. 이 때는 템플릿 아이콘이라고도 하는 글리프로 디자인 하는 것을 권장한다.

 글리프는 투명도와 안티에일리어성 및 마스크를 사용하여 그림자가 없는 단색이미지이다. IOS의 표준 인터페이스 요소가 글리프를 지원한다.

 

기본 내비게이션

안드로이드는 햄버거메뉴를 기본내비게이션 패턴으로 가이드라인이 명확하게 존재한다.

IOS에서는 드로워 메뉴를 권장하지 않고 대신 화면 하단의 탭 바를 통해 앱의 최상위 영역에 접근하도록 하고 있다.

 

햄버거메뉴

3개의 가로선. 일반적으로 상단 모서리에 위치해 있으며 하나의 네비게이션을 안에 담을 수 있어 흔히 사용된다.

 

내비게이션 드로워

안드로이드에서는 드로워를 내비게이션 드로워라고 한다. 내비게이션 드로워는 앱의 여러 섹션을 탐색할 수 있는 메뉴를 갖고 있는데 이 메뉴를 오버레이 방식으로 볼 수 있다.

 

노치영역

안전영역은 콘텐츠의 주요 내용이 상태 바, 네비게이션 모음, 도구 모음, 탭 표시줄 등 부분적으로 겹치는 것을 방지해주는 영역이다.

 

대시보드형 카드리스트

사용자에게 각종 데이터와 정보를 빠르게 전달할 때 사용하는 UI이다.

통계 및 비교 분석 결과와 일정 및 메시지 등의 정보를 그래픽으로 구현하여 보여준다. 중요한 내용을 필터링하여 해석한 후 결과를 보기 좋은 그래픽으로 제공하기 때문에 인포그래픽과도 밀접하게 관련되어 있다.

 

대칭형 콘텐츠

커뮤니케이션과 정보, 정보와 오락 등 두 종류 이상의 기능이 결합되어 교육용 게임이나 헬스케어와 같은 새로운 콘텐츠를 생성한다. 하드웨어 기술의 발달과 함께 과거에는 볼 수 없었던 새로운 종류의 콘텐츠가 나타난 경우이다.

 

디지털 프로토타이핑

프로토타입 툴을 사용하여 실제와 비슷한 느낌으로 페이지를 이동시켜 준다. 종이 프로토타입과 달리 상호작용이 가능한 것이 장점이다.

 

메타포

Merterial Design은 종이와 잉크에서 영감을 받아 상상력을 가미한 촉각 현실에 기초하고 있다. 빛, 표면, 움직임과 같은 기본 요소들이 어떻게 상호작용하며 움직이는지에 중점을 두고 있으며, 익숙한 촉각 속성은 사용자의 직관성과 행동 유도성을 높인다. 이 이러한 상호작용은 물리적인 원칙을 따르면서 현실세계를 대체하는 새로운 행동 유도성을 만들어 낸다.

 

모바일 UI 디자인 패턴

매일 발생할 수 있는 공통적인 문제를 해결하는 방법임과 동시에 모바일 애플리케이션 또는 시스템을 설계할 떄 공통적인 문제를 ㅐ결하는데 사용할 수 있는 최상의 가이드라인 또는 템플릿이다. 모바일 UI를 디자인한다는 것은 모바일 UI패턴을 디자인하는 것이다.

 

모바일 콘텐츠의 특성

무선 네트워크를 통해 모바일 기기로 전송이 가능한 형태의 콘텐츠르르 의미하며 최근에는 애플리케이션의 형태로 나타ㅏㄴ고 있다.

-특성 : 개인화, 편재성, 편의성, 차별성, 즉시 연결성, 지역기반

 

배지

메뉴와 연결된 화면에서 새 정보가 있을 때 알려주는 알림표시. 탭바의 인터페이스는 항상 예측 가능한 상태로 유지되어야 한다.

보조 내비게이션

-종류 : 페이지 스와이핑, 스크롤링 탭, 아코디언 메뉴

 

비대칭형 콘텐츠

각각 고유의 형태로 결합되어 커뮤니케이션 중심의 음성통화나 화상통화, 정보나 오락중심의 게임과 만화 등으로 콘텐츠가 다시 분리되어도 고유의 기능을 할 수 있는 콘텐츠를 의미한다. 기존의 콘텐츠를 모바일 기기에 적용하여 콘텐츠의 새로운 용도를 개발한 경우라고 볼 수 있다.

 

패럴렉스 스크롤링

시간차를 두고 오브젝트와 배경 이미지가 이동하면서 변하는 방식이다. 탐색을 간단하게 하고 사용자의 스크롤에 따라 깊이를 제공하여 사용자와 상호작용을 높이기 때문에 페이지에 기대감을 높임과 동시에 머무르는 시간을 늘려 준다. 이 때 빅폰트를 자주 사용하여 심플한 디자인을 추구한다.

 

세그먼트

선택항목이 많지 않을 때, 한눈에 비교할 수 있는 버튼

 

스테퍼

점진적으로 수치가 증가 혹은 감소하는 것을 봐야할 때 사용

 

스위치 

토글 형태의 컨트롤로 두 개의 상호 배타적인 기능을 ON/OFF할 때 사용

 

스큐어모피즘

3차원적인 스큐모픽 디자인으로 현실적인 디테일이 있는 디자인이다.

 

스프링보드

애플리케이션으로 진입하기 위해 사용하는 아이콘 모음. 런치패드 또는 대시보드라고 부르며, 주로 4x5, 4x4, 4x3형태의 그리드를 가진다.

 

스플래시 스크린

-플레이스 홀더 UI : 앱이 로딩되기 전에 보여주는 방식. 로딩이 완료되었을 때 띄워지는 화면과 비슷한 화면을 보여줌.

-브랜디드 런치 스크린 : 로고나 브랜딩 요소를 앱이 로딩되기 전에 먼저 보여주는 방식.

 

엠프티 페이지

앱 자체나 기기에 오류가 있는 경우에 엠프티 페이지를 띄워 나중에 시도하라거나 '시스템에 오류가 발생했다'는 메시지를 보여줘야 한다.

 

옴니 채널

옴니채널이란 여러 채널을 전체 채널 관점으로 바라보고, 각 채널을 유기적으로 결합하여 소비자에게 일관성 있는 경험을 제공하는 것을 말한다. 각 채널을 통합하여 관리함으로써 일관된 고객 경험을 제공하는 것이다. 총체적인 관리별 데이터가 연계되는 것이 중요하다.

 

워크스루

해당 앱을 어떻게 사용하는지 안내하는 튜토리얼 성격을 가진 구성 요소이다. 코치마크보다 다양한 콘텐츠를 담을 수 있고 페이지도 여러 개로 늘릴 수 있다. 앱의 스크린 샷에서 표현하지 못했던 그래픽을 강조하기도 하고, 앱의 콘셉트나 기능 또는 강조하고 싶은 점을 광고하는 역할을 한다.

 

코치마크

애플이 처음 사용한 용어. 사용자에게 모바일 화면의 GUI를 알려주기 위해 고안된 방법.

앱의 아이콘이나 메뉴 등의 이용 방법을 도움말 형태로 제공하는데 대부분의 영역을 어둡게 처리한 후 해당 부분만 하이라이트를 넣어 설명.

 

워크플로형

워크플로형 카드 리스트는 공동작업을 하는 멤버끼리 상세 업무 내역과 일정을 공유할 때 유용하다. 공동작업의 전체 프로세스를 한눈에 파악할 수 있기 때문이다. 또 스마트폰 화면보다는 반응형 웹이나 데스크톱 화면에 적합하다. 모든 항목을 펼쳤을 때가 그렇지 않을 때보다 전체프로세스를 파악하기 쉽다. 특정 상황에서 반복적으로 나타나는 구체적인 형태를 패턴화하여 관리할 수 있다. 이 과정에서 워크플로의 제목과 단계는 워크플로 관리자가 생성하기 때문에 다른 앱에 비해 능동적으로 앱을 사용할 수 있다.

 

일시적 내비게이션

-토글 메뉴 : 인레이 방식과 오버레이 방식으로 나뉨. 메뉴 전체가 화면을 덮어서는 안되며, 백그라운드 아무 곳을 누르면 메뉴가 숨겨진다.

-드로워 : IOS에서는 주로 인레이 드로워를 사용. 안드로이드에서는 오버레이 드로워를 사용.

-파이 메뉴 : 원형메뉴, 방사형메뉴 형식으로 주로 게임의 세부 메뉴를 보여줄 때 사용. 최근에는 트리거를 사용하여 나타나게 함.

 

폼 팩터

아이폰 X용 디자인을 할 때는 둥근 모서리 공간까지 포함하여 전체화면이 꽉 채워지도록 디자인 해야한다.

상단 센서 등의 위치에 다른 화면으로 이동하는 버튼 등을 배치하지 말아야 한다.

 

LBS

위치 기반 서비스(Location Based Serviced) GPS와 구글 맵이 모바일 기기에 기본 소프트웨어로 탑재되었다.

 

M-커머스

M-커머스는 스마트폰, 테플릿 PC, PDA를 이용한 은행업무, 지불업무, 티켓업무와 같은 서비스를 제공하는 비즈니스 모델로 무선 데이터 장비를 이용하여 정보, 서비스, 상품 등을 교환하는 것을 말한다. 2012년 이후에는 NFC 칩을 통해 일반 카드처럼 단말기에 수신하는 방법으로 결제하는 시스템이 서비스되고 있다.

 

 

 

참고자료 : https://m.blog.naver.com/hongbear_/222680037542

https://m.blog.naver.com/jineee10_/223276536746