8월 24일~25일 주요 학습

1. 피그마
2. 서비스 기획
3. 개인 학습

1. 피그마

Basics

1. 도형을 처음 컴포넌트로 만들면 프레임으로 취급된다. 컴포넌트의 사각형을 변경하려면 더블 클릭을 해주어 프레임 내부의 도형을 직접 선택해주어야 한다.

Learning

1. Component

ex) Master Component > Instance(복사), Override(색 변경 등)
인스턴스의 색을 바꾸어도 마스터 컴포넌트에 반영되지는 않는다.
단, 속성에서 'Push to Main Component'를 고르면 마스터 컴포넌트까지 영향을 준다.
만약 컴포넌트와 인스턴스를 별개로 하고 싶다면, Detach instance를 하면 별도로 변경된다.

1. 일관성 유지
2. 재사용성
3. 디자인 시스템 구축
4. 빠른 수정 반영
5. 다양한 크기 변형 가능.

Deep-Learning

1. 컴포넌트로 바꾸니 도형 자체가 아니라 프레임으로 바뀐다. 도형으로 바꾸는 방법이 없는가?

컴포넌트를 취소하는 기능은 없어서 마스터 컴포넌트를 복사한 후 인스턴스를 만들어 그 인스턴스를 detach 하는 식으로 별도로 만들어어야 한다. 그러면 프레임 + 도형 조합으로 바뀌는데, 그 도형을 외부로 빼주면 된다.

2. 추천 플러그인

• reel content 더미데이터를 즉각 형성해줌.
• Unsplash 무료 스톡 이미지를 바로 넣을 수 있음.
• Iconify 앱에서 주로 쓰이는 앱 아이콘을 넣을 수 있게 함.
• forms 설문 형태를 만들어줌.

To learn

• horizontal, vertical padding : 각각 수평, 수직 여백.
• Container, Constraints, Auto-layout의 구분 : 좀 더 기술적인 부분. 이 정도 수준까지 익히려면 아무래도 UX/UI 디자이너의 길을 밟아야 하는 것이 아닐까...
• 사이드 스크롤을 할 때, 스크롤바가 연동되어 따라가는 모양을 만들고 싶다.

What is related?

• 포토샵, 일러스트레이터를 이용하여 디자인을 하는 것과 달리, UX/UI를 위한 디자인은 생각보다 더 번거로운 면이 많다. 약간의 위치를 옮기는 것도 같이 체크해야 할 부분들이 훨씬 많기도 하고. 아무래도 요소 하나 하나에 코드가 들어갈 수 있기 때문에 더욱 그런 부분이 있다.
  따라서 '내가 모든 것이 가능한 사람이다!' 라기보단, '이러한 내용도 알고 있어 소통을 원활히 할 수 있다'라는 점으로 접근해야만 할 것이다.
• 즉, '내가 잘해' 의 의미가 아닌 '나도 이해 해'라는 맥락으로서 이 지식을 가져야겠다.

참고자료

나리 사진을 이용한 사진 커머스 UI
https://www.figma.com/proto/HK2mcrYNBNaolwe7hk7j0u/Untitled?type=design&node-id=1-22&t=CCR9Ba7gSjojKT91-0&scaling=scale-down&page-id=0%3A1

2. 서비스 기획

Basics

• 사용자 중심의 서비스 기획..

Learning

• 이전의 '인터뷰 기법'을 통해 서비스 기획을 더 구체화하는 과정에 있다. MVP, PMF 등 시장성, 최소기능성 등을 다루었다면, 이제 어떤 유용성을 가진 프로덕트를 만들지 고려해야하는 부분이다.
• '나는 이것을 제공할 수 있다'는 이제 전처럼 큰 메리트를 갖지 못한다. 이제 사람들은 자신에게 핀포인트로 수요를 충족하지 않으면 다른 앱을 찾아나서거나, 기존 슈퍼앱에서 이탈할 필요성을 느끼지 못한다.
• 반대로 페인포인트를 단순하게 아우르는 것도 부족하다. 앱을 사용하는 데에 있어서 느끼는 일련의 체험-UX-가 일치하지 않으면 불편을 겪게 된다.
• 정성적 평가만 가지고(인터뷰) 경향, 혹은 딥한 상황을 이해할 순 있지만 개선을 위한 지표로 삼기에는 어려움이 많다. 인사이트를 얻는 수단은 되지만, 실제로 개선 전후의 임팩트를 객관적으로 비교하기에는 곤란한 것이다.
• 정량적 데이터로 치환하는 사고를 습관화해야겠다.

To Learn

• 인터뷰 설계 🔁 인터뷰 시행
• 인사이트 도출 ➡️ 헤더 정렬 ➡️ 슈퍼 헤더 정렬 ➡️ 페인포인트 도출

3. 부트캠프 이야기

적극적인 조원들과 진행하는 서비스 기획

'동물농장' 조가 처음 집중한 인사이트는 '반려동물 진료비가 비싸고, 탐색이 어렵다'는 것이었다.

하지만 해당 내용을 갖고는 진행하기가 어려웠다.
동물병원? 동물병원 진료비 비교? 수의사 중개?
이 한 줄의 인사이트로는 불충분하다.
만약 리소스가 충분하다면

지금 우리 상황은 SEED 투자를 받아야 할 스타트업과 마찬가지다.

따라서 수요가 있을 핵심 기능을 추려야한다는 뜻이다.
사람들이 동물병원의 진료비가 비싸다고 말하는 그 이면의 페인포인트는 무엇일까?
아쉽게도 현재의 데이터를 가지고는 충분한 판단이 어려웠고, 이를 해소하기 위해 인터뷰를 구상하였다.
전체적인 인터뷰 조사는 빠른 속도로 '시행, 점검, 보완'의 사이클로 가져갔다.

1. 프리 인터뷰

프리 인터뷰는 인터뷰를 시행하기 이전, 질문의 타당성과 적절한 인사이트 도출이 가능한지 확인하기 위해 시행하였다.
조원, 그리고 가까운 지인을 대상으로 진행하면서 질문의 전체포괄, 상호배제를 체크할 수 있었다.

2. 1차 본 인터뷰, 그리고 급한 마음으로 인한 인사이트 도출 미숙

그렇게 구성된 1차 본 인터뷰로 6명의 인사이트를 얻을 수 있었고, 해당 내용은 피그잼을 통해 서로 공유 및 헤더 배치를 진행하였다.
하지만 헤더를 정리하던 중 '솔루션 탐색' 단계로 급격하게 빠져버려, 인사이트를 충분하게 도출하지 못했다.
적절한 페인포인트를 발견한 순간, 빠르게 솔루션으로 도달할 수 있을 것이란 판단에 어느 순간부터 '인사이트'가 아닌 '솔루션'을 제시하게 된 것이다.
그러자 조원 다같이 덜 짜여진 인사이트를 토대로 솔루션을 추가하기 시작했다.
그렇게 짜여진 섹션의 피드백은 좋지 않았다.

어떤 인사이트, 페인 포인트를 토대로 진행하고자 하는지 와닿지 않는다.
현재 나온 모든 것을 짜넣는 것은 과하다. 핵심 기능을 추려야 한다.

하지만 실망과 달리, 좀 더 에너지를 쏟게 만들 추가적인 언급도 있었다.

펫케어 관련은 기대할 수 있는 것이 많고, 성장하는 시장이다.
모든 페인포인트가 아니라, 집중할 수 있는 곳을 찾아라.

그렇게 우리는 새로운 인사이트를 도출하기 위해 다시 한번 피그잼으로 모였다.

3. 인사이트 재도출 및 2차 본 인터뷰 구성

우리의 패착은 무엇이었을까? 인사이트를 제대로 도출하지 못했다는 점이다.
인사이트는 왜 제대로 도출되지 않았는가? 정성적 데이터의 양이 부족했고, 기존 내용도 덜 파악했기 때문이다.
따라서, 인터뷰 및 피드백을 거치며 좁혀지고 있는 '우리가 타겟하고자 하는 페인포인트'를 확인할 수 있게 인터뷰지를 재구성하고, 그에 대한 인사이트를 기반으로 다시 섹션을 구성할 것이다.

8월 28일, 보완된 2차 본 인터뷰 구성을 토대로 더 뾰족한 페인 포인트를 탐색한 후, 시장성 있는 프로덕트를 위한 프레임을 짜볼 것이다.