(DAY12) UIUX 서비스 디자인 기획

 

안녕하세요 :)

오늘은 UXUI 서비스 기획에 대한 부분을 공부했습니다.

PM공부를 했었어서 서비스 기획에 대해 얼추 알고 있었는데요, 공부했을 당시에는 현직 PM분께 배웠었고 지금은 프로덕트 디자이너에게 배우니까 또 다른 느낌으로 다가오더라구요. 어느 직무(역할)의 시선에서 기획하는가에 따라 조금씩 다르다는 것을 배웠습니다.

 

---

 

 

 

 

✏️오늘의 학습

서비스 디자인 기획, 문제 발견 단계 알아보기

피그마로 와이어프레임 그려보기

실습 1) 나의 일상에서 문제점 수집, 현황파악 해보기

실습 2) 앱 서비스 하나 선정해서 와이어프레임 그려보기

 

 

 

 

📖 오늘의 핵심

모든 서비스는 사용자의 문제해결을 위해 태어났다.

지금 이 순간의 중요성. 현재에 집중하는 것.

 

 

 

 

 

" 다른사람들의 행동을 문제삼는 것(타인의 행동을 라벨링하는 것)을 그만둬라. 맑은 눈으로(있는 그대로) 상대를 봐라.
문제가 무엇인지 모른다면 어떻게 옳게 해결하는지도 모른다. "
(렛뎀 이론 中)

 

 

 

 

 

📝수업 내용 메모장

 

UXUI서비스 디자인 기획
모든 서비스는 사용자의 문제해결을 위해 태어났다.
배민 B마트 : '추운겨울, 집 앞 슈퍼도 나가기 싫다'에서 시작함
토스 : 공인인증서 없이 돈을 송금할 수 없을까?

 

서비스 디자인 기획
1. 문제 발견 단계
문제점 수집 : 페인포인트(Pain Point)를 파악한다.  
Tip, 핵심 포인트는 본인이 서비스를 이용할 때 발생하는 불편 지점을 찾는다.

주제 선정
수집한 문제점들에서 공통적인 부분을 찾아내거나 해결할 가치가 높은 요소들을 정해 주제를 선정한다.
(기술적인 문제를 고려해서 현재 시점으로 지금 당.장. 불편한 점을 생각하는게 좋다.)

현황 파악
선정한 주제에서 문제가 발생한 원인을 찾아보는 과정.
모든 문제에 접근할 때 'Why'로 접근하기. 근본적인 목적을 설정해야 함.

2. 문제 정의
가설설정
해결이 필요한 핵심적인 문제를 정의하여 서비스를 제공하는 목적을 설정하는 단계.
즉, 가장 원천적으로 해결하려는 문제가 무엇인지 정의한다.

프로젝트 정의
서비스를 통해 해결하고자 하는 문제와 제품 또는 서비스에 대한 간략한 요약과 설명을 작성하기
당근마켓 - 택배 멀리 보낼때 너무 무거워. 불편해.

멀다의 반대 = 가깝다. 그럼 가까운 동네에서 거래를 해볼까? (이게 프로젝트 정의)

 

💡인사이트 : 문제점(불편한 점)의 반댓말을 생각해보기

 

3. 사용자 시나리오의 이해 및 페르소나 설정
여정
사용자가 서비스를 경험하는 단계를 순서대로 작성하는 과정으로 상황은 구체적일수록 좋다.

페르소나 설정
선정한 주제를 바탕으로 사용자 시나리오에 필요한 가상의 인물을 설정한다.
사용자 입장이 되어보는 게 아니라, 사용자를 만들어놓고 그 사람을 이해하려고 하는 것.

테스크플로우 작성하기
작성한 사용자 시나리오를 바탕으로 사용자들이 목표를 달성하려고 하는 행동을 순서대로 정리한다.
화면 단으로 유저의 행동을 구체화 하는것

IA와 테스크 플로우의 차이
IA는 기능/ 테스크 플로우는 행동 위주

 

 

 

💡내가 이해한 방식
테스크플로우는 기능만을 생각하고 구상한다.
(사용자 동선 생각 안하고 정말 필요한 기능 위주로 나열)
유저플로우는 사용자 여정에 초점을 맞춰서 구상한다.

 

 

 

와이어프레임의 이해
IA를 기준으로 IA내용을 구조화하는 것

 

💡와이어프레임 만들고, 화면에서 공통되는 부분을 파악해서 컴포넌트를 만든다.
ex) 우리는 태깅이 많네? 태그 컴포넌트 만들어야겠다. 

 

페이지 플로우
각 테스크에 필요한 기능을 나열

플로우차트 = 워크플로우라고 흔히 말함
경우의 수 다 만들기
ex) 어떤 화면에서 어디로 이동하고..등등

모든 유형의 흐름을 계획하여 사용자의 여정을 이해하려고 한다.

 

 

---

< UI 레퍼런스 사이트 추천 >

uibowl 유아이볼
https://uibowl.io/
ui 레퍼런스 사이트 (유료임..무료는 3개까쥐)

mobbin
https://mobbin.com/discover/apps/ios/latest

 

 

실습 1) 서비스 디자인 기획의 '문제 발견' 단계 써보기

나의 일상에서 문제점 수집, 현황파악 해보기

문제발견 예시

 

 

 

문제 발견 (평소 겪었던 나쁜 경험)	주제 선정 (경험 中 해결할 가치 높은 요소 정하기)	현황 파악 (문제 발생 원인 파악하기)
즐거운 소비를 기대하고 들어갔다가 기분이 나빠진 경험 : 인스타그램 릴스 시청		영상 문맥 파악의 어려움
인스타그램 릴스(짧은 영상)를 들어가서 영상을 보다가, 그 영상이 재밌을 때 댓글을 확인하게 되는데, 댓글 보면 콘텐츠와 상관없는 문맥으로 사람들이 서로 싸우고 있음.	→ 이건 나만 기분 나빠지나?     (판단이 어려워서 주제 선정 X)	A가 콘텐츠 내용 중에 모르는 말이 나오면 찾아보지 않고 바로 댓글을 달며 물어봄. → B가 바보냐고 갑자기 화를 냄. A와B가 갑자기 댓글로 싸움. → 다른 사람들도 와서 같이 싸움(?)
릴스 화면 스크롤해서 내리다가 보고 싶지 않은 영상이 내 의지와 상관없이 등장함 (ex 공포영상)	☑️기분 나쁜 경험의 반복      → 앱 이미지로 이어질 수 있음	1)내가 좋아할 만한 새로운 콘텐츠를 탐색시켜 주려고 의도적으로 다른 장르를 노출시킴. 2)지금 릴스에서 많은 사람들이 보는 영상이 있으면, 나랑 관련 없더라도 가끔 보여줌. 3) 내가 본 영상 중에 어두운 배경, 비명 소리 등 공포영상에 들어가는 요소와 비슷한 요소가 들어가면 함께 추천될 수 있음.

 

 

💡 느낀점

생각보다 자유롭게 작성하는게 어려웠다.

내가 평소에 뭐가 불편하지..? 어떤 앱을 자주 썼더라..? 인스타그램에 일상 올리고, 네이버 블로그에 일상 올리고, 여기(티스토리)에 공부글 올리고...늘 생산성 있는 글/그림을 쓰고 그리고 올리는 것 밖에 안하는구나..(가끔 친구들과 게임하고) 내 일상을 돌아보는 시간이었다.

 

그래도 요즘 가장 많이 시간을 보내는 건 인스타그램으로 내 주변사람들 잘 살고 있나 보는 것, 자기 전에 릴스 조금 소비하는 것 정도?만 생각이 나서 '인스타그램 릴스 시청 상황에서 문제 발견하기' 로 소주제를 잡고 실습을 진행했다.

 

인스타 릴스 댓글에서 콘텐츠 내용과 상관없이 싸우는 상황을 자주봐서 불편했던 경험을 적었는데,

멘토님의 피드백은 렛뎀(Let them)해라였다ㅋㅎㅎㅋㅋㅋㅋㅋㅋㅠㅠㅠ

 

나는 강아지 관련 릴스를 즐겨 소비하는 편인데, 나의 힐링 시간을 댓글싸움이 방해하는게 싫었다. 분명 나처럼 이걸 불편해하는 사용자가 있을거라고 생각했고, 이걸 문제점으로 설정하고 서비스 기능적으로 풀어낼 수 있을거라고 생각했다.

 

예를 들면,

A가 콘텐츠 내용 중에 모르는 말이 나오면 찾아보지 않고 바로 댓글을 달며 물어봄.
→ B가 바보냐고 갑자기 화를 냄.
A와B가 갑자기 댓글로 싸움.
→ 다른 사람들도 와서 같이 싸움(?)

이 상황에서는 [영상 내용에서 모르는 단어가 나오는데 찾아보기 귀찮아서 댓글에 물어봄] 이 문제가 발생한 원인이 될 수 있고, 그럼 릴스 영상 맥락을 요약해서 간단하게 이해를 돕는 기능 (ex 카카오톡 단톡방 3줄요약 기능) 으로 풀어낼 수 있을거라고 생각했다.

그런데 피드백이 그냥 렛뎀해라. 여서 사실 당황했다 ;

 

 

 

 

 

 

 

 

 

실습 2) 피그마로 와이어프레임 그려보기

 

선정한 앱 : 써브웨이 패스트썹 App

최근에 리뉴얼된 써브웨이앱 분석할 겸 캡쳐해둔 화면이 있어서 이걸로 선정해서 진행했습니다.

 

 

 

실습 결과물

 

 

 

 

 

💡느낀점

예쁘게 그리려고 하다가 본질을 놓쳤다..
와이어프레임은 IA의 기능들을 기준으로 그리는 거고, '소통을 위해' 그리는 것이기 때문에 어떤 기능인지 간단하게라도 설명이 필요하다는 피드백을 받았다. 작업하다보면 나도모르게 똑같이 따라 그리는것에 몰두하고 있는 나를 발견한다...ㅠ

와이어프레임과 사랑에 빠지지 말자,,,

 

그리고 페이지 10장 그리는게 실습과제인줄 알고 열심히 그렸는데, 멘토님이 5장만 보고 피드백해주셨다ㅠㅠ 아쉬웠다.

와이어프레임을 그릴 땐 lo-fi의 경우, 색상을 최대한 빼고 그리는 걸 추천하셨다. 간혹 다른 이해관계자와 소통할 때 오해를 살수도 있다고 한다. ex) "여기다가 이 색상을 쓴다는 건가요?"