# 끼리(KKIRI) 디자인 벤치마킹 보고서 작성: 쏠 · 2026-09-05 대상: `OUTBOX/KKIRI/mockup/` 비교: Doodle · Rallly · Loomio · Slido · Typeform · Airbnb Shared Wishlists --- ## 1. 결론부터 현재 끼리 목업은 **흐름과 기능은 탄탄하지만, 보이는 방식은 “모바일 설문 + 계산 결과표”에 가깝다.** 그래서 핵심 차별점인 “각자의 속마음을 지키면서 AI 대리인이 타협점을 찾는다”가 기능 설명으로는 보이지만 제품 인상으로는 약하다. 개선 방향은 새 장식을 더하는 것이 아니다. 화면 전체를 다음 세 막으로 다시 묶는 것이다. 1. **나만의 속마음** — 편안하고 안전하게 답한다. 2. **대리인 조율** — 원문을 공개하지 않고 지켜야 할 조건과 양보 가능한 조건을 맞춘다. 3. **우리의 결정** — 왜 이 안인지 이해하고 익명으로 재확인한다. 한 문장 디자인 원칙: > 설문처럼 묻고, 채팅처럼 꾸미고, 점수표처럼 끝내지 않는다. “봉인된 의견들이 안전한 교집합을 만드는 과정”을 보여 준다. --- ## 2. 현재 화면 진단 ### 잘된 점 - 홈에서 “답변은 아무에게도 보이지 않는다”를 첫 행동 전에 약속한다. - 한 화면 한 질문, 큰 선택 카드, 하단 고정에 가까운 주요 버튼은 모바일 입력에 적합하다. - 대기·마감·미응답·합의 불가·재조율 상태까지 빠뜨리지 않았다. - 공동 결과와 본인만 보는 대리인 리포트를 분리했다. - 최종 확정을 AI 추천과 분리하고, 사람에게 다시 묻는다. ### 가장 먼저 고칠 점 1. **하드 제약이 너무 작게 보인다.** 후보를 탈락시키는 중요한 선택이 일반 옵션 아래의 체크박스 토글이다. 사용자는 “선호”와 “절대 불가”의 결과 차이를 과소평가할 수 있다. 2. **조율 화면이 신뢰보다 연출을 앞세운다.** 떠다니는 🧠·🤝·💬와 대리인 대화 로그는 데모에서는 재미있지만, 실제 제품에서는 AI가 사람의 말을 만들어 내는 것처럼 보인다. 3. **결과 화면이 길고 우선순위가 평평하다.** 결론, 이유, 양보, 공정성, 차선, 제외 후보, 개인 리포트, 최종 의견이 모두 카드로 이어진다. 사용자가 가장 먼저 알아야 할 “무엇으로 정했고, 내 절대 조건은 지켜졌는가”가 수치 사이에 묻힌다. 4. **브랜드 모티프가 아직 없다.** 보라색 강조색, 흰 카드, 큰 라운드는 완성도는 높지만 범용 SaaS 문법이다. 검은 정사각형 로고와 `PRIVATE AGENT CONSENSUS` 문구만으로는 끼리만의 기억점이 약하다. 5. **모바일 목업을 벗어난 제품 화면이 없다.** 참가자 입력은 480px 단일 열이 맞지만, 방장의 현황과 최종 결과는 데스크톱에서 비교·관리할 수 있는 넓은 레이아웃이 필요하다. --- ## 3. 벤치마크 6종 | 제품 | 관찰한 디자인 패턴 | 끼리가 가져올 것 | 그대로 가져오면 안 되는 것 | |---|---|---|---| | **Doodle** | 링크 참여, `Yes / If need be / No`, 주최자 최종 선택 | 선호·양보 가능·절대 불가를 한눈에 구분하는 3상태 문법 | 많은 후보가 열로 늘어나는 표 형태. 끼리의 다축 조건을 표로 만들면 부담이 커진다. | | **Rallly** | 랜딩 첫 화면에 실제 투표를 넣고 `Create → Share → Vote and decide` 3단계로 설명 | 설명 전에 짧게 체험시키기, 계정 없는 링크 참여, 아주 짧은 개념 설명 | 일정 격자 중심의 도구 인상. 끼리는 시간만 고르는 서비스가 아니다. | | **Loomio** | `Agree / Abstain / Disagree / Block`, 선택 이유, 마감·리마인드·결과 기록 | 동의·조건부 동의·재조율의 의미를 명확히 쓰기, 이견을 구조화된 신호로 표현, 결정 기록 | 거버넌스 도구의 무게와 토론 중심 화면. 사적 모임에는 과하다. | | **Slido** | 익명성을 전면에 표시, 참가자 모드와 발표 모드 분리, 링크·코드 진입 | “지금도 익명” 상태를 입력 내내 표시, 방장과 참가자 화면의 목적을 분리 | 행사 도구 같은 관리자 중심 톤과 초록 단색의 업무 도구 인상 | | **Typeform** | 한 번에 한 질문, 대화형 문구, 조건부 후속 질문 | 개인 입력 구간의 집중, 짧은 문장, 답에 따른 즉시 설명과 분기 | 배경 이미지·브랜드 장식이 질문보다 강해지는 것 | | **Airbnb Shared Wishlists** | 실제 후보 카드, 메모와 투표, 감성적인 초대 | 결과 후보를 장소·시간·비용이 보이는 구체적 카드로 표현, 초대를 기대감 있는 경험으로 만들기 | 사진의 매력도가 공정성·제약보다 강하게 순위를 왜곡하는 것 | ### 벤치마크가 비워 둔 자리 비교 제품은 각자 한 구간을 잘한다. 그러나 아래 다섯 단계를 하나로 연결하지는 않는다. ```text 내 답변은 비공개 ↓ AI가 선호 / 상한 / 금지로 구조화 ↓ 절대 안 되는 후보를 먼저 제외 ↓ 남은 후보에서 가장 불리한 사람을 보호 ↓ 이름 없는 재확인으로 사람이 끝낸다 ``` 이 연결 자체가 끼리의 디자인 자산이다. --- ## 4. 권장 디자인 콘셉트 — “봉인된 원탁” ### 핵심 이미지 - 각 참가자의 답변은 **봉인된 카드**다. - AI 대리인은 봉인을 뜯어 공개하는 캐릭터가 아니라, 카드에서 **조건만 추출하는 중개자**다. - 공동 결과는 여러 카드가 겹친 가운데 생기는 **교집합 영역**이다. - 최종 재확인은 원탁 둘레의 점이 하나씩 채워지는 모습이다. 이름은 보이지 않고 참여 수만 보인다. ### 화면에서의 역할 색 | 역할 | 권장 색 | 용도 | `#FAF8F4` 대비 | |---|---|---|---:| | 나의 비공개 정보 | Violet `#684DEB` | 개인 답변, 내 리포트 | 5.14:1 | | 공동 합의 | Teal `#0F766E` | 합의안, 완료, 충족 조건 | 5.16:1 | | 상한·거부권 | Rust `#B93815` | 반드시 지킬 조건, 탈락 사유 | 5.44:1 | | 보조 정보 | Warm gray `#6B6560` | 설명, 메타 정보 | 5.42:1 | 현재 `#7057ff`를 종이색 `#fbfaf8` 위 일반 텍스트로 쓰면 대비가 4.48:1로 AA 4.5:1에 근소하게 못 미친다. `#684DEB`로 어둡게 조정하면 보라색 인상을 유지하면서 대비를 확보할 수 있다. ### 형태·타이포 원칙 - 카드 반경을 모두 20~24px로 통일하지 않는다. 입력 카드 16px, 정보 묶음 12px, 중요한 결과 카드만 24px로 계층을 만든다. - 그림자는 부유하는 선택지보다 모달·초대 시트처럼 실제로 위에 뜬 요소에만 쓴다. - 이모지는 시제품 표식에 한정하고, 제품 UI는 같은 굵기의 선 아이콘으로 교체한다. - 제목은 지금처럼 굵고 짧게 유지한다. 설명은 한 문단 2줄을 넘기지 않는다. - 시간·인원·마감 숫자는 고정폭 숫자를 사용해 상태가 바뀌어도 폭이 흔들리지 않게 한다. --- ## 5. 화면별 적용안 ### A. 홈 현재는 서비스 설명 뒤에 `팀 워크숍 / 여행 / 회식` 장르 카드가 바로 나온다. 장르 선택 전에 끼리의 작동 원리를 보여 줘야 한다. 권장 첫 화면: ```text [끼리] 서로의 속마음은 숨기고, 모두가 납득할 안을 찾아요. [봉인해 답하기] → [AI가 교집합 찾기] → [함께 확인하기] [새 결정 시작] [초대 링크로 참여] ``` - Rallly처럼 첫 화면에서 “3단계”가 눈에 들어오게 한다. - 방을 만드는 사람과 초대받은 사람의 진입을 처음부터 나눈다. - `PRIVATE AGENT CONSENSUS`는 제품 언어가 아니라 설명용 분류처럼 보인다. 한국어 핵심 약속을 먼저 두고 영문은 브랜드 보조 문구로 내린다. ### B. 질문 현재의 한 화면 한 질문 구조는 유지한다. 대신 답을 다음 세 의미로 통일한다. ```text ○ 좋아요 / 선호해요 △ 필요하면 양보할 수 있어요 × 이 조건은 어려워요 ``` 시간·예산에서만 쓰는 `상한 켜기` 체크박스는 다음처럼 큰 의미 선택으로 바꾼다. ```text 선택한 5만원은… [가능하면 맞춰 주세요] [반드시 넘지 말아 주세요] 후보 탈락에 사용됨 ``` - Doodle·Rallly의 3상태 문법을 끼리의 `선호 / 양보 / 거부`에 맞게 변형한다. - 거부권을 선택하면 rust 색 테두리와 “이 값을 넘는 후보는 제외돼요” 문장을 즉시 보여 준다. - 자유서술 구조화 뒤에는 `이렇게 이해했어요`만 보여 주지 말고 `[맞아요] [수정할게요]`를 둔다. - 진행바에는 `4/7 · 약 1분 남음`처럼 남은 부담을 같이 알린다. ### C. 대기실 - 참가자에게는 `내 답변 완료`, `3/4명 제출`, `마감까지 6시간`만 먼저 보여 준다. - 방장에게는 미응답자와 리마인드 버튼을 보여 주되, “누가 무엇을 답했는지 볼 수 없음”을 같은 카드에 고정한다. - Slido처럼 참가자 모드와 방장 모드를 명확하게 분리한다. 현재 목업 시뮬레이터에만 있는 역할 구분을 실제 제품 상단 상태로 승격한다. ### D. 조율 중 떠다니는 이모지와 대화 로그 대신, 검증 가능한 네 단계로 바꾼다. ```text ✓ 답변을 선호·상한·금지 조건으로 바꿈 ✓ 절대 조건과 충돌하는 후보 2개 제외 ● 남은 후보 3개의 공정성 비교 중 ○ 결과 이유를 익명 문장으로 정리 ``` - 화면 중앙에는 봉인된 참가자 토큰들이 교집합으로 모이는 짧은 모션을 쓴다. - “대리인 A가 말했다” 같은 가상 대사는 없앤다. - 원문 비공개, 규칙 계산, 설명 생성의 경계를 한 줄씩 표시한다. - 30초가 넘으면 로딩을 지속하지 않고 규칙 기반 결과로 전환됐다는 배너를 보여 준다. ### E. 결과 결과 페이지는 다음 순서로 재배치한다. 1. **결론 카드** — 장소, 일정, 1인 예산, 이동을 한 화면에 2. **지켜진 약속** — 절대 조건 모두 충족 여부 3. **이 안이 이긴 이유 3개** — 사람 수가 아닌 조건 단위 익명 문장 4. **내 관점** — 본인만 보는 대리인 리포트 진입 5. **다른 후보 비교** — 접힌 상태 6. **최종 재확인** — 화면 하단 고정 CTA 공정성 수치는 다음처럼 번역한다. - 현재: `최저 만족도 61.5 / 평균 만족도 74.1 / 후보 점수 공식` - 권장: `가장 아쉬운 사람도 수용 가능한 범위예요` + 작은 막대 - 원식과 소수점은 `계산 기준 보기`에서만 공개한다. Airbnb처럼 후보를 구체적인 카드로 보여 주되, 사진보다 일정·비용·이동·충족 조건이 먼저 보이게 한다. ### F. 내 대리인 리포트 - 보라색 개인 영역으로 공동 결과와 시각적으로 분리한다. - 상단에 `본인만 볼 수 있음`과 데이터 보관·삭제 시점을 함께 표시한다. - “내가 얻은 것 / 양보한 것 / 끝까지 지킨 것” 세 묶음으로 정리한다. - 다른 사람을 추론할 수 있는 단서와 정확한 개인 점수는 보여 주지 않는다. ### G. 최종 재확인 Loomio의 선택 의미처럼, 버튼 이름만으로 행동 결과가 이해되어야 한다. | 선택 | 화면 문구 | 시스템 결과 | |---|---|---| | 동의 | **이 안으로 좋아요** | 동의 1 증가 | | 조건부 | **실행 조건이 있으면 좋아요** | 공개 가능한 실행 조건 한 줄 입력 | | 재조율 | **이 조건은 다시 맞춰야 해요** | 비공개 조건 추가 후 1회 재계산 | - 세 버튼에 체크·말풍선·되돌림 아이콘을 각각 써서 스캔을 돕는다. - 결과 집계는 이름 대신 `동의 3 · 조건부 1 · 재조율 0`으로 보여 준다. - 방장에게만 `확정` 권한과 기권 처리 설명을 보인다. ### H. 합의 불가 “실패”보다 다음 행동을 선명하게 보여 준다. ```text 모든 절대 조건을 함께 지킬 후보가 없어요. [내 조건 하나 다시 보기] [그룹에 재조율 요청] ``` 누구의 거부권 때문인지 추론되지 않도록 후보별 개인 사유 대신 충돌한 **조건 범주 수**만 보여 준다. --- ## 6. 추천 정보 구조 | 단계 | 참가자 화면 | 방장 화면 | 공동으로 보는 것 | |---|---|---|---| | 시작 | 약속 확인, 이름 | 주제·인원·마감 설정 | 방 제목, 참여 인원 | | 입력 | 한 화면 한 질문, 구조화 확인 | 제출 현황만 | 완료 인원 수 | | 대기 | 내 대리인 요약 | 미응답·리마인드 | 마감 시간 | | 조율 | 단계 진행 | 단계 진행 | 규칙과 익명 처리 설명 | | 결과 | 공동 결론 + 내 리포트 | 공동 결론 + 운영 액션 | 결론, 이유, 충족 조건 | | 재확인 | 3개 의미 선택 | 익명 집계, 확정 | 합계와 마감 | | 완료 | 개인 실행 정보 | 공유·캘린더·체크리스트 | 최종 결정 기록 | --- ## 7. 구현 우선순위 ### P0 — 데모 설득력을 바로 바꾸는 것 - 시간·예산 상한을 작은 체크박스에서 `선호 / 반드시` 의미 카드로 변경 - 조율 로그를 4단계 검증 진행 화면으로 변경 - 결과 첫 화면을 `결론 → 지켜진 약속 → 이유 3개`로 재배치 - 최종 재확인 3개 선택의 의미와 결과를 버튼 안에 명시 - 일반 텍스트 대비가 부족한 보라색과 주황색 조정 ### P1 — 제품 신뢰를 만드는 것 - 홈에 3단계 개념도와 `새 결정 / 초대 참여` 2개 진입 추가 - 방장·참가자 모드를 실제 UI에서 분리 - 모든 입력 화면에 익명 상태와 데이터 사용 범위를 짧게 고정 - 개인 리포트에 보관·삭제 시점 표시 - 결과와 방장 현황의 데스크톱 2열 레이아웃 추가 ### P2 — 브랜드와 확장성 - `봉인된 원탁` 모티프의 로고·아이콘·모션 개발 - 후보 카드에 장르별 이미지·지도·시간 정보 추가 - 워크숍 외 여행·회식 템플릿별 질문 시각화 - 결정 기록과 재방문 화면 설계 --- ## 8. 발표에서 보여 줄 60초 디자인 장면 1. 홈에서 세 단계 개념을 3초 안에 이해시킨다. 2. 참가자가 예산 `5만원`을 고르고 `반드시 넘지 말아 주세요`를 선택한다. 3. 자유서술을 AI가 조건 태그로 바꾸고 참가자가 직접 확인한다. 4. 봉인된 참가자 토큰이 모이고, 후보 제외 → 공정성 비교 → 이유 정리 단계가 진행된다. 5. 결과 화면에서 `절대 조건 4개 모두 지킴`과 최종안을 먼저 보여 준다. 6. 참가자가 `실행 조건이 있으면 좋아요`를 누르고, 이름 없는 집계가 올라간다. 이 장면이면 끼리가 단순 다수결도, 익명 설문도, AI 채팅도 아니라 **“비공개 조건을 지키는 합의 인터페이스”**라는 점이 한 번에 드러난다. --- ## 9. 출처 - Doodle Group Poll: https://doodle.com/en/product/polls/ · https://help.doodle.com/en/articles/9457279-how-do-i-participate-in-a-group-poll - Rallly: https://landing.rallly.co/ · https://support.rallly.co/introduction - Loomio: https://www.loomio.com/features/ · https://www.loomio.com/docs/en/user_manual/polls/intro_to_decisions - Slido: https://www.slido.com/features-live-qa · https://community.slido.com/security-privacy-essentials-224/participant-privacy-choose-anonymous-or-named-participation-1609 - Typeform: https://www.typeform.com/hello · https://help.typeform.com/hc/en-us/articles/38099463383188-How-to-add-multiple-questions-to-a-form-page - Airbnb Shared Wishlists: https://news.airbnb.com/airbnb-2024-summer-release-highlights - 현재 목업: `OUTBOX/KKIRI/mockup/app.js`, `OUTBOX/KKIRI/mockup/styles.css`, `OUTBOX/KKIRI/mockup/shots/`