brunch

You can make anything
by writing

C.S.Lewis

by 긍정다운 Apr 03. 2021

1. UX, UI 전문가가 되기 위한 관점

10년 차에 다시 공부하는 UX/UI (입문자를 위한 이론)

[Intro] 문제를 찾는 관점이 곧 그 사람의 전문성을 나타냅니다.

 마케터인 경우에는 특정 상품을 어떻게 홍보하면 좀 더 매력적으로 느껴질까 하는 고민을 할 것이고, 패션디자이너 같은 경우에는 옷을 만들 때 이 사람의 체형이나 옷을 입는 상황을 고려해서 디자인하겠죠. 이렇게 특정 직업에서 주로 고민하거나 문제를 찾아 해결하는 일관적인 방식이 있는데, 이런 부분을 타인이 봤을 때에는 그 분야의 전문가라고 느껴지게 합니다. 즉 문제를 찾는 관점이 곧 그 사람의 전문성을 나타냅니다.




[01]. UI 디자이너는 어떤 관점으로 문제를 찾을까요?

UI의 종류


 UI란 User Interface의 약자로 사용자가 제품이나 서비스를 이용하기 위해 터치하는 접점 또는 그 공간을 의미합니다. 물리적으로 잡을 수 있는 핸들같은 PUI (Physical User Interface)도 있고, 목소리로 명령하는 VUI (Voice User Interface)가 있고, 가장 흔하게 앱에서 비주얼젹으로 보이는 GUI (Graphic User Interface)가 있습니다. 따라서 UI 디자이너의 관점은 기존 서비스의 UI의 불편한 점을 찾고 개선하는 업무가 주가 될 것입니다. 이 부분은 사실 크게 어렵거나 혼돈되지는 않으실 것 같습니다.




[02]. UX디자인은 어떤 관점으로 문제를 찾아야 할까요?


 UX란 User Experience로 사용자 경험을 의마합니다. 그렇다면 불편한 사용자 경험을 찾아 개선한다는 건데, 경험을 어떻게 찾고 어떻게 만든다는 거지? 생각을 하면 할 수록 더 모호해집니다. 그렇기 때문에 UX디자인은 일은 시작할 때 관점을 명확히 하지 않으면 기획도 아니고 디자인도 아닌 어정쩡한 포지션이 될 수 있습니다. 

 

 우선 UX디자이너로서 전문성 있게 일하기 위해서는 4가지 관점으로 문제를 찾을 수 있어야 합니다. 

UX디자이너가 문제를 찾는 4가지 관점


[02-1]. 첫번째로 인지적 관점입니다. 

 이전에 작성한 글에서 UX디자인의 필수업무는 바로 사용성을 개선시키는 일이라고 언급한 적이 있습니다. 사용성과 가장 밀접한 관련이 있고, 대부분의 프로젝트에서 주로 가져야 하는 필수 관점이 바로 인지적 관점입니다. 인지적 관점을 사용자가 제품 또는 서비스를 이용할 때 화면 내 UI나 정보, 또는 콘텐츠를 제대로 이해하고 사용하는데 문제가 없는지를 판단하는 관점입니다.


 사용자는 어떤 서비스를 이용할 때, 다음과 같은 인지 프로세스를 빠르게 거치면서 이용합니다.

인지 프로세스


 '지각' 이라는 것은 사용자의 시야 안에 정확히 뭔지는 모르겠지만 무언가 들어온 것을 우리는 지각이 되었다고 합니다. 꼭 눌러야 하는 버튼이나 꼭 읽어야 하는 문구는 꼭 지각이 되어야겠죠. 그럴려면 사용자가 주로 보는 곳에 위치해야합니다. '어! 이 버튼이 있었는지 모르겠어요, 아무리 찾아도 안내메세지가 보이지 않아요'하는 경우에는 보통 위치가 잘못 선정된 경우가 많습니다. 사용자는 화면을 책 읽듯이 좌측상단부터 꼼꼼히 보지 않습니다. 화면에 들어오자마자 큰 사진을 대충 훑어보면서 직감적으로 원하는 정보만 찾고 바로 이 화면을 빠져 나갑니다.


 그리고 사람들은 본능적으로 관련된 요소끼리는 비슷한 위치에 모여있다고 생각합니다. 상세필터를 적용하고 싶으면 검색이나 돋보기 버튼을 찾고, 결제를 하고싶을 때에는 카드모양이나 장바구니를 찾습니다. 따라서 비슷한 기능을 하는 버튼끼리는 위치상으로 같은 장소에 몰려있어야 잘 지각이 될 수 있습니다.


 다음으로 지각이 되면 그 지각된것의 '시각요소'를 보고 '인지'를 합니다. 만약 어떤 텍스트가 네모 박스로 둘러쌓여있거나 텍스트 밑에 파란 밑줄이 쳐저 있으면, 이 텍스트는 누르면 어디로 이동하는 버튼이구나 라고 인지를 합니다. 만약 우리가 처음 보는 시각요소라면 지각이 되었어도 그게 무엇인지 인지할 수 없습니다. 예를 들어 실제 어떤 나무가 있는데, 그 모습이 구름처럼 하늘에 둥둥 떠있다던가 단순한 박스모양이라면 우리가 생각했던 '나무'라는 시각요소가 아니기 때문에 (생물학적으로 아무리 나무라도) 우리는 나무라고 인지하지 못합니다.


 즉 버튼, 배너, 콘텐츠, 문구 등 이 그 역할에 맞게 시각요소(비주얼패턴)이 적용되어 있어야 사용자가 이것을 누를지, 스크롤하면서 읽을 지, 그냥 가만히 감상할 지 판단을 할 수 있습니다. 요즘 심플하고 단순하게 UI 디자인 하시는 분들이 많은데, 단순한건 좋지만 시각요소(비주얼패턴)을 생략하게 되면 인지하는데 어려움이 생기기 때문에 이 부분을 주의하셔야 합니다.


 사용자가 무언가를 인지하게되면 그것을 사용했던 과거 '기억'을 떠올려서 행동을 합니다. 이부분이 중요합니다. 과거의 기억을 떠올려서 행동한다는 점.


 사실 사용성만 생각한다면 혁신적이고 새로운 디자인보다 많이 봐왔던 친숙한 디자인이 더 좋습니다. 현재 많이들 쓰고 있는 앱의 UI와 비슷하게 만들어 주는 것이 가장 편리합니다. 하지만 그렇게 되면 차별화를 하거나 새로운 도전을 할 수 없겠죠. 따라서 디자인 하실 때 혁신적인 화면 10~15%, 친숙한 화면 85~90%로 비중을 두어 사용자가 큰 어려움 없이 새로움을 접하도록 조정하셔야 합니다. 이 '기억'단계에서는 우리 앱이 다른앱과 비교했을 때 표준성에 너무 어긋나는 점은 없는지 검토해봐야 합니다.


 마지막으로 '행동'입니다. 기억을 떠올렸다면 이제 뭔가 행동을 취하겠죠. 이때 행동하는데 불편함이 없어야 합니다. 버튼이 너무 화면 끝에 있거나, 버튼끼리 너무 붙어있으면 누르는데 불안하고 어려움이 있습니다. 또는 운전중에 사용하는 앱이나 출/퇴근길에 걸어가면서 사용하는 앱인 경우에는 양손으로 세심하게 누르는 행동이 더 어렵습니다. 이때에는 한손 (엄지손가락)으로 조정할 수 있게 버튼의 위치를 바꿔주거나 버튼 대신 스크롤, 스와이프로 조정할 수 있게 해주는 것이 좋습니다.



[02-2]. 두번째 감정적 관점은,

사용성 관련 감정들의 연관성


 사용자가 서비스를 이용하는 전반적인 흐름에서 부정적인 감정이 있는지 찾아보는 것입니다. 감정이라는 단어를 좀 더 구체적으로 나눠서 신뢰도, 이해도, 심미성, 안정성, 호감도가 있는지 파악하고 이를 통해 유용하다고 느끼는지, 재미가 있는지를 알아봅니다. 이 모든 감정이 다 합쳐져서 전반적인 만족도를 파악합니다. 사용자가 느끼는 감정은 사실 매우 다양한 요소에 영향을 받기 때문에 문제 정의와 개선방향을 명확히 하기 어렵습니다. 따라서 이 관점으로 문제를 찾을 때에는 특정 문구나 인포그래픽, 브랜드 컬러, 캐릭터 등으로 시각적 요소를 한정 지어서 문제를 찾는 것이 바람직합니다. 그리고 헬스케어, 교육, 금융과 같은 다소 전문적인 서비스는 신뢰도나 이해도가 사용성에 상대적으로 큰 영향을 미친다는 점도 함께 알아두면 좋습니다.



[02-3]. 상황/맥락적 관점은 인지적 관점만큼 요즘 많이 중요해지는 관점입니다. 

상황/맥락적 관점으로 개선한 예시


 인지적 관점과 감정적 관점은 UX디자이너가 서비스 화면을 보며 문제를 찾는 것이라면, 상황/맥락적 관점은 서비스 외부 환경을 고려해서 문제를 찾는 것입니다. 상황이라는 건 말 그대로 서비스를 이용하는 그 순간을 보는 것입니다. 만약 메세지를 보내는 앱이라면 사용자가 운전 중에는 방해가 되지 않도록 작게 보여주고, 차가 멈춰있을때에는 크게 보여준다면 이 서비스가 더 똑똑해보이겠죠. 화면이 밤에는 다크모드로, 낮에는 화이트모드로 자동으로 바뀌는 것도 같은 예시입니다.


[02-4]. 마지막으로 행동적 관점입니다.

행동적 관점으로 개선한 사례 _ 아마존고


 사용자가 어떤 행동을 할 때 명확한 의도가 있는 경우가 있습니다. 마트에서 어떤 물건을 장바구니에 담는다면 그것을 사겠다는 의도가 있는 것이죠. 그럴경우 장바구니에 담는 즉시 결제를 해주면 쇼핑이 편리할 것입니다. 회의나 업무중에 전화가 울립니다. 그 때 사용자가 핸드폰을 뒤집었다면 그것은 전화를 받지 않겠다는 의도가 있으니, 자동으로 전화가 꺼지고, 상대방에게 문자메세지를 보내주면 완벽하겠죠. 전기매트를 틀고 잤다가 아침에 매트에서 일어나면 (기술적으로는 매트를 누르는 압력이 약해지면) 더이상 누워있는 것이 아니니 몇 분후 자동으로 전기매트가 꺼지게 하는 것도 이 관점으로 개선한 사례에 해당됩니다.




[Outro]. 조금 어려운데, 항상 이 4가지 관점으로 문제를 찾아야 하나요?


 인지적 관점은 UX디자이너로서 업무를 할 때 가장 많이 활용되며 꼭 가져야 하는 관점이니 잊지 마시고 정확히 이해할 필요가 있습니다. 그 외에 감정적, 상황/맥락적, 행동적 이 3가지 관점은 프로젝트마다 주요 문제가 될 수도 있고, 해당사항이 없을 수도 있습니다. 프로젝트의 주요 개성방향을 이해한 후 필요에 따라 적용하시면 됩니다. 만약 너무 복잡하고 어렵다면 '인지적'관점만 기억하셔도 크게 문제는 없습니다. 하지만 이 4가지 관점을 모두 습득하고 활용할 수 있다면 어떤 프로젝트를 하더라도 서비스기획 또는 비쥬얼디자인과 구분되는 본인만의 역할을 명확히 가져가실 수 있을겁니다. 


 조금만 연습해보면 어렵지 않습니다! 오늘부터라도 평상시에 무언가를 사용하다가 불편하다고 느낀다면 어떤 관점으로 해결하면 좋을 지 생각해보는 연습(사실은 습관^^)을 가져보시기 바랍니다.





*입문자를 위한 UX/UI 강의를 1:1 온라인으로 진행하고 있습니다. 

아래 카톡으로 문의주세요. 

http://pf.kakao.com/_xhixcHK

브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari