[10/13 내일배움캠프] 사전캠프1: 개인과제, 아티클스터디, 특강

 

 

사전캠프 D-1

📌To Do List

* 아티클 스터디(팀): 삶의 질을 높여주는 10가지 UX 사례

(방법) 40분 아티클 리딩 - 요약 - 인사이트 공유

* 개인과제: 프로덕트 디자이너 JD 분석

* 특강: 프로덕트 디자이너가 개발을 알아야하는 이유

 

들어가기에 앞서, 보다 효율적으로 학습을 위해 TIL / WIL 작성법을 알아야한다.

*TIL (Today I Learned) / WIL (Weekly I Learned)
- 자신의 언어로 자신이 학습한 내용을 정리하는 것
- 본인이 오늘 하루 배운 것 혹은 경험하고 느낀 것들을 기록하고 회고하는 것
- 외국에선 개발직군이 아니더라도 그날그날 본인의 배움을 기록하는 문화가 있지만, 한국에서는 주로 개발직군이 비교적 많이 사용하는 개념으로 정착하였다고 함.(처음 알았다)

Q.TIL 작성하는 이유?
- 취업 지원 시 성실성을 보여주기 위해
  : 신입들은 모두 비슷한 실력과 운용 스택을 갖고 있다. 이런 조건 속에서 성장 가능성은 큰 무기가 된다. 이때 꾸준히 작성한 TIL은 성장에 대한 갈망이 높고 성실함과 꾸준함을 겸비했으며, 늘 기술적 고민을 하는 주니어라는 인식을 심어준다. 실제로 꾸준하게 잘 운영된 개발 블로그를 보고 면접 제안을 받은 경우도 많다고한다.
- 학습한 것을 회고하며 복습하기 위해
  : 자신의 학습기록과 버그와 같은 문제를 맞닥뜨려 해결까지의 과정을 기록해 두며 다시 한번 복습할 수 있다. 즉, TIL은 배운 것들을 확실하게 내 것으로 남길 수 있는 방법인 것.
- 어떤 고민을 하는 디자이너인지 어필하기 위해
  : 자신이 학습한 내용을 블로그를 통해 잘 기록해두었기 때문에 이와 같은 고민을 한 다른 사람도 이 포스팅 덕분에 도움이 되고 배울 수 있는 것. TIL을 쓰며 어떤 고민, 문제를 다뤘는지 담겨있다.

Q. TIL 작성법?
(문제 발견 → 다양한 방식의 문제 접근 → 솔루션 → 새롭게 배운 점)
1) TIL에 꼭 들어가야 하는 내용
- 어떤 문제가 있었는지
- 내가 시도해본 것들
- 어떻게 해결했는지
- 무엇을 새롭게 알았는지
2) 주의점
- TIL은 간결하지만 작성자가 아닌 사람이 봐도 이해가 가능하도록 작성하면 좋다.
- TIL은 오늘 내가 배운 것이지 일기장은 아니기에 내 TIL이 내 감정만 드러내는 일기장으로 전락하고 있지는 않은지 항상 주의해야 한다.

출처 - 스파르타 코딩클럽 (누르면 해당 페이지로 이동해요)

---

 

01 아티클 스터디

삶의 질을 높여주는 10가지 UX 사례

주제	일상 속 불편함, 플랫폼에서 해결하는 방법
내용 요약	[에어비앤비] 비밀번호 입력 시, 복잡한 패턴/헷갈리는 알파벳으로 인한 오류 발생 → 와이파이 자동 연결 [산타] 문제풀이 시 실수 방지 →  문제 소거 기능 [카카오뱅크] 다수에게 돈 이체 시 기억이 안남 → 중복 이체 방지 안내 [무신사] 사진으로 모자 깊이 확인 불가능 → 모자 제품군에서 '김이감'필터 제공 [유튜브 뮤직] 샘플 탭 음악 찾을 때 시간이 오래 걸리는 문제 → 후렴구 30초 플레이하는 '샘플탭' 제공 [yes24] 온라인 책 구매 시 책 사이즈 파악 불가 → 사이즈 비교 기능 [정육각] 댓글알바, 지인작성 리뷰로 신뢰도 하락 → 리뷰 작성한 사용자 구매 횟수 정보 제공: ex)90회 구매 [현대카드] 신용카드 이용 시 지출 파악이 불가하여 과소비로 이어짐 → 소비 잔소리 앱푸시 알림기능 (알림금액 설정 → 해당금액 초과할 경우 잔소리 앱푸시 전송) [여다] 귀찮은 여행 계획 → 여행일정 받아보기(AI추천) [다락 - 대용량 짐보관 서비스]  이사할 집의 계약기간이 안맞아 애매한 짐 보관 → 다양한 크기의 보관공간(유닛)제공
인사이트	- 사용자가 무언가에 대해 고민 하기 전, 그 고민을 최대한 줄여줄 수 있는 방법을 다양한 시각에서 바라봐야한다. 특히 요즘엔 AI의 수요가 증가하고있는데 이런 최첨단 기술을 이용하여 어떻게하면 해결할 수 있을지 고민하는 태도가 필요하다. - 사소한 부분도 편리하게 만드는 것이 추후엔 큰 경쟁력이 될 수 있다. - 사용자에게 '알아서 하세요'가 아닌, 'A=A입니다'라고 말할 줄 아는 친절함이 필요하다.

 

 

 

---

 

02 개인 과제

프로덕트 디자이너 JD 분석

*목표: 프로덕트 디자이너 직무의 JD 분석을 통해 프로덕트 디자이너는 어떤 일을 하는 사람이며, 어떤 핵심 역량을 갖춰야 하는지 이해한다.

 

💡JD (Job Description) 분석이란?
JD란 현재 채용 중인 포지션이 어떤 일을 하는지 자세히 설명해놓은, 쉽게 말해 ‘채용 공고’를 일컫는다.

참고: 기업이 채용을 잘 하기 위한 JD 작성 9단계

 

1. 나 스스로가 이 기업과/직무에 맞는 사람인지

2. 이에 맞춰서 나의 어떤 점을 강조하여 지원할 수 있을지

 

 

📌디자인 직무 채용공고 분석하기
1. 관심 기업 혹은 업계를 리스트업 합니다. (5개 내외)
2. 주요 업무 / 자격 요건 / 우대사항 중심으로 직무 채용공고를 분석해 봅니다.

 

✅ 1. 올리브영

팀 소개	주요 업무	자격 요건	우대 사항
(UI/UX 디자인팀) UI/UX 디자이너 All Live Better, No.1 헬스&뷰티 스토어 올리브영은 20년 이상 축적된 경험과 데이터, 협력 체계를 바탕으로 이제는 국내를 넘어 글로벌 시장을 리딩하는 라이프스타일 플랫폼이자 새로운 옴니채널 사업자로 진화하고 있습니다. 올리브영은 앞으로도 끊임없이 변화하고 혁신하며 전 세계인의 건강한 아름다움을 큐레이팅하는 '글로벌 No.1 옴니채널 라이프스타일 플랫폼'을 향한 비전을 달성할 것입니다. 올리브영의 독보적인 오프라인 비즈니스를 기반으로 온라인 서비스를 결합하여 온·오프의 경계를 허무는 End-to-End 플랫폼을 함께 만들어가실 역량 있는 분을 모십니다.	• 올리브영 온라인몰 고객 및 관리자가 이용하는 프로덕트의 문제를 정성, 정량적으로 수집하여 주도적으로 개선 • 사용자 경험에 중심을 둔 UX 설계 Prototype 제작 및 UI 디자인 • 프로덕트 디자인 시스템 설계 및 라이브러리 관리	• 모바일 앱/웹 디자인 경력 7년 이상 혹은 그에 준하는 실력을 가지신 분 • 사용자 관점 및 비즈니스 이해를 통한 UX를 설계하고 시장에 출시해 본 경험이 있는 분 • 정량적, 정성적 데이터를 직접 수집해 서비스를 개선할 수 있으신 분 • PO, 개발자, 디자이너와 긴밀히 협업하여 전략을 도출하고 문제를 해결해 본 경험이 있으신 분 • 사용성을 지키면서 심미적인 UI와 인터렉션을 구현할 수 있는 비주얼 역량을 갖추신 분	• 정량적 혹은 정성적인 사용자 연구 및 분석 경험이 있으신 분 • 디자인 시스템을 기반으로 프로젝트를 진행해 보신 분 • 이커머스 관련 서비스 디자인을 해보신 분 • 백오피스 (관리자 화면) 디자인 경험이 있으신 분

 

✅ 2. 당근

팀 소개	주요 업무	자격 요건	우대 사항
(동네생활팀) 프로덕트 디자이너	- 온라인 게시판 콘텐츠 탐색과 소통을 활성화하기 위한 UI/UX 담당 - 사용자가 겪고있는 문제 수집 후 논리적인 사고 과정을 통한 더 좋은 해결책을 제안 - 데이터를 기반으로 문제점을 발견하고 A/B 테스트 등 실험을 통해 검증된 가설을 서비스에 반영 - 담당 프로젝트에 대한 오너십을 가지고 출시, 개선까지 전반 매니징	- 5년 이상의 Mobile/Web 서비스 디자인 경험이 있는 분 - 제품 설계 과정 전반에 걸쳐 사용자 경험을 책임지고 논리적인 커뮤니케이션이 가능하신 분 - 서비스 전체를 이해하고 사용자 중심으로 문제를 해결할 수 있는 분 - 당근의 서비스 가치를 이해하고 함께 서비스의 방향을 고민할 수 있는 분	- 데이터와 리서치를 기반으로 문제를 파악하고 서비스를 개선한 경험이 있으신 분 - 다양한 아이디어를 빠르게 화면으로 구체화하고 실험을 통해 검증해본 경험이 있으신 분 - 프로젝트를 리딩해본 경험이 있으신 분 - 먼저 의견을 제시하고 주도적으로 일하기를 즐기시는 분 - 온라인 커뮤니티를 운영해보거나 참여해본 경험이 있으신 분

 

 

✅ 3. 네이버

팀 소개	주요 업무	자격 요건	우대 사항
프로덕트 디자이너	- 사용자의 편의성과 파트너 환경 간의 균형을 고려하여 최적의 방식으로 서비스를 탐색 - 다양한 기기에서의 UI, GUI 및 디자인 업데이트 / 운영 등의 작업을 수행	- 2월 이내 졸업 예정인 학/석사 (전공 무관) - 또는 총 경력 1년 미만의 기졸업자 - 병역필 또는 면제자이며, 해외여행에 결격사유가 없는 분

 

 

✅ 4. 카카오

팀 소개	주요 업무	자격 요건	우대 사항
(카카오 모빌리티) 프로덕트 디자이너	- 라스트마일 배송 서비스(퀵,도보배송, 당일배송 등)의 전반적인 사용자 경험을 설계합니다. - 정성, 정략적인 데이터를 바탕으로 사용자가 겪는 문제를 정의하고 인사이트를 도출합니다. - 솔루션에 대한 가설과 UX 전략을 수립하고 검증 및 개선 과정을 반복하여 사용자에게 최고의 경험을 제공합니다.	- 7년 이상의 UX 설계 및 UI 디자인 경력이 있는 분 - 사용자 조사, 데이터 분석 등을 바탕으로 사용자가 겪는 문제를 구체적으로 정의한 경험이 있는 분 - 직접 솔루션에 대한 가설을 세우고 사용자 경험을 설계하여 개선한 경험이 있는 분 - 논리적인 커뮤니케이션으로 UX 전략을 제시하고 프로젝트를 리드할 수 있는 분	이런 분이라면 더욱 좋습니다 - 사용자의 온/오프라인 환경을 직접 경험하고 이를 바탕으로 사용성을 개선한 경험이 있는 분 - 주도적으로 의견을 제시하고 협업하는 것을 즐기시는 분 - 비즈니스에 대한 명확한 이해를 바탕으로 사용자 경험을 설계할 수 있는 분

 

 

3. 위에서 조사한 내용들에서 공통적으로 언급하는 역량을 정리해봅니다.

 

주요 업무	자격 요건	우대 사항
- 문제 수집 후 논리적인 사고를 통한 해결책 제시 - 정량적, 정성적 데이터를 기반으로 가설 설정 후 서비스에 반영 - 사용자 경험 설계  - UI 디자인	- 논리적인 커뮤니케이션이 가능하신 분 - 사용자 관점 & 비즈니스 관점에서 UX설계할 줄 아는 분 - 문제를 해결해서 개선한 경험이 있는 분 - 리서치, 데이터 기반하여 적극적으로 의견제시를 하시는 분	- 직접 사용자의 환경을 경험하여 개선한 경험이 있는 분 - 데이터, 리서치 기반하여 문제해결하고 개선한 경험이 있는 분 - 리딩하거나 주도적으로 의견을 제시하는 분

 

 

4. 프로덕트 디자이너가 하는 일은 무엇인지, 프로덕트 디자이너란 어떤 사람인지 나의 생각을 한 줄 정의

 

- 프로덕트 디자이너가 하는 일:

리서치와 수집한 데이터를 기반으로 문제점을 찾고, 사용자 관점 + 비즈니스 관점에서 가설을 설정하여 사용자의 편리함과 비즈니스 전략을 수립하여 제품을 개선시키는 업무를 한다.

 

- 프로덕트 디자이너란?

사업의 전반적인 업무의 이해도가 높아야하고 주도적인 의견제시와 논리적인 사고를 통해 문제를 해결할 줄 아는 끝판왕.

 

 

---

03 특강

프로덕트 디자이너가 개발을 알아야 하는 이유

프로덕트(제품)를 만들 때기획자 → 디자인 →  개발자 → QA → 기획자... 순으로 업무가 이루어진다.

 

 

위 이미지와 같이 우리가 개발자와 소통이 어려운 이유는 무엇일까?

 

1. 전문 용어의 차이: 같은 기능을 설명해도 사용하는 용어가 다름

ex)다이얼로그, 팝업, 알럿 ...

2. 기술적 제약: 👨‍🎨(디자이너)창의적인 디자인 VS 👨‍💻(개발자) 기술적 한계, 현실성

ex) 복잡한 애니메이션 요청 → 기술적인 한계로 구현 불가(성능 저하) → 왜 성능이 저하되지..?

3. 작업 흐름의 차이: 👨‍🎨(디자이너) 시각적 요소, 사용자 경험 중심의 디자인 VS 👨‍💻(개발자) 개발자 기능적 요소, 코드 중심으로 구현

ex) 다음주 데드라인! → 👨‍💻(개발자) 기술적으로 한계입니다. 이러이러한 절충안은 어떨까요? → 👨‍🎨(디자이너) 무슨 말이지? 납득이 안되는데...

 

🤔그렇다면.. 어떤 것을 배워야 가장 효율적인데?

 

*리액트 (React)

- 실제 많은 기업에서 가장 많이쓰는 라이브러리 중 하나. (React 42.87% / Next.js 17.3%) 흐름만 쓰윽~알기

- 전 세계 웹 프레임워크 중 사용량 1위

- 싱글 페이지 어플리케이션으로 빠른 속도, 서버 부하가 줄어들며 효율성이 높음

(전에는 페이지 마다 새로운 페이지를 계속 만들었지만, 리액트는 유저가 바뀐 페이지'만' 관련함.)

- 매번 페이지 새로고침 필요 없이 사용자가 느끼기에도 편리

ex)*이전 버전: '좋아요'눌렀을 때 사용자가 ' 전체 새로고침'을 눌러야만 '좋아요'동작으로 바뀐다. 개발자들은 '좋아요'버튼을 누를 시 새로고침 버튼을 동작하는 코드 구현

*리액트: '좋아요'눌렀을 때 바뀌는 부분만 새로운 정보로 바뀜 (인스타, 페이스북 등)

 

<리액트의 구조> 피그마가 제공하는 디자인 시스템과 유사!

- 리액트는 UI를 컴포넌트 단위로 나누어 개발함.

- 하나의 UI요소를 독립적인 블록처럼 생각할 수 있고, 이를 여러 군데에서 재사용 가능.

 

<UI의 동적인 변화를 위한 '상태관리'>

- 상태가 변하면 상태에 영향받는 컴포넌트는 모두 리랜더링(다시 그려짐)됨.- ex. 장바구니에 담긴 상품 수량이 바뀌면 뱃지 안의 숫자가 올라가거나, 담은 상품 총 가격도 실시간 계산되어 장바구니에 반영되게 할 수 있음.

 

 

---

 

Retrospect

 

😥 독학으로 공부했을 때 어떤 것을 먼저 공부해야할 지 몰라 헤맸는데

✔️그 기초를 차근차근 공부하니 이해되지 않았던 부분들이 서서히 이해되기 시작했다.

 

😥 특히 디자이너가 개발을 모르면 어쩔 수 없고 알면 플러스 요인이라고 생각했는데,
✔️ 개발을 알아야 하는 이유를 명확하게 설명해주셔서 공부 방향성을 잡는 데 도움됐다.

 

😥 프로덕트 디자이너의 역량 중, 커뮤니케이션을 중요시 하는 건 알겠는데... 구체적으로 어떤 식의 커뮤니케이션이 중요한 지 몰랐다.

✔️ 유관업무(개발)에 관련된 지식을 알고 있어야 해당 부서와 대화할 때 쉽게 이해할 수 있다. 이 부분을 '원활한 커뮤니케이션'이라고 많은 기업에서 설명하고 강조하는 부분인 것 같다. 
- TIP: 리액트로 프로젝트를 만들어 제출하여 커뮤니케이션을 잘 할 수 있는 사람이라는 증거를 만들어라!

 

😥 아티클을 봐도 기록하지 않고 휙- 넘기기만 했는데

✔️ 인사이트의 중요성을 알게됐다. 앞으로도 새로운 아티클 및 정보를 접할 때 어떤 인사이트를 얻었는지 사고하는게 좋겠다.