기타 지식

쉽게 알아보는 UI와 UX의 차이점

사진 자료를 첨부하면 이해가 더 쉬울 것 같지만

심심해서 코파다가 갑자기 삘타서 쓰는 글이니 대충 글로만 적어보겠다

 

 

흔히 UI와 UX라는 말을 (게임을 좋아한다면) 한 번쯤은 들어봤을 것이다

사전적 의미는 User Interface (사용자 인터페이스) 와 User Experience (사용자 경험) 인데

이렇게 이론적으로 배우면 직관적으로 뜻이 와닿지도 않고 재미 없으니 쉽게 설명해보겠다

 

UI는 지금 개드립넷에서도 볼 수 있는 직관적인 틀, 즉 껍데기를 의미한다

쉽게 말하면 버튼이 어떻게 생겼고 디자인이 어디에 있고, 어떤 메뉴형식을 가지고 있으며 검색창은 어디에 어떤 모양으로... 뭐 이런거

 

UX는 당신이 살면서 익숙해져 있는 (스스로 인지하지 못하더라도 무의식중에 습관화된) 것들을 말한다

 

UI에 신경을 쓰면 보기에 이뻐지고, UX에 신경을 쓰면 누구나 쓰기 편해진다

 

쉬운 예를 들어보자면

요즘 앱들은 개발자도 많아지고 디자인쪽 업계도 접근이 쉬워지다보니

깔끔하고 이쁜 외형을 가지고 출시된 것들이 많다

다만 깔끔하긴 한데 사용 기간이 길어질 수록 어딘가 모를 불편함 을 느낀 경험이 있을 것이다

분명 이런 류의 어플엔 있을법한데 없는 기능이 있다거나, 직관적이지 못해 필요한 기능에 접근하기 어려운 경우이다

이런 사례들은 UI에만 신경을 쓰고 UX는 세세하게 고려하지 못한 경우

 

또 한가지는

인터넷을 이용하다 보면 종종 해외 사이트에 들어갈 일이 생긴다

누구나 어느정도 영어를 읽을 수 있도록 공교육을 거치지만, 나를 포함한 많은 사람은 갑자기 쏟아지는 양놈들의 활자를 보면 머리가 어질어질해진다

그럴 땐 무대뽀로 사이트를 헤쳐 나가든, 국내 블로그의 설명글을 이용하던지 하는데

결국엔 직접 해외 사이트에 접속할 수 밖에 없는 필연적인 상황에 놓인 경험이 다들 있을 것이다

바로 그 때, 어지러운 영어의 바다 속에서

당신은 누가 알려주지 않아도 본능적으로 Download 버튼을 찾아서 누를 수 있는 경험을 한 적이 있다!

이것은 무지성으로 게임만을 찾아 헤매는 초글링마저도 행하게 되는 행위로, 컴퓨터를 처음 접하는 순간부터 뼛속깊이 각인된 우리들의 습관이다

바로 이것이 UX의 중요성이다

직관적으로, 그리고 경험적으로 뭐가 뭔지 눈치껏 파악할 수 있는 편의성이 고려되었기 때문에 가능했던 것이다

 

시간이 좀 더 남아 TMI를 풀어보자면

우리 엄만 컴맹이었다

엄마의 머리속엔 '기계 = 정해진 입력을 하면 출력을 뱉는 장치' 였기 때문에

그리 나이가 많지 않음에도, 프로그램을 이용하는데에 어려움을 겪었다

가령, 'A 기능을 사용하려면 B를 누르고 -> C에 들어가서 -> D를 입력한다' 라는 식으로 학습하는 것이었다

모든 사용법을 순서대로 암기하려고 했기 때문이다 (우리 엄마 말고도 꽤 많은 컴맹들이 이런 것 같더라)

나는 어려서부터 컴퓨터를 이용하는 것이 너무 당연한 일이었기 때문에, 적당히 있을법한 곳을 떠올려 보라며 분류된 메뉴의 개념을 잘 이해하지 못하는 엄마의 심정을 이해하기 어려웠다

지금와서 생각해보면 그것이 바로 UX의 차이였던 것 같다

UX가 충분히 고려되지 않으면 어떤 사람에겐 검색엔진을 사용하는 것 조차 버거운 일이 될 수가 있다

가령 우리네들이 초딩일 시절 많은 아이들이 "스타크래프트 1.16.1 립버전"을 검색하고 무지성으로 다운로드 버튼만을 찾다가 랜섬웨어에 걸리는 것 말고는 컴퓨터를 이용할 줄 몰랐던 것처럼...

아마 현대의 노인들이 대문짝만한 글씨와 음성이 나오는 키오스크조차도 사용하기 어려워 하는 것도 같은 맥락이 아닐까

 

 

요약

UI = 껍데기

UX = 사람들의 사용경험

좋은 UI + 충분히 고려된 UX = 이쁘고 편리한 프로그램

 

 

틀린점은 댓글로 지적하셔도 좋습니다

심심해서 코파다가 적는 글이기 때문에

지적시 님말이 다 맞음

 

 

65개의 댓글

2022.02.07

같은 셀렉트 형식의 인터페이스도 게임마다 불편도가 다 다른데, 그게 UX의 차이인거구나.

페르소나 매우 칭찬해

0
2022.02.07
@요나

게임 페르소나라면 혁신적인 UI인데도 불구하고 좋은 UX를 갖게한 좋은 사례지

0
2022.02.07
@비온다구

페르소나 ui 보면서 게임 해보지도 않은 애들이 기껏해야 폰으로 조그맣게 몇장 보고는 구리다고 왈가왈부 하더라

0
2022.02.07

Ux 디자인이 진짜 어려운 것 같아

0
2022.02.07

글자 배경색으로 존나 형광색 박아서 글자가 잘안보임

0
2022.02.07
@키이읍

다크모드라 그런가

0
2022.02.07
@키이읍

다크모드에서 실패한 UI인거지

4
2022.02.07
@키이읍

다크모드라는 ux를 고려하지 않은 ui인거지

1
2022.02.07
@호랭이기운

이거지

0
2022.02.07

ㅊㅊ

0
2022.02.07

그럼 오른손 잡이 많으니까 뒤로가기 버튼 오른쪽에 놔두면 이것도 UX임?

0
2022.02.07
@달빛수호자

맞긴한데 ux엔 경험도 포함되어 있음

게임에서 셋트템은 글자가 무슨색이고 유니크는 무슨색일까?

머리속에 바로 떠오르게 하는 그 색도 ux임

내가 다른 이유를 만들어 색을 바꿀수 있을지언정 사용자가 그걸 의도대로 받아들이냐는 다른 얘기인거지

1
2022.02.07
@달빛수호자

이건 내가 딥하게 파보지 않아서 해당되는지 모르겠지만

아마도 블리자드식 희귀-영웅-전설 이런 등급체계도 한번 대표되고 나면 비슷한 장르에선 자연스럽게 같은 방식을 채택하게 됨

LG폰과 삼성폰의 반대되는 뒤로가기의 위치나 애플과 윈도우의 확인/취소 순서 같은 것두 해당한다고 볼 수가 있지 ㅇㅇ

0
2022.02.07

글 잘 읽히네 굿굿!

0
2022.02.07
@부질업다
0
2022.02.07

코 파니까 시원하십니까

0
2022.02.07
@주계피

코딱지 낭낭하게 채굴했읍니다 :D

0
2022.02.07

코피안났니

0
2022.02.07
@크리모

다행히두 ㅎ

0
2022.02.07

UI가 이쁨이고 UX가 편리함이라는 소리지?

0
2022.02.07
@몬가몬가잇슴

ㅇㅇ

익듁한 그맛-

0
2022.02.07

노란 형광펜에 흰색글씨는 ux를 배려하지 않은 모습이네요

0
2022.02.07
@피츠

난 검은색으로 보이는데 엥

0
2022.02.07
@호랭이기운

그것은 제가 다크모드라서 그랬구욘

0

경?험

0
2022.02.07

게임을 예시로 들어 물어보면

보통 인벤토리 단축키가 Tab이나 I인데 어떤 게임이 K로 해서 알게모르게 불편함이 있었다면 그게 UX와 관련이 있믄건가??

0
2022.02.07

UX 하면 죄다 모바일 앱 개발 환경만 이야기해서 그 외의 사례 찾기가 너무 힘듬

0
2022.02.07

uxui 굉장히 중요한 부분이라 현업서 강의해보면 제대로 알고있는애들 별루 안댐

0
2022.02.07

개드립 ui 습관적으로폰키면개드립부터들어가는행위 ux로 보면 되나

0
2022.02.07

글씨 색상 부터 어케해줘...

0
2022.02.07

씹덕이 알려주는 씹덕겜 기준

ui ㅡ 캐릭터 선택이 바로보임

ux ㅡ 아니오가 국내판은 오른쪽 일판은 왼쪽임

0
2022.02.07

너의 글씨 색상 부터 UI에만 신경을 쓰고 UX는 세세하게 고려하지 못한 경우다

 

개드립넷 다크모드로 쓰는 사람마저 고려해서 해야지

 

0
2022.02.07

추천줄려고 로그인했다 ㅊㅊ

0
2022.02.07

UX 도 결국 디자인 경험에서 나오는거라...

0
2022.02.07

진지하게 UX가 뭔지 모르시는거 같네요.

UI와 UX는 비교 대상이 아니고, UI는 UX에 속하는 하나의 요소일 뿐이에요.

쇼핑몰로 치면 배송 받은 박스의 테이프가 가로로 붙었냐 세로로 붙었냐, 뽁뽁이가 한겹이냐 두겹이냐도 UX입니다.

1
2022.02.07
@개별완전체

그럼 잘 아는 니가 정보글 "써줘"

0
2022.02.07
@도레미

싫은데? 내가왜?

0
2022.02.07
@개별완전체

스노비즘 같아서

1
2022.02.07
@도레미

UX가 뭔지도 개념도 없이 싸지른 글에 한 수 가르쳐주고 지나가는거라 생각해.

0
@개별완전체

알려주긴 뭘 알려줘 ㅋㅋ ux 분야 연구실 석사임 본문글 구체적이진 않아도 틀리다고 할만한거 없음

0
2022.02.08
@네가살아있어서다행이야

ㅋㅋㅋ 겨우 석사가.. 웃기네..

0
@개별완전체

겨석 ㅇㅈㄹㅋㅋㅋ

0
2022.02.10
@네가살아있어서다행이야

에휴. 공부좀 더하고 실무경험좀 쌓고 오려무나.

0
2022.02.07

좀 틀린 부분이 있는데 UI는 이쁜 디자인은 아니고, UX를 구성하고, 그를 달성하기 위한 수단임 ㅋㅋㅋ

그래서 UI가 구리면 UX도 구려짐 반대로 UI 구성 하나만으로도 UX나 전반적인 프로덕트 효율 자체를 올릴 수도 있고.

이 글에서 말하는 UI는 그냥 통상적인 디자인에 가까움 UI 구성할때는 UX를 고려하지 않는게 아니라, UX를 고려하고 UI를 배치하는거임

버튼 위치는 이쁘라고 거기 두는게 아니라, 거기 두는게 효율이 좋게 나오거나 유저경험이 좋으니깐 거기 두는거임...

 

보통은 그래서 자전거 예시를 많이 듬

 

고객이 자전거에 올라타서부터 운전하고 내리기까지 모든 경험 총칭 - UX

자전거 안장/손잡이/페달,바퀴 위치 등 고객과 상호작용할 수 있는 요소들 - UI

2
2022.02.07

UX 디자인을 실현할 때 UI는 UX를 실현하는 수단이 되는 거지

꼭 UX 디자인의 결과물이 UI가 될 필요는 없음

참고로 글 안읽고 쓰는 댓글임

0
2022.02.07
@히히못가

다른 수단이라 함은?

0
2022.02.07
@적외선안마기

산업 디자인(건축, 자동차 등)에서도 폭넓게 적용될 수 있는 개념이고,

추상적으로 들어가자면 테이블 세팅할 때 통계적으로 오른손잡이가 더 많기 때문에 스푼과 포크를 오른쪽에 놓거나, 공원에서 길이 아닌 곳에 지름길이 생겨서 거기에 길을 새로 까는 것 등.. 이런 느낌임

한도 끝도 없이 추상적으로 적용될 수 있는 개념임

0
2022.02.07
@히히못가

쉽게말해 '편한거'네

0
2022.02.07
@적외선안마기

그냥 사용자가 무의식적으로 움직일 때 기대할 수 있는 행동에서 위화감이 느껴지지 않으면 좋은 UX인 것

더 좋은 예시가 생각이 났는데 문 손잡이에서 밀어야 하는 문이면 더 납작하고 넓은 형태를 하고 있고 당겨야 하는 문이면 얇고 돌출된 형태인 것이 좋은 UX임. 보자마자 생각할 필요도 없이 사용자가 본인 경험에 따라 행동할 수 있는 거지.

1
2022.02.07
@적외선안마기

사실 이 문손잡이 예시는 이론적 UX인 것이 모든 사람들은 무의식적으로 문을 밀어서 열기 때문에 ㅋㅋㅋ 그냥 문이 무조건 밀어도 열리는 게 좋은 UX겠지

0
무분별한 사용은 차단될 수 있습니다.
번호 제목 글쓴이 추천 수 날짜
5267 [기타 지식] 개붕이들에게 공유하는 심리상담 과정 22 직과닝 14 4 일 전
5266 [기타 지식] [약스압]얼마나 말이 안되는 걸까: 올해 6월 모의 영어문제 ... 15 시에는퇴근할거야 9 5 일 전
5265 [기타 지식] 얼음과 칵테일의 상관관계 1편 - 바텐더 개붕이의 술 이야기 5 지나가는김개붕 6 5 일 전
5264 [기타 지식] 2024년 방콕 광역권 지도 업데이트 16 쿠릭 10 6 일 전
5263 [기타 지식] 조만간 유럽행 항공권 가격이 비싸질 예정인 이유 21 K1A1 17 7 일 전
5262 [기타 지식] 감정을 표현하는 434가지 단어 9 Infinity 1 8 일 전
5261 [기타 지식] 뻔한 이야기지만 결국엔 맞는 이야기 9 Infinity 2 10 일 전
5260 [기타 지식] 칵테일에 소금물을 넣어보세요, 살린 솔루션편 - 바텐더 개붕... 6 지나가는김개붕 7 11 일 전
5259 [기타 지식] 웹툰 나이트런의 세계관 및 설정 - 괴수 1부 16 Mtrap 7 11 일 전
5258 [기타 지식] 영원한 2등, 콩의 술 아르마냑 편 - 바텐더 개붕이의 술 이야기 3 지나가는김개붕 4 11 일 전
5257 [기타 지식] 손해를 떠넘기는 사람들과 감당할 수 없는 사회 16 키룰루 27 13 일 전
5256 [기타 지식] 더 디비전2 인기 TOP 4 빌드 소개 43 Mtrap 4 15 일 전
5255 [기타 지식] 보수동 쿨러? 보스턴 쿨러! 편 - 바텐더 개붕이의 술 이야기 4 지나가는김개붕 4 15 일 전
5254 [기타 지식] 필독. 수능만점자가 알려주는 JLPT N1 공부법 12 iqujzvfagwno 6 15 일 전
5253 [기타 지식] 스압)게임 더 디비전 시리즈 헌터의 정체 15 Mtrap 8 19 일 전
5252 [기타 지식] 주문하면 바텐더들이 좋아 죽는다는 칵테일, 라모즈 진 피즈 ... 7 지나가는김개붕 4 19 일 전
5251 [기타 지식] 2024년 방콕 중심지 지도 업데이트 19 쿠릭 28 23 일 전
5250 [기타 지식] 나홀로 세계일주 9년차.ngm 김팽달 6 24 일 전
5249 [기타 지식] 일본은 어떻게 위스키 강국이 되었는가? 편 2부 - 바텐더 개... 1 지나가는김개붕 15 28 일 전
5248 [기타 지식] 일본은 어떻게 위스키 강국이 되었는가? 편 1부 - 바텐더 개... 10 지나가는김개붕 11 29 일 전