본문 바로가기
design/Principles

뷰 타입 :: View type

by heesangs 2020. 8. 11.

뷰 타입

GRID 형

정의 : 이미지 + 2개 이상의 세로줄을 사용한UI

 

 - 이미지가 대부분의 공간을 차지, 텍스틀 최소화.

 - 유저가 이미 목적을가지고 어떤콘텐츠를 선택할지 알고 있을때 유용함.

 - 이미지는 자극을 주어 급한선택을 할 수 있게 만들고, 전체콘텐츠를 보기위해 많은 스트롤을 해야한다는 단점.

    ex)인스타그램, 제품, 갤러리등에서 사용.

 

LIST 형

정의 : 한 세로단에 모든 콘텐츠를 나열한 뷰 형태.

특징 : 텍스트 라벨을 훝어보고 자신이 원하는 정보를 빠르게 찾을 수 있도록 해줌.

 

종류

 - 텍스트 형태 : 아코디언 사용으로 오버스크롤링 방지.

 - 텍스트+섬네일(아이콘)형태 : 리스트형 상품리스트.

 

CARD 형

정의 : 콘텐츠가 있는 사각형 영역을 카드를 나열하듯이 배치해 보여 주는 UI 형식

특징 : 흩어져 있는 요소를 그리드 구성으로 일관성 있게 정렬해 보여 주기 때문에 사용자에게 보다 효과적으로 웹 페이지의 내용을 전달

 

종류

feed형 : 무한이 이어지는 데이터 스틀림. ex) 페이스북

가로 스크롤형

리스트형

TYPO + IMG

정의 : GRID, LIST, CARD 등을 생략한 레이아웃 디자인.

특징 : 그리드나 레이아웃을 살짝 벗어나는 UI 디자인으로 능숙한 디자인 실력이 필요. 

 

 

'design > Principles' 카테고리의 다른 글

글자 크기 :: type scale  (0) 2020.11.03
사람-컴퓨터-상호작용 :: HCI  (0) 2020.08.31
그리드시스템 :: grid system  (0) 2020.08.25
무드보드 :: moodboard  (0) 2020.08.24
컨셉트 디자인 :: concept deisgn  (0) 2020.08.22

댓글