notion: https://www.notion.so/DAY-38-GA4-GA-Re-brew-1e34bb609e3a80e4bcbddfede211a084?pvs=4

Figma: https://www.figma.com/design/p5gz3PylSi1OuUe2zbSQUx/PD_03_%EA%B0%95%EC%86%8C%EC%97%B0?node-id=1598-2&p=f&t=RtgeK52eG0rdfzHX-0

1. 키파인딩 (Key Findings)

키파인딩(Key Findings)이란?

• 리서치 결과 중 디자인 방향성에 의미 있는 핵심 발견만 간추린 것
• 단순 사용성 오류나 반응이 아니라, 디자인 변화로 이어질 수 있는 본질적인 발견을 말함

왜 중요한가?

• 키파인딩이 있어야 비로소 "문제를 해결하는 과정" (Problem-solving)이 시작될 수 있음

주의할 점:

• 사용자 불만을 피상적으로 해석하지 않고,
  사용자 감정 흐름(User Emotional Journey)까지 이해해야 진짜 문제를 짚을 수 있음

→ Re:brew 프로젝트에서도, 단순 이탈률이 아니라
'언제', '왜' 이탈했는지 감정선(Emotional Curve)까지 살펴야 했다는 걸 깨달았다.

2. UX 모델링 (UX Modeling)

UX 모델링이란?

• 특정 서비스의*사용자 경험(User Experience)을
  페르소나(Persona), 유저저니(User Journey Map), 친화도법(Affinity Diagram),
  공감모델(Empathy Map), 가치제안캔버스(Value Proposition Canvas) 등으로
  구조화/도식화하여 한눈에 이해할 수 있도록 정리하는 것

최근 트렌드:
스타트업/애자일(Agile) 환경에서는 빠른 실행을 위해 모델링을 생략하고
리서치 → 키파인딩 → 인사이트만으로 빠르게 넘어가는 경우가 많음

3. 인사이트 (Insight)

인사이트란?

• 리서치/키파인딩을 바탕으로,
  "서비스가 취해야 할 변화 방향(Change Direction)"을 자각하는 것

정리 구조:

• 키파인딩 → "이런 문제가 있구나."
• 인사이트 → "이 문제를 이렇게 바꿔야겠구나."

주의할 점:

• 인사이트(Insight) ≠ 아이디어(Idea)
  • 인사이트: 방향성 제안 (Direction)
  • 아이디어: 구체적 실행 방법 (How-to)

4. 구체화 단계 (Develop 단계)

Develop(구체화 단계) 순서:

1. 인사이트 기반으로 가치(Value)를 도출
2. 비즈니스 목표(Business Goals), 기술적 타당성(Technical Feasibility) 검토
3. 가치 우선순위(Value Prioritization) 설정
4. 차별화 전략(Positioning) 수립
5. 컨셉트(Concept) 정리
6. 서비스 모델(Service Model) 정의 및 실행방안(Action Plans) 수립

Re:brew 프로젝트에 적용할 시사점:
대대적인 전략 변경이 필요 없을 때는 기존 서비스 감성 유지 + 몰입성 강화 중심으로 디벨롭해야 한다.

5. 인터랙션 설계 (Interaction Design)

핵심 요소:

• 터치/탭(Tap), 스와이프(Swipe), 스크롤(Scroll), 드래그 앤 드롭(Drag & Drop), 핀치 인/아웃(Pinch In/Out)
• 상태 변환(State Change): 빠른 애니메이션, 확장/축소, 뒤집기(Flip), 수평 이동(Horizontal Scroll) 등

깨달은 점:
사용자의 손동작 흐름(User Gesture Flow)까지 설계해야 진짜 UX 개선이 된다.

🛠️ 독서를 통해 얻은 Re:brew 프로젝트 보완 포인트

🛠️ 독서를 통해 얻은 Re:brew 프로젝트 개선 아이디어

➊ 초기 이탈 감정선을 더 섬세하게 추적하려면 어떤 방법을 추가할까?

1. 클릭스트림 분석 (Clickstream Analysis)

• 사용자가 앱에 접속한 후 어떤 버튼 → 어떤 화면 → 어떤 액션을 순서대로 기록해서
  이탈 직전까지의 흐름을 시퀀스(Sequence)로 시각화하는 방법.
• 특정 액션 후 바로 이탈하는 패턴이 반복된다면, 그 시점에 감정선이 급락했을 가능성이 큼.

2. 이벤트 기반 세분화 (Event Segmentation)

• '시작했지만 완료하지 않은 행동'을 추적.
  예: 튜토리얼 중 "꾸미기" 기능 시도 없이 종료한 유저만 따로 묶기.
• 이렇게 묶은 그룹에 대해 체류 시간, 클릭 수 등 비교 분석하면 어디서 흥미가 꺾였는지 더 정확히 알 수 있음

3. 감정 키워드 수집 (Emotional Keyword Mining)

• 짧은 설문, 앱 내 피드백 창 등을 통해
  '지금 기분'을 선택하게 해서 데이터 수집. (예: "재밌어요 / 헷갈려요 / 지루해요" 중 선택)
• 이 데이터를 이탈 시점과 매칭하면 객관적인 감정선 그래프(Emotional Curve Graph)를 그릴 수 있음.

4. 이탈 직전 행동 리플레이 (Session Replay)

• 실제로 유저가 이탈하기 직전 어떤 조작을 했는지 녹화해서 보는 방법.
  (ex: Hotjar, Contentsquare 같은 툴에서 지원)
• 클릭 오작동, UI 혼란 등 감정선 급락 원인을 직접 눈으로 확인 가능.

➋ 복귀 유저 첫 30초 안에 감성 보상을 자연스럽게 녹이려면 어떤 연출이 효과적일까?

1. 리턴 환영 애니메이션 (Return Welcome Animation)

• 복귀 즉시, 화면 전체를 부드럽게 덮는
  "돌아와줘서 고마워요!" 애니메이션을 띄우고
  따뜻한 음악과 함께 보상을 슬라이드 방식으로 자연스럽게 보여주는 것.
  (지루한 팝업 알림이 아니라, 감정선을 터치하는 부드러운 흐름)

2. 스토리텔링 기반 미션 제공 (Narrative Return Quest)

• "그동안 당신의 카페가 조용했어요. 다시 활기를 불어넣어 주세요!" 같은 작은 스토리로
  보상과 미션을 감정적으로 연결해준다.
• 그냥 "보상 지급"이 아니라, 유저가 세계관에 다시 몰입하게 유도.

3. '보상 타임라인' 연출 (Reward Timeline Animation)

• 과거 활동 이력을 타임라인처럼 짧게 보여준 뒤,
  "당신의 여정은 계속됩니다" 식의 메시지와 함께 보상 지급.
• 과거-현재를 이어주는 감정 흐름 덕분에 '끊김 없이 이어진 느낌'을 주기 좋음.

4. UI 레이어 최소화 (Minimal UI Layering)

• 복귀하자마자 무거운 팝업 3개 띄우는 식은 최악.
  애니메이션 1개 → 짧은 설명 1줄 → 바로 클릭 가능한 보상 수령 버튼만 보여주는 걸 추천.
• 30초 안에 자연스럽게 리워드를 받고 탐색 시작할 수 있어야 함.

3월 말부터 준비해 온 로스트아크 아바타 공모전.
드디어 4월 23일에 출품을 완료했다.
지금은 '좋아요' 취합 기간이라 본선 진출작이 어떻게 될지 결과를 기다리는 중이다.

출품 아바타:
🔗 로스트아크 아바타 공모전 - 도한

내 아바타의 이름은 '도한'.
남성 무도가 클래스를 위한 아바타로,
현대 스트릿 패션과 무도가 도복의 절제된 실루엣을 결합한 컨셉을 잡았다.
주제 문장은 명확했다.
"현대와 아크라시아 경계에 선 무도가."

도한 아바타 디자인 과정에서 가장 어려웠던 수정 포인트 3가지

이번 아바타 공모전 작업을 하면서 가장 고심했던 부분을 정리해보려 한다.
수정을 거듭할수록, 내가 몰랐던 한계와 부족함이 명확히 드러났고,
동시에 앞으로 무엇을 더 보완해야 하는지도 알게 되었다.

1. 포인트 컬러를 넣지 못한 아쉬움

처음부터 '그레이 스케일(블랙, 그레이, 화이트)'만을 생각하고 디자인을 시작했다.
톤온톤으로 절제된 무드를 유지하고 싶었기 때문인데, 출품을 준비하며
"썸네일 단계에서도 눈에 띄게 포인트 컬러를 넣어보는 게 어떨까?"
하는 피드백을 받았다.

하지만 막상 시도해보니, 아무 색을 넣어도 전체 흐름이 깨지는 느낌이었다.
붉은색, 파란색, 네온컬러까지 정말 여러 가지를 테스트했지만
결국 처음의 모노톤으로 돌아왔다.

이 과정에서 느낀 건, 단순히 "색을 더하는" 문제가 아니라
초기 기획 단계부터 '포인트가 될 수 있는 컬러존'을 설계했어야 했다는 것이다.
나의 기량 문제였을까, 아니면 경험이 부족했던 탓일까.
아마 둘 다였을 것이다.

레퍼런스를 더 폭넓게 보고, 색 조합과 배색에 대한 경험치를 쌓아야겠다는 걸
뼈저리게 느꼈다.

2. 스트릿 패션 특유의 비율을 구현하는 어려움

이번 '도한' 아바타는 스트릿 패션을 베이스로 잡았기 때문에
'힙하고 여유로운 실루엣'을 유지해야 했다.

문제는, 무도가 클래스 특유의 날렵함과 민첩함까지 동시에 살려야 했다는 점이다.
오버핏인데 무겁지 않고, 여유롭지만 둔하지 않은 실루엣.
이걸 찾는 데 정말 고생했다.

초반엔 너무 부해 보였고, 중반엔 또 너무 날렵해져서 스트릿 느낌이 사라졌다.
결국 최소 2주 동안 끊임없이 수정했다.
상의, 하의, 소매 길이, 팬츠 통, 신발 크기까지 정말 수십 번 수정하면서
균형점을 찾으려 애썼다.

참고로 이 수정 작업을 하면서 애플펜슬이 망가졌다.
(정말... 물리적으로도 정신적으로도 치열한 시간이었음을 증명한다.)

3. 갓끈과 노리개 디테일 표현의 한계

'도한' 아바타의 핵심 디테일 중 하나는
현대 스트릿과 전통 요소를 잇는 갓끈과 노리개 장식이었다.

처음엔 이 부분을 단순 장식처럼 그렸지만,
좀 더 자연스럽고 살아있는 듯한 표현을 해보고 싶었다.

하지만 막상 그리려니, 드로잉 실력의 한계를 뼈저리게 느꼈다.
옷감 특유의 흐름, 매듭의 섬세함, 소재감 표현이 생각처럼 풀리지 않았다.

왜 요즘 일러스트레이터들이 3D 툴을 병행하는지,
이 작업을 하면서 온몸으로 이해했다.
복잡한 디테일을 정확히 구현하는 데에는 툴이 필요하다.

앞으로는 더 많은 드로잉 연습을 하거나,
3D 프로그램 활용법도 병행해서 익혀야겠다고 마음먹었다.
내가 머릿속으로 그린 아이디어를 100% 반영하지 못했다는 아쉬움은
정말 오래 남을 것 같다.

출품 이후 느낀 '좋은 디자인'이란

출품을 마치고 시간이 지나면서 가장 크게 마음에 새긴 건,
좋은 디자인은 '설명 없이도' 전달되는 힘을 가진다는 것이다.

긴 설명을 듣지 않아도,
한 번 보는 것만으로도
"아, 이 캐릭터는 이런 컨셉이구나."
"이 디자인은 이런 스토리를 담고 있구나."
하는 것이 직관적으로 느껴지는 것.

그게 진짜 좋은 디자인이라는 걸 이번 경험을 통해 절실히 깨달았다.

나는 이번 아바타를 만들면서 가능하면 그런 디자인을 하고 싶었다.
하지만, 결과적으로 아직은 많이 부족하다는 것도 스스로 느낀다.
컨셉을 더 명확히, 더 뾰족하게 설정하고,
자료조사를 더 깊이 하고,
수정 과정을 더 치밀하게 거쳐야 한다는 걸 뼈저리게 깨달았다.

특히, 피드백을 받고 그것을 소화해 더 나은 디자인을 만들어내는 경험은
이번 공모전에서 얻은 가장 귀하고 소중한 경험이었다.

혼자 고민하는 것만으로는 결코 보이지 않는 것들이 있었다.
내가 미처 생각하지 못한 부분을 짚어주고,
새로운 시각을 열어준 피드백 덕분에
내 작업이 한 단계 성장할 수 있었다.

누군가의 소중한 시간과 정성을 들여 내 작업에 피드백을 주셨다는 것,
그 자체가 정말 감사한 일이었고,
그 시간과 마음에 보답하기 위해 더 진지하게 수정하고 다듬을 수 있었다.

그리고 또 하나, 이번 공모전을 준비하면서
"저작권"이라는 주제를 뼈저리게 의식하게 된 것도 매우 큰 경험이었다.

처음에는 도한 아바타에 사용된 엠블럼(가슴 등에 들어간 문양) 디자인을 하면서
혹시 기존 디자인과 겹치지는 않을까, 문제가 되지는 않을까 하는 걱정이 들었고,
이를 확인하고 검증하는 데 꽤 긴 시간을 들였다.

문양 하나, 패턴 하나를 만들 때에도,
내가 생각해낸 것이라 하더라도 세상에 이미 비슷한 것이 존재할 수 있다는 가능성을
항상 염두에 두어야 했다.

아바타 전체 컨셉에 있어서도,
다른 브랜드나 기존 게임 디자인과 겹치지 않는지를
계속 확인하고 수정하는 과정을 거쳤다.

이 경험을 통해 확실히 알게 됐다.
좋은 디자인은 단순히 멋있고 창의적인 것만으로는 충분하지 않다.
"법적, 윤리적 책임"을 함께 생각하며 완성해야 한다는 것.

앞으로 어떤 작업을 하더라도,
단순히 '내가 만들었으니까' 괜찮다고 넘기지 않고,
디자인의 출처, 오리지널리티, 그리고 저작권 문제를 명확히 검토하는 습관을
반드시 가져야겠다고 다짐했다.

figma: https://www.figma.com/design/p5gz3PylSi1OuUe2zbSQUx/PD_03_%EA%B0%95%EC%86%8C%EC%97%B0?node-id=1527-2&p=f&t=RYC1G0kk29P8d08W-0

notion: https://www.notion.so/DAY-37-GA4-3-1e04bb609e3a80d59d1ecdb2230d1952?pvs=4

notion: https://www.notion.so/DAY-36-Re-brew-ver-2-1df4bb609e3a80d39d5bcc285e4478e4?pvs=4

figma: https://www.figma.com/design/p5gz3PylSi1OuUe2zbSQUx/PD_03_%EA%B0%95%EC%86%8C%EC%97%B0?node-id=1496-2&p=f&t=g0wk5gmC4wvDDh0Z-0

notion: https://www.notion.so/DAY-35-1de4bb609e3a80208787eb72945d9ed1?pvs=4

figma:https://www.figma.com/design/p5gz3PylSi1OuUe2zbSQUx/PD_03_%EA%B0%95%EC%86%8C%EC%97%B0?node-id=1461-2&p=f&t=Yk370W341dHsQNCS-0

figma: https://www.figma.com/design/p5gz3PylSi1OuUe2zbSQUx/PD_03_%EA%B0%95%EC%86%8C%EC%97%B0?node-id=1444-413&p=f&t=YeuFau7oUPNQz6ux-0

notion:https://www.notion.so/DAY-34-1dd4bb609e3a80d9a2e9f85b9dc3b44d?pvs=4

Figma: https://www.figma.com/design/p5gz3PylSi1OuUe2zbSQUx/PD_03_%EA%B0%95%EC%86%8C%EC%97%B0?node-id=1363-591&p=f&t=JgJYJCPOjW0R1fGU-0

Notion: https://www.notion.so/DAY-33-1dc4bb609e3a80c9a661db403326ee63?pvs=4

🔗 마비노기 UI 클론 프로토타입 링크: https://www.figma.com/proto/p5gz3PylSi1OuUe2zbSQUx/PD_03_%EA%B0%95%EC%86%8C%EC%97%B0?node-id=1280-871&p=f&t=B0JG8v7gVzmgnffl-1&scaling=scale-down&content-scaling=fixed&page-id=1280%3A818&starting-point-node-id=1280%3A871

🔗 피그마 링크: https://www.figma.com/design/p5gz3PylSi1OuUe2zbSQUx/PD_03_강소연?node-id=1280-5754&t=TweYFx8RpgXyUZQJ-0

🔗 노션 링크:
https://www.notion.so/DAY-32-UI-UX-UX-Value-1d94bb609e3a80f2ab25d7a60ab1b4f3?pvs=4

1. HMW(How Might We): 각 UX 가치를 행동 가능한 문제 정의로 바꾸기

2. Crazy8 : HMW 각각 '8가지 솔루션'을 시간 제한 내에 빠르게 그려보는 브레인스토밍

3. Mind Map: 아이디어 구조화

피그마 링크: https://www.figma.com/design/p5gz3PylSi1OuUe2zbSQUx/PD_03_%EA%B0%95%EC%86%8C%EC%97%B0?node-id=1231-2&p=f&t=o7LrDdgaXAwiDQ1Q-0

노션 링크:
https://www.notion.so/DAY-31-6-UX-Value-HMW-How-Might-We-Crazy8-MindMap-1d84bb609e3a8000baa6e1accee0154c?pvs=4