brunch

You can make anything
by writing

C.S.Lewis

by 기획자 첼라 Feb 18. 2024

UX설계, 첫번째 :: 서비스 핵심 기능의 UX 설계

프로젝트를 진행하는데 있어서 서비스 플로우의 중요도는 백번을 강조해도 부족함이 없습니다. 

특히나 우리는 이 과정을 통해서 하나의 서비스가 사용자에게 제공되기 위해서 필요한 DB, 외부 시스템 등에 대해서 사전 파악을 할 수 있습니다.

또한 이로 인해서 발생할 수 있는 다양한 케이스를 산출할 수 있습니다. 


서비스의 핵심 기능을 사용자에게 제공하기 위하여 필요한 흐름이 그렇게 정의되었다면, 이제는 UX설계 단계에 진입할 수 있습니다. 




주요 서비스/기능의 진입점

예를들어 송금 기능에 대한 서비스 플로우를 제작한다고 가정해봅시다. 


Toss 송금하기 진입점


토스의 송금 기능을 먼저 살펴보겠습니다. 


첫번째, 홈 화면에서 접근해서 내가 등록한 계좌 중 하나를 선택하여 송금을 실행할 수 있습니다.

두번째, 등록한 계좌번호를 클릭해서 계좌의 상세 정보가 제공되는 곳에서 송금(보내기) 버튼을 선택해 송금을 실행할 수 있습니다. 



모니모 송금하기 진입점


모니모의 경우

첫번째, 투데이 화면 상단에 위치한 송금 기능 버튼을 선택해서 진입할 수 있습니다. 

두번째, 마이라는 메뉴로 진입한 수 등록한 계좌에서 송금 버튼을 선택해서 진입할 수 있습니다. 


우리 서비스에서 사용자에게 핵심적으로 제공하고 싶은 기능이 송금이라면  메인 화면에서 바로 진입할 수 있도록 제공하는 것이 좋습니다.  즉, 송금을 해야한다면 우리 서비스를 바로 떠올릴 수 있도록 구조를 설정하는 것이 가장 우선이 되어야 합니다. 

토스, 모니모 모두 앱에 진입하자마자 바로 핵심 기능을 사용할 수 있는 구조로 설계가 되어있습니다.  두 서비스 모두 사용자에게 뱅킹 서비스를 제공하는 것이 주목적이라는 점에서 봐서 이러한 설계가 고려된 것을 알 수 있습니다. 



코어 서비스의 플로우 분석 및 편의기능 산출하기

서비스의 메인 기능을 어디에 배치하고 어떻게 쉽게 진입할 수 있게 할 것인지를 정의했다면, 해당 기능의 전체 사용 플로우(흐름)을 살펴봐야 합니다.  위의 예시로 들었던 송금 기능이 우리 서비스의 핵심이라고 가정해봅시다.  

위의 두 서비스처럼 송금, 보내기 등의 버튼을 선택한 후에 필요한 것은 무엇이 있을까요? 

순서와 상관없이 꼽아본다면 아래와 같은 액션들이 필요합니다. 

  

    송금을 보낼 은행, 계좌번호를 입력한다.  

    송금할 금액을 입력한다.   

    송금을 실행한다.   



그리고 정확한 송금 실행을 하기 위해서는 각 액션을 실행할 때마다 검증이 필요합니다. 



검증이 필요한 사항들, 그리고 그 검증을 실행할 시스템, 검증 결과에 따라서 이동할 화면이나 메시지에 대해서는 서비스 플로우를 통해서 1차 정의를 완료했습니다.  

UX 설계에서는 이와 더불어 사용자의 주된 사용 패턴과 편의성을 고려해야 합니다. 

실제 송금이 필요한 상황을 가정해봅시다. 

Ex. 친구와 함께 점심식사를 한 후 친구가 결제한 식사비용의 50% 

      11,000원을 친구의 계좌로 송금해야 한다. 

친구의 은행, 계좌번호, 송금할 금액을 문자 메시지나 카카오톡 등을 통해서 전달 받는 경우가 많을 것입니다. 그 정보를 받은 "나"는 친구가 발송한 메시지를 복사해서 송금이 가능한 앱에서 해당 정보를 입력할 것입니다. 가장 많은 경우의 수로 발생할 수 있는 케이스임으로 복사한 정보가 있는 경우 우리 서비스에서 바로 붙여넣기를 실행할 수 있는 기능으로 편의성을 제공할 수 있습니다. 


하지만 모든 사람들이 송금을 요구할때 

xx은행

123-456578-9

11,000원 

위와 같이 정보를 보낸다고 가정할 수는 없습니다.  

여기서도 많은 경우의 수가 발생할 수 있습니다. 

xx, 123456789

만천원

만약 위와 같은 정보를 받았다면 우리가 활용할 수 있는 것은 계좌번호 정도가 될 수 있습니다.  

금융사의 명칭의 경우 정식 명칭과 약식 명칭이 구분되어 있기 때문에 복사한 정보가 정확한 정보로 판단할 수 없는 단점이 있습니다. 

(Ex. kb국민은행, 국민) 

그렇다면 위와 같은 정보를 복사한 상태라면 연속된 숫자는 자동 입력할 수 있도록 제공하되, 금융사는 사용자가 직접 선택하는 UX를 정의할 수 있습니다. 

즉, 서비스 플로우를 통해서 연계된 플로우를 진행하면서 발생할 수 있는 케이스를 산출한다면 UX설계를 진행하는 과정에서는 편의 기능, 사용자의 액션 등 조금 더 세분화된 케이스를 산출할 수 있습니다.  






UX설계를 진행하면서 산출하는 특정한 산출 문서는 없습니다. 

개인적으로는 특정한 서식의 문서를 만들기 보다는 큰 틀에서의 레이아웃을 설계하고 핵심 기능을 사용자가 경험하는 과정의 와이어프레임을 스케치합니다.  이 과정을 거쳐 핵심 기능을 제공하는데 있어서의 서비스 컨셉이 도출되는 경우가 많습니다. 

한번에 하나의 정보만 입력(은행 선택, 다음 페이지 이동하여 계좌번호 입력)하도록 한다. 

혹은 한 페이지에서 모든 정보를 한번에 입력할 수 있도록 제공한다. 

UX의 가장 큰 컨셉이 이렇게 도출되고나면 서비스를 구성하는 다른 화면 역시 메인 컨셉을 따라 구성되는 경우가 많습니다. 

이러한 UX컨셉을 도출한데 있어서는 유사 서비스를 많이 사용해보면서 테스트해보는 것이 좋습니다. 

최대한 많은 서비스를 사용해보면서 공통점과 차이점을 도출하면 동일 기능을 제공하는데 있어서의 제약 사항, 개선 사항을 도출하기 쉽습니다. 





https://www.letapefigma.com

#서비스기획강의 #UX강의 #서비스기획 #figma #피그마 #웹기획 #웹기획강의 #웹기획자 #레탑피그마


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