(DAY31) 린(Lean) UX 이해하기, 사례 살펴보기

안녕하세요 :)

갑자기 공기가 건조하고 차가워진 느낌이에요. 이제 가을 → 겨울로 넘어가는 느낌이 들었어요

오늘은 UX라는 큰 주제 안에서 ai트렌드도 살펴보고, 프레임워크도 알아보고 다양한 것들을 알아보는 시간을 가졌습니다.

특히 애자일 환경 속 린 UX는 무엇인지에 대해 공부했습니다.

 

---

 

✏️ 오늘의 학습

린UX 이해하기

실습 1) 앱 서비스 선정해서 UX Snaps 스타일로 UX분석해보기

실습 2) 영수증 or 청구서 UI 디자인

 

 

 

 

📖 오늘의 핵심

'과제를 위한 과제' 로 작업하지 말기.

느려도 좋으니 차곡차곡 내공 다지기

 

 

 

 

 

📝 수업 내용 메모장

 

수업 진도가 조금 빨라서 멘토님이 이것저것 트렌드를 가져오심

 

퍼플렉시티의 커넥티드 경험 디자인

https://yozm.wishket.com/magazine/detail/3377/

퍼플렉시티의 커넥티드 경험 디자인, ‘카페 큐리어스’ 방문기 | 요즘IT

 

- AI에 대한 사용자의 인식을 색다르게 접근함

(면접 볼 때 AI에 대한 생각 이야기 할 때 사례로 활용)

 

UXSnap : 수준별 UX분석해놓은 인사이트 모음 (현재 베타 릴리즈 서비스)

https://www.uxsnaps.com/

UXSnaps – Actionable UI/UX Breakdowns from Top Apps

 

 

워터폴vs 애자일 vs 린UX

https://www.nngroup.com/articles/lean-ux-agile-study-guide/

Lean UX & Agile: Study Guide

 

애자일 닐슨노먼그룹 영상 시청

https://www.youtube.com/watch?v=dhN5kVelcso

 

 

영상 화면 캡쳐

- 백로그 : 우선순위가 포함된 해야 할 일들을 말함

- 에픽 : 하나의 큰 주제, 큰 기능같은 덩어리를 의미함.

- 스토리 : 에픽을 여러개로 쪼갠 작은 덩어리..?

 

 

린 UX - 프레임워크

왜 린(Lean) UX인가?

https://medium.com/@tedlee1122/%EC%99%9C-%EB%A6%B0-lean-ux%EC%9D%B8%EA%B0%80-2bb962aec95e

왜 린(Lean) UX인가?

 

- 작게 만들고 빠르게 검증하는 방법임

- 린UX는 산출물(ex 보고서 등)을 중요하게 생각하지 않음

  (정돈된 문서가 없음, 사진 등으로 찍고 바로바로 메모하는 느낌)

 

 

📌피그마 UI 작업 및 파일 관리 팁

- 회사에서 포트폴리오 말고 평소에 작업한 파일을 요구하기도 함

- 아래 작업파일 처럼, UI 그리기 미션 + UX분석한 것들 정리해보기

https://www.figma.com/design/9JxwQaer7ptbje50wLXiqg/%EB%A0%88%EB%B9%84%ED%86%A0%ED%94%BC%EC%96%B4%EB%A6%AC-%EB%9D%BC%EC%9D%B4%EB%B8%8C%EB%9F%AC%EB%A6%AC?node-id=4-2&p=f&t=72fxs5Hj6ns1F0Aj-0

Figma

 

린 UX

닐슨노먼그룹 영상 시청

https://www.youtube.com/watch?v=Y_C9jKXUVnE

★

- 린UX는 애자일 팀에서 프레임워크라기보다는 UX 작업을 수행할 때 취해야 할 사고방식(접근법)에 대한 것임

 

 

새벽배송 실패사례

GBF (Get Big Fast) vs MVP (Minimum Viable Product)

- 돈이 많아서 망한 케이스

- 초반에 아이디어로 투자유치를 많이 받아서 돈이 많았음

- MVP 검증도 하지 않고 지점을 확대부터 함

https://yourstory.com/2014/09/webvan-e-tailer?utm_pageloadtype=scroll

 

💡무조건 작게 시작하고, 빠르게 검증하는 방식을 고수하게 된 계기가 됨. MVP, 린UX의 중요성을 알려주는 사례

 

 

+ UX 관련된 케이스 스터디 사례 사이트

- 실제로 있거나 있었던 서비스 위주로 소개

https://www.casestudy.club/case-studies/android-private-space

Android private space

 

안드로이드 private space 기능 사례 소개

https://www.dousanmiao.com/private-space

Dousan Miao | UX designer at Google

 

 

젬트레이드 사례

https://www.omarhassan.co/gemtrade

Gemtrade

 

 

 

 

 

실습 1) 앱 서비스 선정해서 UX Snaps 스타일로 UX분석해보기

💡저는 매일 아침 커피를 사오는데요, '메가커피' 앱 홈화면을 분석했습니다.

 

 

 

 

💡 난 이렇게 UX분석하는게 왜 이렇게 재밌는지 모르겠다.

생각보다 한 화면에 들어있는 UX 개념이 생각보다 많다는 것을 느꼈다. 과제에는 안넣었지만 저 화면에는 [시각적 계층 구조] 도 보인다. 상단은 감성적 이미지 배너, 중앙은 핵심 정보(스탬프,메가 월렛), 하단은 추천 메뉴로 구성되어 있다. 화면의 시각적 무게 중심을 자연스럽게 '노란색 (추천 메뉴) 영역'에 둬서 사용자가 주문 행동을 하도록 유도했다. (내용 정리하는 시간이 부족해서 과제에는 못넣었다 😭) 

 

아직 UX개념이 얼마나 있고, 내가 얼마나 알고 있는지 가늠이 잘 안된다. 오늘 수업시간에 보여주신 피그마 파일(UI 정리)을 참고해서 UX개념도 정리해놔야겠다는 생각을 했다.

 

 

 

 

 

실습 2) 영수증 or 청구서 UI 디자인

 

청구서는 제품이나 서비스를 제공하기 전후에 발송하는 결제 요청 문서

청구서는 견적서나 제안서가 아니므로, 불필요한 내용은 제외하고 결제에 필요한 필수 정보만 담아야 한다

 

< 포함해야 할 핵심 요소 >

• 서비스/제품 명세
• 금액 및 총액
• 결제 기한 (필요 시)
• 결제 방법

디자인 포인트

• 필수 정보는 깔끔하게: 사용자가 바로 결제할 수 있도록 핵심 정보만 단순하게 정리
• 감사 메시지: “함께해서 즐거웠습니다. 감사합니다!” 같은 긍정적인 멘트를 추가하면 사용자의 기분이 좋아짐
• 개인화: 친근한 관계라면, 밈(meme)이나 짧은 농담을 넣어 결제 요청이 덜 부담스럽게 만들 수 있음

디자인 목표

• 단순하면서도 신뢰감 있는 청구서 UI 제작
• 결제 프로세스에 긍정적인 경험 제공
• 브랜드의 톤 앤 매너 반영

 

 

 

 

 

💡 커피 주문앱 UX를 분석했으니, 이어서 커피 관련 앱을 뜯어보자! 싶어서 스타벅스 딜리버스 서비스를 써봤습니다.

전자영수증 화면을 기대했는데, 제 폰만 그런걸까요? '해당 전자영수증 정보는 준비중입니다.' 라는 문구만 뜨고 안뜨더라구요...그래서 중간에 캡쳐해둔 결제화면을 참고하면서 전자영수증 UI를 만들어봤습니다.

 

실제로 주문했을 때 받은 종이 영수증이 생각보다 길이가 길었다. 그래서 전자영수증에 한 화면에 담기에 어려움이 있었다. 그래서 밑에서 올라오는 형식으로 전자영수증을 디자인해봤다.

 

스타벅스로 직접 주문 → 앱화면 캡쳐 → 전자영수증 피그마 디자인까지 수업시간에 하다 보니 시간이 좀 부족해서 피드백을 못받아서 아쉬운 하루였다 😖