본문 바로가기

오늘의 공부/디자인

[웹디자인] 웹디자인 용어를 알아보자!

웹디자인 할때 많이 쓰는 용어를 알아보자!

 

1. 디자이너의 역할

 

- UX >

UX(User Experience), 유저의 경험을 반영하여 앱과 웹상 화면 설계하는 것(컴퓨터와 관련없는 부분도 찾아서 설계한다.)

 

- UI >

UI(User Interface)  웹이나 앱을사용하는 사용자가 편하게 사용하도록 설계된 내용을 디자인하고 제작하는 것

 

- GUI >

GUI(Graphical User Interface), 그래픽 사용자 인터페이스를 줄인 말로 UI에 그래픽(컬러,아이콘,인터렉션 등)까지 더해서 디자인 하는 것  

 

사실 학문적으로 보면 UX > UI > GUI 이고 실무에서는 UI = GUI로 통용된다. 더욱 작은 조직이라면 UX=UI=GUI로 디자이너가 기획 또는 설계도 함께 진행한다.
 
용어가 헷갈리게 나뉜 이유는 그래픽으로 화면은 구분하던 컴퓨터와 오로지 텍스트만 사용하는 컴퓨터가 있던 시절 구분지어 놓기 위해 만든 단어이기 때문이다.

그래서 나는 UX = 설계 + 기획, UI + GUI = 웹/앱 디자인 이고 때에 따라 다루는 프로그램이 다르다고 이해하고 있따.  

출처 http://uidesignguides.com

 

2. 작업시 사용하는 용어

 

- 와이어프레임 > 제품을 구성하는 서로 다른 레이아웃을 간단한 모양만을 웹/앱 화면에 구성하여 시각적으로 묘사한 것.

 

- 프로토타이핑 > 실제 웹 사이트 또는 앱의 기능과 디자인 세부 사항을 시뮬레이션하여 화면의 이동을 확인할 수 있는 것  

 

- WSG > 웹 스타일 가이드로 다양한 요소들을 한 웹페이지에 디자인하기 위해 정해둔 지침이나 규칙,효율성을 높이기 이해 꼭 필요하다. 

 

- Affordance > 유저가 UI를 따라 행동하기 쉽게 만드는 것 (ex - 구매 버튼이 빨강 이거나 다음버튼이 잘보이는 것 )

 

- Gird > 레이아웃을 구현하는 데 필요한 가이드 라인, 그리드를 설정하고 디자인하면 간격조절이 쉽고 반응형에 유용하다.

 

- Layout > 화면 구성하고 있는 컨텐츠의 모양

 

- CTA > Call To Action 목표달성 버튼 (저장이나 완료 또는 구매 등등 버튼)

 

- 크로스 브라우징 > 다양한 브라우저에서 사용자의 정보가 소외되지 않게 하는 것

 

- 웹서버 > 브라우저에 정보를 띄워줄 코드, 이미지, 데이터를 저장하는 곳

 

- 웹 호스팅 > 웹서버를 무료/유료로 빌려주는 곳

 

- 도메인 > 인터넷 상의 주소