Speaker 1

Speaker 2

Speaker 3

advice

baby

book

brain

chat

cs_work

ctrlF

curious

done

down

dust

enter

feargif

find

find_transaction_50000_2

gif45

gif55

go_to_section_2

happy

happyheart

hard

headache

heart

heartgif

history_input _after_still

history_input _alpha

history_input _before1

history_input _before2

history_input _fail

internal tools_1

internal tools_2

internal tools_3

internal tools_4

many_result_tossmoney

many_tab

memo

monitor

nervous

notice_best

notice_worst

one_mvp_1

one_mvp_2

please

profile1

profile2

repeat_notice_1

repeat_notice_2

repeat_notice_3

scream

scroll

search_after_still

search_prototype

sleepy

sweat

tear

thinking

toss_appicon

trashcan

vivamng_full_screen_open

wait

what

workhard

Simplicity 23, 이번 세션에서는
 토스팀에서 :tag[고객상담]{start="00;00;03;20" color="rgba(255, 255, 255, 1)"}을 하시는
 :color[팀원 분들을 위한 제품]{start="00;00;04;27"}을
이야기해보려고 해요. 

Simplicity 23, 이번 세션에서는 토스팀에서 
:tag[고객상담]{start="00;00;03;20" color="rgba(255, 255, 255, 1)"}을 하시는 :color[팀원 분들을 위한 제품]{start="00;00;04;27"}을
이야기해보려고 해요. 

토스에는 :color[사용자분들 문의]{start="00;00;08;16"}만
 전문적으로 하시는 :footnote[CX팀]{note="토스씨엑스는 토스 계열사가 제공하는 금융 서비스 상담에 집중하며, 비대면 고객 상담을 전문으로 하고 있어요."}이 
있는데요. 하루에도 몇 천건씩 
들어오기 때문에 이 문의를
 :tag[빠르고 정확하게]{start="00;00;15;17" color="rgba(255, 255, 255, 1)"} 해결하는게 
되게 :questionMark[중요하겠죠]{start="00;00;17;24"}

토스에는 :color[사용자분들 문의]{start="00;00;08;16"}만 전문적으로 하시는 
:footnote[CX팀]{note="토스씨엑스는 토스 계열사가 제공하는 금융 서비스 상담에 집중하며, 비대면 고객 상담을 전문으로 하고 있어요."}이 있는데요. 하루에도 몇 천건씩 들어오기 
때문에 이 문의를 :tag[빠르고 정확하게]{start="00;00;15;17" color="rgba(255, 255, 255, 1)"} 해결하는게 
되게 :questionMark[중요하겠죠]{start="00;00;17;24"}

이 CX팀원 분들을 위한 제품을
 디자인하시는 :inline[오지은님]{start="00;00;21;20" asset="Speaker 2"}, 그리고
 제품을 사용하는 사용자인
 CX팀 :inline[한주연님]{start="00;00;25;05" asset="Speaker 3"}과 이야기 
나눠볼게요. 

이 CX팀원 분들을 위한 제품을 디자인하시는 
:inline[오지은님]{start="00;00;21;20" asset="Speaker 2"}, 그리고 제품을 사용하는 사용자인 
CX팀 :inline[한주연님]{start="00;00;25;05" asset="Speaker 3"}과 이야기 나눠볼게요. 

:waa[와~ 안녕하세요]{start="00;00;27;09"} 

안녕하세요.
 인터널 프로덕트 디자이너
 오지은이에요. 

안녕하세요. 인터널 프로덕트 디자이너 오지은이에요. 

안녕하세요. 저는 토스CX의
 코어CX팀 리더 한주연입니다. 

안녕하세요. 저는 토스CX의 코어CX팀 리더 한주연입니다. 

오늘 지은님이 소개해주실
 이야기는 :questionMark[어떤 내용이에요]{start="00;00;41;06"} 

오늘 지은님이 소개해주실 이야기는 :questionMark[어떤 내용이에요]{start="00;00;41;06"} 

저는 오늘 :color[전문가분들]{start="00;00;43;06"}이
 일할 때 쓰는 제품을 만들면서
 느끼고 배웠던 점을
 공유해 드리고 싶어요. 

저는 오늘 :color[전문가분들]{start="00;00;43;06"}이 일할 때 쓰는 제품을 만들면서 
느끼고 배웠던 점을 공유해 드리고 싶어요. 

좀 쉽게 상상해 봤을 때
 우리가 일하면서 맨날 쓰는
 툴이 있어요. 그런데 그런 게
 버튼 하나만 바뀌어도
 :inline[불편]{start="00;00;58;18" asset="sweat"}하잖아요. 

좀 쉽게 상상해 봤을 때 우리가 일하면서 맨날 쓰는 
툴이 있어요. 그런데 그런 게 버튼 하나만 바뀌어도 
:inline[불편]{start="00;00;58;18" asset="sweat"}하잖아요. 

제가 오늘 설명 드릴,
 제가 맡은 제품은 CX팀원 분들이
 일하면서 매일 쓰시는 제품인데
 또 :popup[개선]{start="00;01;07;02" asset="fix"}할 건 진짜 엄청 많았어요.
 근데 이걸 다 개선하려면
 그 분들 업무에 지장이
 :color[더 크게 오는]{start="00;01;13;23"} 상:bb[황이었던 거예요]{start="00;01;14;29"} 

제가 오늘 설명 드릴, 제가 맡은 제품은 CX팀원 분들이 
일하면서 매일 쓰시는 제품인데 또 :popup[개선]{start="00;01;07;02" asset="fix"}할 건 진짜 
엄청 많았어요. 근데 이걸 다 개선하려면 그 분들 업무에 
지장이 :color[더 크게 오는]{start="00;01;13;23"} 상:bb[황이었던 거예요]{start="00;01;14;29"} 

맞아요. 상담하면서 좀
 정보를 :color[빨리 찾으려고]{start="00;01;18;14"}
 :footnote[토스원]{note="CX 팀원들이 상담할 때 필요한 고객 정보를 확인하고 업무를 처리하는 제품이예요."}에 있는 정보나 버튼의
 위치를 대부분 팀원들이
 :tag[기억]{start="00;01;23;16" color="rgba(255, 255, 255, 1)"}을 하고 있어요. 

맞아요. 상담하면서 좀 정보를 :color[빨리 찾으려고]{start="00;01;18;14"} 
:footnote[토스원]{note="CX 팀원들이 상담할 때 필요한 고객 정보를 확인하고 업무를 처리하는 제품이예요."}에 있는 정보나 버튼의 위치를 대부분 
팀원들이 :tag[기억]{start="00;01;23;16" color="rgba(255, 255, 255, 1)"}을 하고 있어요. 

근데 제품에 변화가 생기면
 또 바뀐 내용을 파악하느라
 :tag[헤매는 시간]{start="00;01;28;26" color="rgba(255, 255, 255, 1)"}이 생기고, 그게
 고객님께 응대하는데에 있어
 :inline[지연]{start="00;01;32;26" asset="wait"}이 되고 있으니까
 상담 만족도가 조금
 :bb[떨어졌던 것 같아요.]{start="00;01;35;28"} 

근데 제품에 변화가 생기면 또 바뀐 내용을 
파악하느라 :tag[헤매는 시간]{start="00;01;28;26" color="rgba(255, 255, 255, 1)"}이 생기고, 그게 고객님께 
응대하는데에 있어 :inline[지연]{start="00;01;32;26" asset="wait"}이 되고 있으니까 
상담 만족도가 조금 :bb[떨어졌던 것 같아요.]{start="00;01;35;28"} 

그래서 개선을 해주시는 건
 당연히 너무 좋은데 그런 변화에
 좀 :xmark[자연스럽게 녹아들 상황]{start="00;01;41;14"}이
 만들어지지는 않았던 것 같아요. 

그래서 개선을 해주시는 건 당연히 너무 좋은데 
그런 변화에 좀 :xmark[자연스럽게 녹아들 상황]{start="00;01;41;14"}이 
만들어지지는 않았던 것 같아요. 

맞아요. 그래서 이런 상황으로
 인해서 변화에 :color[민감할 수 밖에 없는]{start="00;01;49;05"}
 상황에 놓인 CX같은
전문 사용자 분들을 위해서
 제품이 어떻게 :questionMark[변화할 수 있을까]{start="00;01;56;06"} 
오늘 그 방법들을 이야기
 해보려고 해요. 

맞아요. 그래서 이런 상황으로 인해서 변화에 
:color[민감할 수 밖에 없는]{start="00;01;49;05"} 상황에 놓인 CX같은
전문 사용자 분들을 위해서 제품이 어떻게 
:questionMark[변화할 수 있을까]{start="00;01;56;06"} 오늘 그 방법들을 이야기 
해보려고 해요. 

이야기 들어보면 확실히 좀
 :inline[어렵게]{start="00;02;03;08" asset="thinking"} 느껴지는데요.
 아마 B2B 서비스 디자인하시는
 디자이너분들도 되게 많이
 :inline[공감]{start="00;02;08;28" asset="happy"}할 :speakBubble[수]{data='[{"speaker":"Speaker 2", "start":"00;02;09;12", "text":" 맞아요"}]'} 있을 것 같아요.

이야기 들어보면 확실히 좀 :inline[어렵게]{start="00;02;03;08" asset="thinking"} 느껴지는데요. 
아마 B2B 서비스 디자인하시는 디자이너분들도 
되게 많이 :inline[공감]{start="00;02;08;28" asset="happy"}할 :speakBubble[수]{data='[{"speaker":"Speaker 2", "start":"00;02;09;12", "text":" 맞아요"}]'} 있을 것 같아요.

이 문제가 사실 저도 처음부터
 많이 해 본 것도 아니었으니까
 당시에 너무 :popup[어렵게]{start="00;02;16;21" asset="hard"}
 느껴지더라고요. 

이 문제가 사실 저도 처음부터 많이 해 본 것도 
아니었으니까 당시에 너무 :popup[어렵게]{start="00;02;16;21" asset="hard"} 느껴지더라고요. 

:questionMark[그러면 어떻게 해결했어요]{start="00;02;18;20"} 

사실 배우면서 느낀 점은
 대대적으로 :exclamationMark[뭔가를 딱]{start="00;02;23;19"}
크게 하는 것보다는
 작은 개선들을 :tag[꾸준히]{start="00;02;28;08" color="rgba(255, 255, 255, 1)"} 하는 게
 저는 도움이 되고 이 씬에선
 사실 그게 더 :tag[적합]{start="00;02;33;19" color="rgba(255, 255, 255, 1)"}하더라고요. 

사실 배우면서 느낀 점은 대대적으로 :exclamationMark[뭔가를 딱]{start="00;02;23;19"}
크게 하는 것보다는 작은 개선들을 :tag[꾸준히]{start="00;02;28;08" color="rgba(255, 255, 255, 1)"} 하는 게 
저는 도움이 되고 이 씬에선 사실 그게 더 :tag[적합]{start="00;02;33;19" color="rgba(255, 255, 255, 1)"}하더라고요. 

그래서 한꺼번에 고치려고
 한 번에 하려고 해서 :xmark[잘 된 적]{start="00;02;38;13"}은
 진짜 한 번도 없었어요. 

그래서 한꺼번에 고치려고 한 번에 하려고 해서
:xmark[잘 된 적]{start="00;02;38;13"}은 진짜 한 번도 없었어요. 

한 번에 하면 너무 :popup[좀]{start="00;02;43;02" asset="headache"} 아찔한데요. 

사용자분들 입장에서
 한 번에 막 바뀐다고 생각하면
 좀 :inline[무서운]{start="00;02;48;07" asset="scream"} 일인데,
 제가 시도했던 개선들마다
 방법이 조금씩 달라서
 그 사례들을 중심으로
 이야기를 해볼게요. 

사용자분들 입장에서 한 번에 막 바뀐다고 생각하면 
좀 :inline[무서운]{start="00;02;48;07" asset="scream"} 일인데, 제가 시도했던 개선들마다 
방법이 조금씩 달라서 그 사례들을 중심으로 이야기를 
해볼게요. 

:questionMark[어떤건지 궁금한데요]{start="00;02;55;11"} 

:popup[궁금하시죠?]{start="00;02;57;24" asset="curious"} 

먼저 사용자를 직접 :color[짧게라도]{start="00;03;00;28"}
 만나는 게 우리 메이커분들이,
 그렇게 하는 게 사실 :tag[중요한 거구나]{start="00;03;05;08" color="rgba(255, 255, 255, 1)"}
 하는 배움을 제가 얻었거든요. 

먼저 사용자를 직접 :color[짧게라도]{start="00;03;00;28"} 만나는 게 우리 
메이커분들이, 그렇게 하는 게 사실 :tag[중요한 거구나]{start="00;03;05;08" color="rgba(255, 255, 255, 1)"} 
하는 배움을 제가 얻었거든요. 

그 일례로 제가 코어CX분들이
 :color[상담 내용]{start="00;03;11;01"} :color[기록하는 경험]{start="00;03;11;26"}을
 :tag[개선]{start="00;03;13;08" color="rgba(255, 255, 255, 1)"}을 했던 적이 있어요.
이 경험을 개선하는 건
 업무 효율을 높이는 임팩트가
 되게 큰 일이었어요. 

그 일례로 제가 코어CX분들이 :color[상담 내용]{start="00;03;11;01"}
:color[기록하는 경험]{start="00;03;11;26"}을 :tag[개선]{start="00;03;13;08" color="rgba(255, 255, 255, 1)"}을 했던 적이 있어요.
이 경험을 개선하는 건 업무 효율을 높이는 
임팩트가 되게 큰 일이었어요. 

맞아요. :tag[상담 내역]{start="00;03;22;14" color="rgba(255, 255, 255, 1)"}은 
상담하면 :flip[무조건 기록]{start="00;03;23;27"}을
 해야 되기 때문에
 상담 :inline[중]{start="00;03;26;23" asset="wait"}이나 또는
 상담이 끝난 :inline[후]{start="00;03;28;12" asset="done"}에 모든 상황에서
 일어나는 일이니까 굉장히
 좀 :color[사용 빈도가 높았죠.]{start="00;03;31;25"} 

맞아요. :tag[상담 내역]{start="00;03;22;14" color="rgba(255, 255, 255, 1)"}은 상담하면 :flip[무조건 기록]{start="00;03;23;27"}을 
해야 되기 때문에 상담 :inline[중]{start="00;03;26;23" asset="wait"}이나 또는 상담이 끝난 :inline[후]{start="00;03;28;12" asset="done"}에 
모든 상황에서 일어나는 일이니까 굉장히 
좀 :color[사용 빈도가 높았죠.]{start="00;03;31;25"} 

맞아요. 그래서 이렇게
 빈도 높은 일, 그리고
 많은 사용자들이 하시는 일인데 
사실 처음에는 이걸 개선할 때
 :xmark[지켜보지 않고]{start="00;03;42;08"} 이 사용자분들을
 :xmark[본 적도 없이]{start="00;03;44;29"} 이런 식으로
 제품을 개선하려고 했었어요. 

맞아요. 그래서 이렇게 빈도 높은 일, 그리고 
많은 사용자들이 하시는 일인데 사실 처음에는 이걸 개선할 때 
:xmark[지켜보지 않고]{start="00;03;42;08"} 이 사용자분들을 :xmark[본 적도 없이]{start="00;03;44;29"} 
이런 식으로 제품을 개선하려고 했었어요. 

음, 이거는 이제 뇌피셜
 디자인인거군요! 

음, 이거는 이제 뇌피셜 디자인인거군요! 

:zzz[네, 뇌피셜 디자인]{start="00;03;52;19"} 

아 근데 이것도 괜찮아 보이는데
 어떤 문제가 :questionMark[있었어요]{start="00;03;57;15"} 

아 근데 이것도 괜찮아 보이는데 어떤 문제가
:questionMark[있었어요]{start="00;03;57;15"} 

맞아요. 이거는 상담입력창을
 한쪽에 항상 열어두고
 쓰실 수 있게 :tag[새 창]{start="00;04;03;29" color="rgba(255, 255, 255, 1)"}으로 띄워서
 보여주는 시안이었어요.
일하실 때 모니터 두 :inline[개]{start="00;04;09;08" asset="monitor"} :inline[]{start="00;04;09;08" asset="monitor"}
 있고 하시니까?
 근데 사실 이 시안은 결국
 :xmark[선택]{start="00;04;13;22"}을 하지 않게 됐어요. 

맞아요. 이거는 상담입력창을 한쪽에 항상 열어두고 
쓰실 수 있게 :tag[새 창]{start="00;04;03;29" color="rgba(255, 255, 255, 1)"}으로 띄워서 보여주는 시안이었어요.
일하실 때 모니터 두 :inline[개]{start="00;04;09;08" asset="monitor"} :inline[]{start="00;04;09;08" asset="monitor"} 있고 하시니까? 
근데 사실 이 시안은 결국 :xmark[선택]{start="00;04;13;22"}을 하지 않게 됐어요. 

왜냐하면 이제 CX분들
 상담하시는 모습을 :inline[지켜보기도]{start="00;04;20;20" asset="eye"} 
하고 :inline[인터뷰]{start="00;04;22;01" asset="chat"}를 많이 했어요.
그러면서 :tag[몇 가지 특징]{start="00;04;24;20" color="rgba(255, 255, 255, 1)"}을
 알게 됐거든요. 

왜냐하면 이제 CX분들 상담하시는 모습을 
:inline[지켜보기도]{start="00;04;20;20" asset="eye"} 하고 :inline[인터뷰]{start="00;04;22;01" asset="chat"}를 많이 했어요.
그러면서 :tag[몇 가지 특징]{start="00;04;24;20" color="rgba(255, 255, 255, 1)"}을 알게 됐거든요. 

먼저, 자신이 찾으려는 정보 위치를
 다 기억을 하고 계시니까
 :inline[눈으로]{start="00;04;32;04" asset="eye"} 이걸 빨리 찾을 수
 있었으면 좋겠다고
 생각하시는 거예요.그래서
 많은 정보가 :color[한눈에 보여야]{start="00;04;38;24"}
 눈으로 :exclamationMark[딱]{start="00;04;40;15"} 빨리 찾을 수가
 있는 거죠. 

먼저, 자신이 찾으려는 정보 위치를 
다 기억을 하고 계시니까 :inline[눈으로]{start="00;04;32;04" asset="eye"} 이걸 빨리 찾을 수 
있었으면 좋겠다고 생각하시는 거예요.
그래서 많은 정보가 :color[한눈에 보여야]{start="00;04;38;24"} 눈으로 :exclamationMark[딱]{start="00;04;40;15"} 
빨리 찾을 수가 있는 거죠. 

그리고 상담하는 :inline[중]{start="00;04;45;02" asset="wait"}에는
 중요한 :inline[메모]{start="00;04;46;13" asset="memo"}를 메모장에
 적어가면서 고객님들이랑
 대화하고 또 상담 :inline[끝나면]{start="00;04;51;22" asset="done"}
 그걸 아까 말씀해 주셨던
 상담내용 입력 :inline[창]{start="00;04;56;04" asset="monitor"}에다가
 :speakBubble[옮겨]{data='[{"speaker":"Speaker 3", "start":"00;04;57;06", "text":" 맞아요"}]'} 적고. 

그리고 상담하는 :inline[중]{start="00;04;45;02" asset="wait"}에는 중요한 :inline[메모]{start="00;04;46;13" asset="memo"}를 메모장에 
적어가면서 고객님들이랑 대화하고 또 상담 :inline[끝나면]{start="00;04;51;22" asset="done"} 
그걸 아까 말씀해 주셨던 상담내용 입력 :inline[창]{start="00;04;56;04" asset="monitor"}에다가 
:speakBubble[옮겨]{data='[{"speaker":"Speaker 3", "start":"00;04;57;06", "text":" 맞아요"}]'} 적고. 

그리고 추가적인 거래 내역이나
 :color[여러 가지 정보]{start="00;05;00;24"}를 보면서
 적어야 되니까 화면 :popup[스크롤]{start="00;05;04;15" asset="scroll"}을
 많이 내리면서 :tag[왔다갔다]{start="00;05;06;17" color="rgba(255, 255, 255, 1)"}하는
 경우가 굉장히 많아요. 

그리고 추가적인 거래 내역이나 :color[여러 가지 정보]{start="00;05;00;24"}를 
보면서 적어야 되니까 화면 :popup[스크롤]{start="00;05;04;15" asset="scroll"}을 많이 내리면서 
:tag[왔다갔다]{start="00;05;06;17" color="rgba(255, 255, 255, 1)"}하는 경우가 굉장히 많아요. 

맞아요. 그래서 스크롤
 :inline[위]{start="00;05;11;02" asset="up"}:inline[아래]{start="00;05;11;06" asset="down"}로
 막 왔다갔다 하시는 것도
 많이 관찰하고 그랬었어요. 

맞아요. 그래서 스크롤 :inline[위]{start="00;05;11;02" asset="up"}:inline[아래]{start="00;05;11;06" asset="down"}로 막 왔다갔다
하시는 것도 많이 관찰하고 그랬었어요. 

게다가 그런 상황에서
 여러 :inline[창]{start="00;05;17;09" asset="monitor"}을 켜놓고
 이 일을 하시니까 정보를 보는 창
 :inline[아래에]{start="00;05;20;28" asset="down"} 입력하는 창이
 가려지면 되게 찾기
 어려워 하셨거든요.
:xmark[선택하지 않았던]{start="00;05;25;21"} 가장 큰 이유는
 이거였는데,

게다가 그런 상황에서 여러 :inline[창]{start="00;05;17;09" asset="monitor"}을 켜놓고 이 일을 
하시니까 정보를 보는 창 :inline[아래에]{start="00;05;20;28" asset="down"} 입력하는 창이 
가려지면 되게 찾기 어려워 하셨거든요.
:xmark[선택하지 않았던]{start="00;05;25;21"} 가장 큰 이유는 이거였는데,

그래서 :tag[편하게]{start="00;05;29;19" color="rgba(255, 255, 255, 1)"} 그리고 :xmark[실수 없이]{start="00;05;30;22"}
 상담 내용을 기록하실 수 있게
 상담 :inline[중]{start="00;05;35;00" asset="wait"}인 고객정보 페이지 안에
 매달려 있는 :flip[플로팅 입력창]{start="00;05;38;09"}으로
 제공하게 됐죠. 

그래서 :tag[편하게]{start="00;05;29;19" color="rgba(255, 255, 255, 1)"} 그리고 :xmark[실수 없이]{start="00;05;30;22"} 상담 내용을 
기록하실 수 있게 상담 :inline[중]{start="00;05;35;00" asset="wait"}인 고객정보 페이지 안에 
매달려 있는 :flip[플로팅 입력창]{start="00;05;38;09"}으로 제공하게 됐죠. 

그리고 또 상담할 때 확인하시는
 :tag[정보 순서]{start="00;05;43;22" color="rgba(255, 255, 255, 1)"}랑 입력 하시는
 :tag[입력칸의 순서]{start="00;05;46;00" color="rgba(255, 255, 255, 1)"}가
 :color[다르게]{start="00;05;47;08"} 되어 있었더라고요.
그런데 진짜 몰랐어요. 

그리고 또 상담할 때 확인하시는 :tag[정보 순서]{start="00;05;43;22" color="rgba(255, 255, 255, 1)"}랑 입력 
하시는 :tag[입력칸의 순서]{start="00;05;46;00" color="rgba(255, 255, 255, 1)"}가 :color[다르게]{start="00;05;47;08"} 되어 있었더라고요.
그런데 진짜 몰랐어요. 

맞아요. 그래서 그 때 입력할 때는
 조금 위에부터 쓰는 게 아니라
 :inline[아래]{start="00;05;56;09" asset="down"} 칸 갔다가 :inline[위]{start="00;05;57;09" asset="up"}에
 다시 갔다가 좀 비효율적으로
 클릭을 했었어요. 

맞아요. 그래서 그 때 입력할 때는 조금 위에부터 
쓰는 게 아니라 :inline[아래]{start="00;05;56;09" asset="down"} 칸 갔다가 :inline[위]{start="00;05;57;09" asset="up"}에 다시 갔다가 
좀 비효율적으로 클릭을 했었어요. 

사실 이런 걸 VOC로 딱히
 저희한테 :xmark[말씀해주신 적]{start="00;06;04;16"}도
 딱히 없고 데이터를 봐도
 그런 부분은 사실 상상하기가
 조금 어려운 부분이었어서
 :popup[직접]{start="00;06;12;07" asset="aha"} 보지 않고는 사실 모를 수
밖에 없었던 것들이었어요. 

사실 이런 걸 VOC로 딱히 저희한테 :xmark[말씀해주신 적]{start="00;06;04;16"}도 
딱히 없고 데이터를 봐도 그런 부분은 사실 상상하기가 
조금 어려운 부분이었어서 :popup[직접]{start="00;06;12;07" asset="aha"} 보지 않고는 사실 
모를 수 밖에 없었던 것들이었어요. 

이게 또 너무 :tag[사소한]{start="00;06;17;23" color="rgba(255, 255, 255, 1)"} 거니까
 굳이 말하기도 :dots[애매하고]{start="00;06;20;04" end="00;06;20;21"}
이야기 들어보니까 확실히
 계속 스크롤하거나 창에 가려져
 있으면 찾는 게 되게 귀찮을 것
 :speakBubble[같네요.]{data='[{"speaker":"Speaker 2", "start":"00;06;28;11", "text":" 맞아요"}]'} 

이게 또 너무 :tag[사소한]{start="00;06;17;23" color="rgba(255, 255, 255, 1)"} 거니까 굳이 말하기도 :dots[애매하고]{start="00;06;20;04" end="00;06;20;21"}
이야기 들어보니까 확실히 계속 스크롤하거나 
창에 가려져 있으면 찾는 게 되게 귀찮을 것 :speakBubble[같네요.]{data='[{"speaker":"Speaker 2", "start":"00;06;28;11", "text":" 맞아요"}]'} 

그래서 관찰한 내용들에서
 :tag[힌트]{start="00;06;31;12" color="rgba(255, 255, 255, 1)"}를 얻어서 이렇게 :speakBubble[개선을]{data='[{"speaker":"Speaker 1", "start":"00;06;33;13", "text":" 오~"}]'}
 했어요. 상담 내용을 입력하는
 창이 이렇게 스크롤을
 하실 때 다 :color[따라다니게]{start="00;06;40;09"} 만들었고요. 

그래서 관찰한 내용들에서 :tag[힌트]{start="00;06;31;12" color="rgba(255, 255, 255, 1)"}를 얻어서 이렇게 
:speakBubble[개선을]{data='[{"speaker":"Speaker 1", "start":"00;06;33;13", "text":" 오~"}]'} 했어요. 상담 내용을 입력하는 창이 
이렇게 스크롤을 하실 때 다 :color[따라다니게]{start="00;06;40;09"} 만들었고요. 

또 한눈에 많은 정보를 딱 보고
 :inline[한눈]{start="00;06;42;18" asset="eye"}에 찾으실 수 있게
 입력창이 화면의 정보를 가리지
 않도록 :color[좌우로]{start="00;06;49;22"} 옮기거나,
 언제든 :color[접어둘 수]{start="00;06;51;20"} 있게 그렇게
 해드렸거든요. 

또 한눈에 많은 정보를 딱 보고 :inline[한눈]{start="00;06;42;18" asset="eye"}에 찾으실 
수 있게 입력창이 화면의 정보를 가리지 않도록 
:color[좌우로]{start="00;06;49;22"} 옮기거나, 언제든 :color[접어둘 수]{start="00;06;51;20"} 있게 그렇게 
해드렸거든요. 

그리고 추가로 상담할 때
 확인하시는 정보랑 입력하신 정보
 순서를 :color[동일하게 맞춰줬고요.]{start="00;06;59;11"} 

그리고 추가로 상담할 때 확인하시는 정보랑 
입력하신 정보 순서를 :color[동일하게 맞춰줬고요.]{start="00;06;59;11"} 

오 이거 :exclamationMark[좋아 보이는데요]{start="00;07;01;14"}
주연님은 사용자 입장에서
 어땠어요? 솔직하게.

오 이거 :exclamationMark[좋아 보이는데요]{start="00;07;01;14"}
주연님은 사용자 입장에서 어땠어요? 솔직하게.

저는 이제 :quoteMark[single-start]{}개선됐다
 들어가 보셔라:quoteMark[single-end] 라고 공지해
 주셨을 때 보니까 :emojiBubble[너무]{start="00;07;14;10" url="https://static.toss.im/2d-emojis/svg/u1F970.svg"} 좋았어요.
 일단 우리가 스크롤을 하는대로
 따라오고 그리고 고객님과
 상담을 할 때 정보를 보면서
 내역을 쓸 수 있게 입력창을
 :tag[접고 펴는 기능]{start="00;07;24;03" color="rgba(255, 255, 255, 1)"}을
 만들어주셨거든요. 

저는 이제 :quoteMark[single-start]{}개선됐다 들어가 보셔라:quoteMark[single-end] 라고 공지해 
주셨을 때 보니까 :emojiBubble[너무]{start="00;07;14;10" url="https://static.toss.im/2d-emojis/svg/u1F970.svg"} 좋았어요. 일단 우리가 
스크롤을 하는대로 따라오고 그리고 고객님과 
상담을 할 때 정보를 보면서 내역을 쓸 수 있게 입력창을 
:tag[접고 펴는 기능]{start="00;07;24;03" color="rgba(255, 255, 255, 1)"}을 만들어주셨거든요. 

근데 그거는 정말 자주 쓰게 돼서
 팀원분들도 되게 :inline[좋다고]{start="00;07;30;16" asset="heart"}
 저한테 말씀 해주시고 저희가
 :tag[단축키]{start="00;07;32;22" color="rgba(255, 255, 255, 1)"}로도 만들어 주실 수 있냐고
 요청도 드렸었어요. 

근데 그거는 정말 자주 쓰게 돼서 팀원분들도 되게 
:inline[좋다고]{start="00;07;30;16" asset="heart"} 저한테 말씀 해주시고 저희가 :tag[단축키]{start="00;07;32;22" color="rgba(255, 255, 255, 1)"}로도 
만들어 주실 수 있냐고 요청도 드렸었어요. 

그러면 좋은 피드백도 있지만
 사실 이제 사용 경험이 더
 편해지더라도 :color[익숙한 게 더 좋은]{start="00;07;43;13"}
 느낌도 있잖아요.
예를 들면 저는 제 책상이 되게
 :inline[어지러운데]{start="00;07;49;12" asset="dust"} 그거를 

그러면 좋은 피드백도 있지만 사실 이제 사용 경험이 
더 편해지더라도 :color[익숙한 게 더 좋은]{start="00;07;43;13"} 느낌도 있잖아요.
예를 들면 저는 제 책상이 되게 :inline[어지러운데]{start="00;07;49;12" asset="dust"} 그거를 

아 :popup[진짜]{start="00;07;51;06" asset="gif55"} 어지럽더라고요

남이 깨끗이 치워줘서 깨끗한 건
 좋은데 뭐가 어디 있는지 좀
 익숙하지 않은 것보다는 그냥
 어지러운  책상이 :speakBubble[편하게]{data='[{"speaker":"Speaker 2", "start":"00;08;03;13", "text":" 음~ 맞아요 맞아요. 그럴 때도 확실히 있죠."}]'}
 느껴지기도 하거든요. 

남이 깨끗이 치워줘서 깨끗한 건 좋은데 뭐가 어디 
있는지 좀 익숙하지 않은 것보다는 그냥 어지러운  
책상이 :speakBubble[편하게]{data='[{"speaker":"Speaker 2", "start":"00;08;03;13", "text":" 음~ 맞아요 맞아요. 그럴 때도 확실히 있죠."}]'} 느껴지기도 하거든요. 

그럴 때는 :color[기존의 그 편안함]{start="00;08;07;00"}이 뭔지,
 :color[기존 사용성]{start="00;08;09;06"}이 어떤지 파악하는
 것부터 시작하는 게 저는
 도움이되더라고요. 

그럴 때는 :color[기존의 그 편안함]{start="00;08;07;00"}이 뭔지, :color[기존 사용성]{start="00;08;09;06"}이 
어떤지 파악하는 것부터 시작하는 게 저는 도움이
되더라고요. 

:questionMark[그랬던 사례도 있으세요]{start="00;08;15;18"} 

아, 있죠. 대표적으로 그거, 
검색할 때 있잖아요.
CX분들만의 그 :flip[특별한 방법]{start="00;08;22;20"}이
 있잖아요. 숨쉬듯이
 :exclamationMark[해오셨던 그거]{start="00;08;25;29"}

아, 있죠. 대표적으로 그거, 검색할 때 있잖아요.
CX분들만의 그 :flip[특별한 방법]{start="00;08;22;20"}이 있잖아요. 
숨쉬듯이 :exclamationMark[해오셨던 그거]{start="00;08;25;29"}

맞아요. 저희는 아무래도
 상담하면서 너무 많은 정보가
 :tag[한 페이지]{start="00;08;31;12" color="rgba(255, 255, 255, 1)"}에 있다 보니까 
그걸 찾으려고 :flip[Ctrl + F]{start="00;08;34;06"}를
 정말 수시로 사용하고 있어요. 

맞아요. 저희는 아무래도 상담하면서 너무 많은 
정보가 :tag[한 페이지]{start="00;08;31;12" color="rgba(255, 255, 255, 1)"}에 있다 보니까 그걸 찾으려고 
:flip[Ctrl + F]{start="00;08;34;06"}를 정말 수시로 사용하고 있어요. 

맞아요. :tag[Ctrl + F]{start="00;08;38;14" color="rgba(255, 255, 255, 1)"} 이거를 사실
 전 일하실 때 그렇게까지
활용하시는지는,
 만나뵙기 전까지는 진짜
 몰랐거든요. 

맞아요. :tag[Ctrl + F]{start="00;08;38;14" color="rgba(255, 255, 255, 1)"} 이거를 사실 전 일하실 때 그렇게까지
활용하시는지는, 만나뵙기 전까지는 진짜 몰랐거든요. 

근데 Ctrl + F가 가능하려면
 당시의 제품 구조상 데이터가
 :tag[미리 불러와져]{start="00;08;51;09" color="rgba(255, 255, 255, 1)"} 있어야 됐어요.
 정말 많은 데이터가.
 그러다 보니까 정보를 뿌리는
 시간이 :color[오래 걸리는 문제]{start="00;08;58;05"}가
 :speakBubble[있었어요.]{data='[{"speaker":"Speaker 3", "start":"00;08;59;21", "text":" 음 맞아요"}]'} 

근데 Ctrl + F가 가능하려면 당시의 제품 구조상 
데이터가 :tag[미리 불러와져]{start="00;08;51;09" color="rgba(255, 255, 255, 1)"} 있어야 됐어요. 정말 많은 
데이터가. 그러다 보니까 정보를 뿌리는 시간이 
:color[오래 걸리는 문제]{start="00;08;58;05"}가 :speakBubble[있었어요.]{data='[{"speaker":"Speaker 3", "start":"00;08;59;21", "text":" 음 맞아요"}]'} 

그래서 정보를 불러오는 게
 예상보다 오래 걸리면 저희도
 :inline[당황]{start="00;09;04;20" asset="sweat"}했지만 고객님께는
 침착하게 :quoteMark[single-start]{}잠시만 기다려주세요:quoteMark[single-end]
 라고 :color[양해를 구해야 되는 상황]{start="00;09;09;05"}도
 생겼었죠. 

그래서 정보를 불러오는 게 예상보다 오래 걸리면 
저희도 :inline[당황]{start="00;09;04;20" asset="sweat"}했지만 고객님께는 침착하게 :quoteMark[single-start]{}잠시만 
기다려주세요:quoteMark[single-end] 라고 :color[양해를 구해야 되는 상황]{start="00;09;09;05"}도 
생겼었죠. 

맞아요. 근데 사실 그거는
 :tag[CX분들]{start="00;09;14;02" color="rgba(255, 255, 255, 1)"}에게도 그 전화 상담 
하고 계신 :tag[고객님들]{start="00;09;17;00" color="rgba(255, 255, 255, 1)"}한테도
 :xmark[좋은 상황]{start="00;09;18;03"}은 아니잖아요.
이러한 데이터 불러오는
 속도 문제를 해결하려면
 그 당시 구조상으로는 기술적으로
 :tag[Ctrl + F 기능]{start="00;09;26;02" color="rgba(255, 255, 255, 1)"}을 :xmark[쓰지 못하게]{start="00;09;27;24"}
 막아야 되는 상황이었어요. 

맞아요. 근데 사실 그거는 :tag[CX분들]{start="00;09;14;02" color="rgba(255, 255, 255, 1)"}에게도 그 전화 상담 
하고 계신 :tag[고객님들]{start="00;09;17;00" color="rgba(255, 255, 255, 1)"}한테도 :xmark[좋은 상황]{start="00;09;18;03"}은 아니잖아요.
이러한 데이터 불러오는 속도 문제를 해결하려면 
그 당시 구조상으로는 기술적으로 :tag[Ctrl + F 기능]{start="00;09;26;02" color="rgba(255, 255, 255, 1)"}을 
:xmark[쓰지 못하게]{start="00;09;27;24"} 막아야 되는 상황이었어요. 

그래서 저희 팀은 좀 고민을 하다가
 그래, 우린 :tag[속도]{start="00;09;34;13" color="rgba(255, 255, 255, 1)"}를 선택하고
 :exclamationMark[검색 기능을 새로 만들자]{start="00;09;35;26"} 이렇게
 생각을 하게 됐어요. 

그래서 저희 팀은 좀 고민을 하다가 그래, 우린 :tag[속도]{start="00;09;34;13" color="rgba(255, 255, 255, 1)"}를 
선택하고 :exclamationMark[검색 기능을 새로 만들자]{start="00;09;35;26"} 이렇게 생각을 
하게 됐어요. 

Ctrl + F를 :tag[대체]{start="00;09;41;12" color="rgba(255, 255, 255, 1)"}하는 검색을
 :questionMark[아예 만들어버리자]{start="00;09;42;10"} 

Ctrl + F를 :tag[대체]{start="00;09;41;12" color="rgba(255, 255, 255, 1)"}하는 검색을 :questionMark[아예 만들어버리자]{start="00;09;42;10"} 

근데 그러면 Ctrl + F보다
 더 편하게 만들기는
 쉽지 않을 것 :emojiBubble[같다]{start="00;09;48;04" url="https://static.toss.im/2d-emojis/svg/u1F914.svg"}는 생각도
 드는데요. 

근데 그러면 Ctrl + F보다 더 편하게 만들기는 쉽지 
않을 것 :emojiBubble[같다]{start="00;09;48;04" url="https://static.toss.im/2d-emojis/svg/u1F914.svg"}는 생각도 드는데요. 

맞아요. 근데 기존 Ctrl + F에
 :tag[아쉬운 점]{start="00;09;53;07" color="rgba(255, 255, 255, 1)"}도 없진 않았는데요.
 사용자분들이 어떻게 쓰는지
 기존 검색 경험들을 지켜보니까
 너무 많은 정보에 대해서
 :xmark[필터링]{start="00;10;03;01"}이 안 되니까
 그 안에서도 :popup[어차피]{start="00;10;05;29" asset="find"} 찾기 힘들어
 하시더라고요. 

맞아요. 근데 기존 Ctrl + F에 :tag[아쉬운 점]{start="00;09;53;07" color="rgba(255, 255, 255, 1)"}도 없진 
않았는데요. 사용자분들이 어떻게 쓰는지 기존 검색 
경험들을 지켜보니까 너무 많은 정보에 대해서 
:xmark[필터링]{start="00;10;03;01"}이 안 되니까 그 안에서도 :popup[어차피]{start="00;10;05;29" asset="find"} 찾기 
힘들어 하시더라고요. 

날것에서 그냥 :tag[어떻게든]{start="00;10;10;02" color="rgba(255, 255, 255, 1)"} 찾는
 :questionMark[방식이었다고 해야하나]{start="00;10;11;09"}
예를 들면, 어떤 키워드 검색을
 했는데 그게 :tag[40~50개]{start="00;10;16;28" color="rgba(255, 255, 255, 1)"} 
결과가 나왔어요. 

날것에서 그냥 :tag[어떻게든]{start="00;10;10;02" color="rgba(255, 255, 255, 1)"} 찾는 :questionMark[방식이었다고 해야하나]{start="00;10;11;09"}
예를 들면, 어떤 키워드 검색을 했는데 그게 :tag[40~50개]{start="00;10;16;28" color="rgba(255, 255, 255, 1)"} 
결과가 나왔어요. 

:questionMark[한 페이지에]{start="00;10;19;17"}

네, 왜냐하면 :color[엄청 많은 정보들]{start="00;10;21;12"}이
 있으니까. 거기서 내가 원하는 것을
 찾으려면 한참 눌러봐야
 :quoteMark[single-start]{}아 이거다:quoteMark[single-end]이렇게
 찾을 수가 있는 거예요. 

네, 왜냐하면 :color[엄청 많은 정보들]{start="00;10;21;12"}이 있으니까. 거기서 
내가 원하는 것을 찾으려면 한참 눌러봐야 :quoteMark[single-start]{}아 이거다:quoteMark[single-end]
이렇게 찾을 수가 있는 거예요. 

게다가 탭에 숨겨지거나 하면
 :xmark[결과가 안 나오거나]{start="00;10;33;25"} 이런
 문제들이 있었죠. 이런 문제들이
 있는 거를 해결을 하면서 말씀해 
주신 것처럼 기존 Ctrl + F의 
편한 점들도 가져가야겠다 
생각을 했는데, 

게다가 탭에 숨겨지거나 하면 :xmark[결과가 안 나오거나]{start="00;10;33;25"} 
이런 문제들이 있었죠. 이런 문제들이 있는 거를 
해결을 하면서 말씀해 주신 것처럼 기존 Ctrl + F의 
편한 점들도 가져가야겠다 생각을 했는데, 

그런데 사실 처음에는 :flip[검색?]{start="00;10;52;06"} 
또 엄청 특별하고 엄청나고 
이 세계에서 본 적이 없는
 혁신적인 :speakBubble[완전]{data='[{"speaker":"Speaker 3", "start":"00;11;02;00", "text":" 최초의"}]'} First Model이
 :exclamationMark[되어야겠다]{start="00;11;03;12"} 그런 걸 만들려고 
막 스케치를 했었어요. 

그런데 사실 처음에는 :flip[검색?]{start="00;10;52;06"} 또 엄청 특별하고 엄청나고 
이 세계에서 본 적이 없는 혁신적인 :speakBubble[완전]{data='[{"speaker":"Speaker 3", "start":"00;11;02;00", "text":" 최초의"}]'} First Model이 
:exclamationMark[되어야겠다]{start="00;11;03;12"} 그런 걸 만들려고 막 스케치를 했었어요. 

근데 이제 그런 편했던 부분들이
 무엇이었는지 사용자분들의
 :color[기존 사용 목적을 잘 파악]{start="00;11;14;11"}하고
 나서는 :xmark[도움이 안 되는]{start="00;11;17;18"} 그런 
생각들은 좀 :inline[버려]{start="00;11;20;21" asset="trashcan"}버리고 기존 
사용성을 어떻게 :questionMark[잘 가져올까]{start="00;11;23;16"}
 거기에만 완전히 집중하게
 됐어요. 

근데 이제 그런 편했던 부분들이 무엇이었는지 
사용자분들의 :color[기존 사용 목적을 잘 파악]{start="00;11;14;11"}하고 나서는 
:xmark[도움이 안 되는]{start="00;11;17;18"} 그런 생각들은 좀 :inline[버려]{start="00;11;20;21" asset="trashcan"}버리고 
기존 사용성을 어떻게 :questionMark[잘 가져올까]{start="00;11;23;16"} 거기에만 완전히 
집중하게 됐어요. 

그러면 그 Ctrl + F를 쓰는
Use Case라고 해야 :questionMark[될까요]{start="00;11;31;06"}
 어떻게 사용하시는지 보신 것도
 있는 거예요?

그러면 그 Ctrl + F를 쓰는 Use Case라고 해야 
:questionMark[될까요]{start="00;11;31;06"} 어떻게 사용하시는지 보신 것도 있는 거예요?

네, 맞아요.
 그 Use Case라고 함은
 정말 많은 케이스가 사실
 있기는 한데 제일 중요하고
 가장 빈도가 높았던 건,
 하나는 :color[원하는 섹션의 위치]{start="00;11;43;25"}로
 이동하시는, 예를 들어서
 거래 내역이 있는 위치로 빨리 가고
싶다면 거래 내역 파트를
 :tag[검색하는 것]{start="00;11;51;26" color="rgba(255, 255, 255, 1)"} 그게 첫 번째고

네, 맞아요. Use Case라고 함은 정말 많은 
케이스가 사실 있기는 한데 제일 중요하고 가장 빈도가 
높았던 건, 하나는 :color[원하는 섹션의 위치]{start="00;11;43;25"}로 이동하시는, 
예를 들어서 거래 내역이 있는 위치로 빨리 가고
싶다면 거래 내역 파트를 :tag[검색하는 것]{start="00;11;51;26" color="rgba(255, 255, 255, 1)"} 그게 첫 번째고

두 번째는 어떤 특별한 정보 자체를
 찾아내기 위해, 예를 들면 어떤
 고객님이 :color[송금한 5만 원]{start="00;11;59;23"}에 대해
  찾고 싶으면 :quoteMark[single-start]{}5만 원:quoteMark[single-end] 이렇게
 :tag[검색]{start="00;12;04;03" color="rgba(255, 255, 255, 1)"}해서 그 내역으로
 :tag[이동]{start="00;12;05;28" color="rgba(255, 255, 255, 1)"}을 하는 거죠. :inline[엔터]{start="00;12;06;11" asset="enter"}를 쳐서. 

두 번째는 어떤 특별한 정보 자체를 찾아내기 위해, 
예를 들면 어떤 고객님이 :color[송금한 5만 원]{start="00;11;59;23"}에 대해  
찾고 싶으면 :quoteMark[single-start]{}5만 원:quoteMark[single-end] 이렇게 :tag[검색]{start="00;12;04;03" color="rgba(255, 255, 255, 1)"}해서 그 내역으로 
:tag[이동]{start="00;12;05;28" color="rgba(255, 255, 255, 1)"}을 하는 거죠. :inline[엔터]{start="00;12;06;11" asset="enter"}를 쳐서. 

그러면 Ctrl + F가 되게 직관적이고
 접근성이 좋은 그런 면도 있지만,
 동시에 아쉽고 보완해야 되는 면도
 있어서 그 :color[장단점을 살리는]{start="00;12;16;13"}
 디자인을 :exclamationMark[해야겠다]{start="00;12;18;03"}
 그렇게 생각하신 거네요. 

그러면 Ctrl + F가 되게 직관적이고 접근성이 좋은 
그런 면도 있지만, 동시에 아쉽고 보완해야 되는 면도 
있어서 그 :color[장단점을 살리는]{start="00;12;16;13"} 디자인을 :exclamationMark[해야겠다]{start="00;12;18;03"} 
그렇게 생각하신 거네요. 

사용자의공감 얻으면서제품 뜯어고치기