[TIL] 1014 학습일지

[아티클 스터디]

https://techblog.gccompany.co.kr/%EC%97%AC%EA%B8%B0%EC%96%B4%EB%95%8C-%ED%8D%BC%EC%86%8C%EB%82%98%EB%8A%94-%EC%96%B4%EB%96%BB%EA%B2%8C-%EB%A7%8C%EB%93%A4%EC%96%B4%EC%A1%8C%EC%9D%84%EA%B9%8C-3c299cff3bc0

여기어때 퍼소나는 어떻게 만들어졌을까?

 

 

[주제]

여기어때의 퍼소나 제작기

 

[아티클 요약]

퍼소나(Persona)란?

특정 제품이나 서비스를 사용할 다양한 사용자를 실제로 관찰해서 얻은 정보를 바탕으로 만드는 전략적 가상의 인물 -’새로운 디자인 도구들’ 발췌

퍼소나 제작하기

step1. 제작 이유 정의

• 사용자 공감을 위해 제작하며, 제품 디자인하고 기획 타겟이 명확해짐
• 사용 목표, 동기, 잠재 수요를 정의하여 맞춤형 UX제공 가능
• 사용자 관점에서 우선순위와 의사결정을 빠르게 내리는데 도움
• 제작 동료들과 사용자에 대해 논의 시, 공통언어로 활용 가능

step2. 설문조사로 데이터 수집

• 숙소 예약 서비스 및 앱 이용 성향에 관한 질문
• 제품(여기어때)에 관한 질문
• 여행 경험 및 인구 통계학적 질문

[이슈]

1. 총 설문시간 설계는 9분 안쪽으로
2. 파일럿테스트를 통한 설문지 중립성 및 명확한 이해도 검수

→ 구매이력에 따른 light, moderate, heavy user로 분류, 20-40대 남/여 1,500명에게 배포

→ 설문조사 수집 데이터로 사용자 성향/행동 패턴 분석 및 그룹화

step3. 정량데이터 검증 후, 퍼소나 그려보기

• 데이터 인사이트팀과의 협업으로 실제 사용자 행동데이터와 비교, 분석→ 데이터의 신뢰도 상승
• 설문조사 결과를 키워드화, 데이터 연결에 댛 검토 및 데이터 정합성 확인(*데이터팀이 없을 경우, 신뢰도를 위해 ‘행동로그’를 꼭 확인할 것)

[Tip]

1. 데이터 요청: 데이터를 볼 수 있는 범위에 대한 커뮤니케이션 매우 중요
2. 데이터 해석: 후속데이터를 뽑아 사용자 패턴 해석 → 정성 리서치의 필요!

[인사이트]

• 제품에 적용할 실용적인 퍼소나를 만들기 위해서는 설문조사 전부터 철저하게 설계해야 하는구나
• 설문 이후에도 정량데이터와 비교해서 설문의 신뢰도를 검증해야 해당 데이터를 활용 가능하구나

---

[강의]체계적으로 배우는 피그마 기초 완전 정복 4주차

1-5강

 

컴포넌트 프로퍼티(Component Property)

1)컴포넌트 프로퍼티란?
- 변화/변경을 만들 수 있는 피그마 컴포넌트
- 일반상태: 의사상태, 혹은 버튼 컴포넌트 내 요소가 바뀌는 경우가 있음
- 위와 같이 상태나 일부가 변경될 때를 대비하여 갖춰두는 것

2) 쓰는 이유?
- 컴포넌트를 효율적으로 만들고, 효율적으로 운용하기 위함

3)Variants
- 변종이라는 뜻
- 컴포넌트의 여러 상태(마우스 오버, 누를 수 없는 상태 등)를 만들 수 있는 기능
- 즉, 가상의 상태를 만들 때 사용

4)Property
- 속성이라는 뜻
- 디자인 구조가 바뀌지 않는 선에서 변경할 수 있는 요소들 다룰 때 사용
- 기본 버튼에서 아이콘과 라벨만 변경하여 검색하기, 추천하기, 공유하기를 만드는 것처럼

a. Boolean(불리언): Yes or No 중 선택하는 형식으로, 해당 내용을 보여줄 것인지 끄고 키는 기능
b. Instance swap: 인스턴스를 다른 인스턴스로 교체하는 기능(버튼 내 아이콘을 변경하고 싶을 때)
c. Text: 컴포넌트 내 텍스트 수정 쉽도록, 컴포넌트 속성으로 만들어주는 것

★프로퍼티 or 베리언츠 어떤 것으로 만드는 것이 좋을지?
>디자인 토큰 '값'(파운데이션)이 변경되었는지가 포인트
컴포넌트에 적용된 파운데이션(색상, 간격, 폰트 등)이 변경되면 베리언츠로 만듦
ex)베리언츠로 [돋보기]검색하기 버튼을 만들어두었다면, 버튼이 추가될 때마다 베리언츠를 만들게 되어 효율적이지 X
파운데이션 값이 바뀌지 않았다면 프로퍼티로 조정
ex)버튼 내 아이콘만 변경, 버튼 내 아이콘 추가


버튼 컴포넌트로 베리언트를 만들 때에는 기본적으로 세가지를 만듦.

1.위계(Priority)
2.크기(Size)
3.상태(Status)