핵심 해석에서
세부 성향으로.
요약, 성향 분포, 요인별 위치를 순서대로 배치해 정보를 단계적으로 확인하도록 구성했습니다.
MOBILE EXPERIENCE DESIGN
knowtty
OVERVIEW
나를 알고,
함께할 사람을
알아보는 방법.
knowtty는 개인의 성향과 관계를 함께 살펴보는 서비스입니다. 검사 결과를 모바일에서 읽고, 상대의 프로필을 확인한 뒤 개인과 모임의 관계를 비교할 수 있도록 화면을 구성했습니다.
내 Life, 공유받은 프로필, 모임 결과, 모임 정보의 네 화면을 중심으로 정보의 위계와 이동 경로를 정리했습니다.
DESIGN OBJECTIVES
결과를 읽는 순서와
비교 대상을 명확하게 구분했습니다.
개인 결과의 이해, 상대 프로필의 확인, 모임 안에서의 비교를 서로 다른 단계로 정리했습니다.
각 단계에서 필요한 정보와 다음 행동이 드러나도록 설계했습니다.
단계적으로 읽는 결과명확하게 구분되는 대상비교로 이어지는 흐름
핵심 해석에서
내 결과와 상대,
모임의 구분.
사진과 이름, 영역별 제목으로 현재 확인하는 대상과 결과의 범위를 표시했습니다.
모임 전체에서
개인과의 비교로.
모임의 성향을 확인한 뒤 멤버 목록을 통해 선택한 상대와의 1:1 비교로 이동하도록 구성했습니다.
PROFILE EXPERIENCEA PROFILE, READY TO SHARE.
PersonalityLife
RelationshipProfileTogether
개인 성향과 관계 정보를 잇는 시각 언어.
PROFILE INTRO
BASIC SYMBOL
knowtty
knowttyUI DESIGN / PERSONAL EXPERIENCE
내 성향의 이해에서
상대의 프로필 확인까지.
개인 결과는 요약과 세부 정보로, 공유받은 프로필은 상대 확인과 함께 보기로 구성했습니다.
01 / MY LIFE요약에서 세부 성향으로
요약에서 세부 성향으로
이어지는 결과.
핵심 해석을 먼저 확인한 뒤 성향 분포와 요인별 위치를 읽도록 구성했습니다. 전체 경향과 세부 정보를 서로 다른 영역에 배치했습니다.
02 / SHARED PROFILE상대 확인에서
상대 확인에서
함께 보기로 연결.
상대의 핵심 성향과 키워드를 먼저 제시했습니다. 신규 검사와 기존 프로필의 진입 경로를 나누어 함께 보기로 연결했습니다.
PROFILE SUMMARY대표 해석과 키워드로
대표 해석과 키워드로
프로필의 핵심을 요약합니다.
색상은 키워드를 구분하며 성향의 우열을 뜻하지 않습니다.
UI DESIGN / GROUP EXPERIENCE
모임 전체의 성향과
나의 관계를 구분했습니다.
모임의 성향, 나와 모임의 핏, 구성원별 위치를 순서대로 배치했습니다.
멤버 목록에서는 선택한 상대와 나의 비교로 이동할 수 있습니다.
03 / GROUP RESULT모임의 전체 경향과
모임의 전체 경향과
개인의 기여를 함께 확인.
모임의 강점과 조율할 점을 먼저 제시하고, ‘나와 이 모임’을 별도 영역으로 구성했습니다. 구성원별 위치는 동일한 축에서 확인하도록 정리했습니다.
04 / GROUP MEMBERS구성원 확인에서
구성원 확인에서
1:1 비교로 이동.
사진과 이름으로 멤버를 확인하고 본인과 다른 구성원을 구분하도록 구성했습니다. 선택한 상대와의 비교 진입점을 목록에 배치했습니다.
비교의 기준은 나입니다.
모임 전체의 결과와 선택한 멤버와의 비교를 구분합니다.
VISUAL IDENTITY
두 원의 조합을
앱 아이콘으로 확장했습니다.
채운 원과 윤곽 원을 겹친 심벌을 흰색 앱 아이콘에 적용했습니다.
아이폰 홈 화면 목업으로 실제 사용 환경에서의 형태도 함께 제안합니다.
knowtty의 심벌
ICON FAMILY
사용 맥락에 맞춘 아이콘.
입체형과 플랫형을 함께 보여줍니다.
3D / REPRESENTATIVE
FLAT / FUNCTIONAL
COLOR & TYPOGRAPHY
블루를 중심으로
정보의 위계를 정리했습니다.
Brand Blue#2563EB
Soft Blue#E8F3FF
Ink#191F28