◀ 공썸 광고 전략 허브로 · Phase 3(스토어 문구) 보기 → · Phase 3-1(일반 소개팅앱 12곳) 보기 → · Phase 3-2(골프 특화 앱 6곳) 보기 →

🎨 Phase 3-3 — Play스토어 스크린샷 비주얼 디자인 가이드

Phase 3(Play스토어 문구) 딥다이브 · 2026-08-01 작성 · 2026-08-02 12차 개정 — 9차: 헤드라인 볼드, 피처 그래픽 §2-1 확정, #1·#2 실제 표지 파일, #3·#4 아이콘 벡터 렌더링, #6 실제 앱 캡처, #7·#8 확대 / 10차: 제목·아이브로우는 앱 브랜드 폰트(Jua), 나머지 굵은 글씨는 앱 실제 폰트(Pretendard-Bold) / 11차: #4 문구 실제 가입화면과 동시 수정, #5 잘림·PASS 문구·배지 정리, #6 아바타 다양화 / 12차: #6 인증회원 배지가 캡처 당시 구버전(초록 알약) 디자인이었던 걸 발견해 최신 코드 기준(배경 없이 흰 글씨+실제 아이콘)으로 다시 그림, #7 대화 내용이 앞뒤가 안 맞던 문제(매칭 성공 직후 "다음 분"을 묻는 모순) 전면 재작성

이 문서의 성격. 소유자가 D:\work\sales\apps\gongssum\assets\playstore\스토어.xlsx의 "스샷" 탭에 스크린샷 8장의 오버레이 캡션·화면 내용·참고 이미지를 직접 확정해뒀고, 이 문서는 그걸 "Figma로 어떻게 그려야 잘 나오는지" 다룬다. 단, 2026-08-01 5차 개정에서 소유자가 #3·#4·#8의 캡션을 직접 다시 지정했고(§5 각 카드에 변경 이력 명시), 문서 전체 성격은 유지된다. Phase 3 §13-3의 9장짜리 초안은 이 8장 확정본으로 대체됐다(Phase 3 문서 자체는 최초 기획으로 그대로 보존). 신규 Phase 4가 아니라 Phase 3의 세 번째 딥다이브다(Phase 3-1·3-2와 같은 트랙).
Executive Summary (BLUF)
목차
  1. 전체 사양
  2. 이미 제작 완료 — 피처 그래픽
  3. 피처 그래픽 대안 버전(텍스트로고)
  4. 비주얼 시스템 — 팔레트·폰트·템플릿 3종
  5. 참고 이미지 5종 분석
  6. 화면별 제작 가이드 (8장)
  7. 이미 준비된 소재 — 표지 아트웍
  8. Figma 작업 순서
  9. 프레임 스타일 최종 방향(아웃라인 제거)
  10. 확인 필요 사항

1. 전체 사양

Exhibit 1 — 스토어.xlsx "size" 탭 원본

항목수량비율가로(px)세로(px)안전 여백
스크린샷8장9:1610801920120px
피처 그래픽1장1024500

안전 여백 120px = 캡션·핵심 요소는 프레임 가장자리에서 120px 안쪽에 배치하라는 여유값이다(Play 콘솔이 기기별로 미세하게 다르게 크롭·리사이즈할 수 있어서). 8장 전부 이 안전 영역을 지키도록 Figma 프레임에 120px 가이드를 먼저 깔고 시작한다.

2. 이미 제작 완료 — 피처 그래픽

Exhibit 2 — 피처 그래픽 1024×500, Figma 실제 제작 완료

공썸 피처 그래픽
구성: 브랜드 대각선 그라데이션(#EC4899→#F97316) + 앱 아이콘(흰색 하트+골프공 글리프) + 로고타입 "공치고 썸타고"(Inter Bold, 흰색). Figma 파일 "공썸 Play Store 에셋"에 Feature Graphic 1024x500 프레임으로 존재 — 아래 §3의 템플릿·팔레트는 전부 이 파일에서 이미 검증된 토큰을 그대로 승계한다.

저장 위치: mobile/assets/store/feature-graphic.png. 스크린샷 8장도 같은 Figma 파일에 프레임을 추가하는 방식으로 이어서 작업하는 것을 권장한다(§7).

2-1. 피처 그래픽 최종안 — 벚꽃 배경 + 손글씨 텍스트로고 ✅

Exhibit 2-1 — 2026-08-01 제작, 표지(#1·#2)와 같은 벚꽃 골프장 아트웍 사용 · ✅ 8차 개정 — 최종 확정

피처 그래픽 텍스트로고 버전
구성: 배경은 assets/playstore/feature_graphic/feature_graphic_1024x500.png(벚꽃 골프장 + 핑크 골프백, #1·#2 표지와 같은 계열의 아트) 그대로 사용. 좌상단에 손글씨 태그라인 텍스트로고("두근두근 설레는 골프인연"), 그 아래 메인 로고타입("공치고 썸타고", 초록·핑크 손글씨체 + 하트 골프공 글리프)을 겹쳐 올렸다 — 둘 다 assets/assets/의 기존 완성 텍스트 PNG(투명 배경)를 그대로 가져다 스케일만 조정했다.

저장 위치: assets/playstore/feature_graphic/feature_graphic_1024x500_textlogo.png — 원본 배경 파일(feature_graphic_1024x500.png)은 건드리지 않았다. 8차 개정에서 소유자가 이 버전을 최종으로 확정 — 표지 #1·#2와 같은 벚꽃 아트웍을 쓰는 이 버전이 8장 갤러리와 톤이 이어진다. §2의 Figma 아이콘 버전은 초기 대안으로 그대로 보존한다.

3. 비주얼 시스템 — 팔레트·폰트·템플릿 3종

3-1. 브랜드 팔레트(피처 그래픽에서 확정된 토큰 재사용)

Pink #EC4899(그라데이션 시작)
Orange #F97316(그라데이션 끝)
White #FFFFFF(헤드라인·아이콘)
Ink #111827(밝은 배경 위 헤드라인)
Off-white #F7F5F2(카드형 배경)

참고 이미지 5종의 원색(파랑·보라·민트·회색)은 레이아웃만 빌리고 색은 위 팔레트로 재도색한다(§8에서 소유자 확인 권장) — 8장을 넘길 때 색이 이어지지 않으면 "같은 앱"이라는 인상이 약해진다.

3-2. 폰트 스케일 및 실제 서체(1080px 캔버스 기준) — 10차 개정

역할크기서체비고
아이브로우(작은 상단 라벨)42~60pxJua(@expo-google-fonts/jua)앱의 BrandText 컴포넌트가 실제로 쓰는 로고용 브랜드 폰트 그대로. 핑크 #BE185D
헤드라인(오버레이 캡션)62~96pxJua아이브로우와 같은 브랜드 폰트로 통일 — xlsx 캡션 원문 그대로, 2줄 넘지 않게 줄바꿈 조정
카드 내 굵은 글씨(제목·이름·라벨·버튼)26~52pxPretendard-Bold(mobile/assets/fonts/Pretendard-Bold.otf)앱이 닉네임·메뉴·하단 탭 등에 실제로 번들해 쓰는 폰트 파일 그대로(2026-07-22 SUIT 비교 후 확정된 폰트)
본문(설명·서브텍스트)25~36pxMalgun Gothic(대역)앱도 본문은 별도 폰트를 번들하지 않고 OS 시스템 폰트를 그대로 쓴다 — 기기마다 실제 렌더링이 다르므로, Windows 시스템 한글 폰트로 근사했다

Jua·Pretendard-Bold 둘 다 Windows 대체 폰트가 아니라 mobile/node_modules/@expo-google-fonts/jua·mobile/assets/fonts/Pretendard-Bold.otf 파일을 그대로 복사해 썼다 — 이제 스크린샷 안 굵은 글씨체가 실제 앱 화면과 동일한 서체다.

3-3. 템플릿 3종

템플릿레이아웃적용 화면근거
A · 풀블리드 표지형배경 아트 전체 채움, 폰 프레임 없음, 손글씨/볼드 텍스트가 화면 중상단에 얹힘#1, #2이미 준비된 벚꽃 골프장 아트웍(§6)이 이 문법 — 표지는 "앱 내부 화면"이 아니라 브랜드 무드를 보여주는 자리라 프레임이 오히려 방해된다
B · 보더리스 기능카드형브랜드 그라데이션 배경, 상단 아이브로우+헤드라인, 하단에 스트로크·노치 없는 흰 카드(코너 반경 32~40px)를 살짝 띄우고 그림자만으로 입체감을 준 뒤 그 안에 실제 UI 캡처 또는 재구성 화면 — 2026-08-01 소유자 지시로 아웃라인 폰 프레임 완전 폐기(§8)#3, #4, #6, #7참고 이미지1·3의 카드 배치 문법은 유지하되, 프레임 스트로크·노치를 빼서 실제 화면 캡처가 더 선명하게 보이고 8장 갤러리 톤이 더 가벼워진다
C · 플로팅 카드형브랜드 그라데이션 배경, 프로필/대화 카드 2장이 살짝 회전해 겹침, 배경에 흐린 태그 필(pill) 장식#5, #8참고 이미지5의 문법을 그대로 차용하되 배경만 보라·민트→브랜드 핑크·오렌지로 교체

4. 참고 이미지 5종 분석

아래 5장은 스토어.xlsx "스샷" 탭에 셀별로 첨부돼 있던 원본 그대로다 — 공썸 화면이 아니라 "이런 느낌으로 그려라"는 스타일 무드보드다. 어느 화면(#몇)에 어떤 참고 이미지가 달려 있었는지는 §5의 각 카드 안에 표시했다.

참고1 지인차단
참고 이미지 1 — #3에 첨부. 회색 배경 + 상단 아이브로우/헤드라인 + 둥근 사각형 아웃라인 폰 프레임 + 프레임 안 흰 카드에 큰 숫자("177명의 전화번호") + 인물 일러스트 + 하단에 리스트형 UI(항목+버튼). 템플릿 B의 원형.
참고2 보안 아이폰목업
참고 이미지 2 — #4에 첨부(옵션 A). 실제 아이폰 외형 목업 안에 어두운 UI, 캠페인 뱃지 필 2개, 3D 아이콘(경고 삼각형+방패). 무겁고 화려한 톤 — 공썸엔 과할 수 있어 참고만.
참고3 캡처차단
참고 이미지 3 — #4에 첨부(옵션 B, 권장). 아이브로우+헤드라인 + 폰 프레임 안에 블러 처리된 화면 + 캡처금지 아이콘 오버레이 — 공썸이 실제로 가진 화면캡처 차단 기능을 가장 직접적으로 보여줄 수 있는 문법. 템플릿 B + 실사 캡처로 그대로 재현 가능.
참고4 인증카드
참고 이미지 4 — #4(옵션 C)와 #6에 첨부. 3장 프로필 카드 캐러셀(가운데 확대) + 인증 뱃지 + 하단 신뢰 불릿 리스트(기관 로고·아이콘+라벨 3개). #6(PASS 인증)엔 이 하단 불릿 리스트 문법이 특히 유효하다.
참고5 플로팅카드
참고 이미지 5 — #5와 #8에 첨부(재사용). 그라데이션 배경 + 성격/관심사 태그 필이 흐릿하게 배경에 흩뿌려짐 + 프로필·대화 카드 2장이 기울어진 채 겹침. 템플릿 C의 원형.

5. 화면별 제작 가이드 (8장)

아래 캡션·화면 내용은 스토어.xlsx 원문을 그대로 옮긴 것이다 — 순서(#1~#8)도 엑셀 원본 순서를 그대로 따른다.

1
두근두근 설레는 골프인연
화면 내용: 표지
템플릿 A · 풀블리드 표지형✅ 8차 개정 — 실제 완성 파일 적용
8차 개정: 합성이 더 필요한 소재가 아니라, assets/playstore/screenshots/1_splash_screen1.png 실제 완성 파일을 그대로 쓴다 — 벚꽃 골프장 아트웍 위에 손글씨 카피("두근두근 설레는 골프 인연")와 하트 장식까지 이미 합성 완료된 최종본.
화면1 완성본
2
공치고 썸타고
화면 내용: 표지2
템플릿 A · 풀블리드 표지형✅ 8차 개정 — 실제 완성 파일 적용
8차 개정: assets/playstore/screenshots/2_splash_screen2.png 실제 완성 파일을 그대로 쓴다 — 같은 벚꽃 골프장 계열 아트웍(골프백·골프공 클로즈업)에 로고타입 "공치고 썸타고"가 이미 합성된 최종본. #1과 아트웍 크롭이 달라 두 장이 한 세트로 읽히면서도 똑같아 보이지 않는다.
화면2 완성본
3
지인 차단으로 안심
화면 내용: 연락처, 학교, 직장 차단(2026-08-01 소유자 지시로 문구 변경 — 원래 "여성은 무료, 지인은 차단")
템플릿 B · 보더리스 기능카드형참고 이미지 1✅ 8차 개정 — 아이콘 벡터 재현 + 하단 잘림 수정
아이브로우(직접 작성): "연락처 몰래 보는 걱정 없이" 5차 개정 — 실제 화면 캡처를 그대로 쓰지 않고 커스텀 리스트로 재구성: 소유자 지시로 실사 스크린샷 대신, 각 항목의 아이콘·순서·문구는 실제 차단 메뉴(지인 차단·같은 학교 차단·같은 직장 차단·차단한 회원) 그대로 가져오되 더 예쁘게 컬러 배지 + 개별 그림자가 있는 리스트 행으로 새로 그렸다. 제작 방법
  1. 배경: 브랜드 그라데이션, 아이브로우·헤드라인 폰트를 크게 키워(5차 개정) 상단 여백을 채웠다
  2. 카드 상단 Y좌표를 8장 전부 동일하게 통일(CARD_TOP_Y) — 카드 자체는 내용에 맞는 높이로, 짧으면 캔버스 안에서 자연스럽게 끝나도 되게 했다
  3. 4개 행 각각 아이콘 + 볼드 타이틀 + 회색 서브텍스트 + 화살표(›), 행마다 옅은 그림자를 넣어 하나씩 살짝 떠 보이게 했다
  4. 6차 개정 — 아이콘·행 크기를 더 키우고, 카드 맨 아래에 "언제든 설정에서 조건을 바꿀 수 있어요" 안내 배너를 추가했다
  5. 7차 개정 — 손그림 아이콘을 실제 앱 blocks-hub.tsx Row 아이콘과 같은 형태·색으로 다시 그렸다(당시엔 손그림 근사)
  6. 8차 개정 — 손그림 근사를 완전히 폐기하고 icon-registry.ts의 block_person·guide_book·admin·member SVG 원본을 그대로 벡터 렌더링(cairosvg가 Windows에서 동작하지 않아 rect/circle/path/line만 지원하는 자체 미니 SVG 렌더러 제작) — 이제 실제 앱 아이콘과 픽셀 단위로 동일하다. 아이콘 130px·타이틀 50px·서브 32px로 재확대하고, 카드 시작 Y좌표를 끌어올려 맨 아래 안내 배너가 화면 밖으로 잘리지 않고 여백을 두고 보이도록 고쳤다. 제목 볼드도 stroke를 얹어 더 두껍게 했다.
  7. 완성 시안: 아래 이미지 그대로 Figma에 옮기면 된다
화면3 시안
4
소중한 프라이버시, 12중으로 지켜드려요 / 국내 최대 안심장치로 또 한 번 안심
화면 내용: 안심장치 11종 아이콘 리스트(2026-08-01 6차 개정 — 소유자가 아이브로우·헤드라인 문구를 다시 나눠 지정)
템플릿 B · 보더리스 기능카드형참고 이미지 2·3·4✅ 8차 개정 — 항목 재정리 + 아이콘 벡터 재현 + 폰트 확대
아이브로우(6차 개정, 소유자 직접 지정): "소중한 프라이버시, 12중으로 지켜드려요" — 헤드라인(큰 글씨)은 "국내 최대 안심장치로 또 한 번 안심". 6차 개정 — 실제 가입 화면과 대조해 누락된 안심장치 2종을 추가, 총 11개 항목으로 확장했다가, 7차 개정에서 "사진 도용 AI" 항목을 #5에만 남기고 #4는 "지인·학교·직장 차단"으로 교체했었다. 8차 개정 — 소유자 지적으로 항목을 다시 정리했다: "지인·학교·직장 차단"이 #3과 완전히 중복돼 빼고, 그 자리에 실제 sign-in.tsx 최상단 안전선언 "100% 건전한 골프 매칭"(알바·조건만남 없는 건전한 매칭)을 새로 넣었다. "이성에게만 공개"와 "사진 승인 요청 회원에게만 공개"가 같은 항목이 두 번 노출되고 있던 걸 하나로 합쳐 "사진 승인 요청 회원에게만 공개"로 통일했다. "화면 캡처 차단" 문구도 실제 앱과 동일하게 맞췄다. "언제든 휴면·탈퇴"는 실제 앱의 물음표(help) 아이콘 대신, 이번 광고 준비 중 새로 그린 달 아이콘을 우리 핑크 라인 톤으로 재채색해서 썼다(다른 항목들과 아이콘 스타일을 맞추기 위한 의도적 선택). "비매너 회원 신고 및 차단" 문구는 그대로 유지. 제작 방법
  1. 배경: 브랜드 그라데이션, 헤드라인 2줄로 큼직하게
  2. 8차 개정 — 손그림 근사를 전부 폐기하고 icon-registry.ts SVG 원본(screen_protect·contact_private·search_blocked·audience_scope·trust_heart·warning)을 그대로 벡터 렌더링했다(#3과 같은 자체 미니 SVG 렌더러 사용). 텍스트는 타이틀 38px·서브 26px로 키우고, 행 높이·간격은 오히려 줄여(row_h 186→170px, gap 20→14px) 커진 글자에 비해 카드가 헐렁해 보이지 않게 했다. 10개 항목이라 카드가 캔버스 하단을 여전히 넘어가는데, 레퍼런스처럼 카드가 화면 아래로 자연스럽게 이어지는 느낌은 의도한 것이다.
  3. 완성 시안: 아래 이미지 그대로 Figma에 옮기면 된다
화면4 시안
5
허위 회원 ZERO
화면 내용: PASS 인증(2026-08-01 소유자 지시로 #5·#6 순서 교체 — 원래 6번이었음)
템플릿 B · 보더리스 기능카드형참고 이미지 4✅ 7차 개정 — 인증뱃지 대폭 확대 + 문구·순서 수정
아이브로우(직접 작성): "허위 프로필 걱정 없이" 5차 개정: 순서를 #6→#5로 옮기고, 자체 제작한 PASS 느낌 배지를 사용했었다. 6차 개정 — 자체 제작 배지 대신 실제 PASS 공식 아이콘을 그대로 가져왔다: 소유자가 "실제 pass 아이콘을 써달라"고 재지시 — SKTelecom이 Google Play에 공식 등록한 "PASS by SKT" 앱의 아이콘(play-lh.googleusercontent.com CDN, 개발자 본인이 스토어에 올린 공식 아이콘)을 그대로 받아와 썼다. 원본은 이 리포트의 assets/2026-08-01-playstore-visual-design/pass-icon-real-skt.png에도 보관했다. 카드 하단 "인증회원" 배지도 gongssum-verification-badge.png(하트+체크 메달) 실제 이미지로 교체했다.
⚠️ 법무 확인 권장. PASS는 SKT·KT·LG U+가 공동 운영하는 서비스 마크다. "공썸이 PASS 인증을 지원한다"는 사실을 알리는 지시적(nominative) 용도이지만, 실제 스토어에 업로드하기 전 Legal & Compliance 검토를 권장한다.
제작 방법
  1. 본인인증 통계(100% 완료율 · 0건 허위 신원) + 인증회원 배지 아래에 허위 회원을 막는 검증 절차 3가지를 리스트로 추가해 카드를 다른 화면들과 비슷한 높이로 채웠다
  2. 7차 개정: "인증회원" 배지가 실제 앱보다 너무 작다는 지적으로 아이콘을 96px까지 키웠다(카드폭 대비 실제 explore.tsx 비율 ~13%에 맞춤), 배지 안쪽 간격은 좁혀 존재감을 살렸다. "AI 사진 도용 검사"를 "도용 사진 AI 검수"로 이름을 바꾸고, 순서도 PASS 통신사 3사 본인인증 → 도용 사진 AI 검수 → 관리자 프로필 전수 검토 순으로 재배치했다.
  3. 완성 시안: 아래 이미지 그대로 Figma에 옮기면 된다
화면5 시안
6
남성 76.1%가 대표, 임원. 인증
화면 내용: 가상 남성 아바타 프로필 2장(2026-08-01 소유자 지시로 #5·#6 순서 교체 — 원래 5번이었음)
템플릿 C · 플로팅 카드형참고 이미지 5✅ 9차 개정 — PIL 재현 폐기, 실제 앱 캡처 2장으로 교체
9차 개정 — 완료. 소유자 지시대로 PIL 손 재현을 완전히 버리고, 실제 앱에서 캡처한 화면 2장을 그대로 썼다.
  1. 순수 테스트 계정 sample_m1@example.com에 두 가상 페르소나를 순서대로 입력했다 — 페르소나1 "필드위의신사"(178cm·78kg, 서울특별시 강남구, "매너 좋다는 얘기 자주 들어요..."), 페르소나2 "버디사냥꾼"(경기 성남시 분당구, "든든한 매력 있다는 소리 듣습니다..."). 두 페르소나 모두 인증회원(business_card_verified) 처리해 실제 배지가 뜨게 했다.
  2. 자동생성 타이틀(노란 글씨)은 직접 문구를 써넣지 않고, 자기어필 필드만 입력해 앱의 실제 자동생성 로직이 만든 문구를 그대로 썼다 — 관리자가 문구를 지어내지 않는다는 원칙([[feedback_no_invented_manager_phrasing]])을 캡처 소재에도 그대로 지켰다.
  3. 다른 테스트 계정 sample_f1@example.com으로 로그인해 실제 탐색(explore) 화면에서 카드1("필드위의신사")을 찾아 그대로 캡처했다 — 인증회원 배지·자동생성 타이틀·찜하기(핑크 채움)·매칭요청(흰 배경+핑크 테두리) 버튼까지 전부 실사다.
  4. 카드2("버디사냥꾼")는 탐색 추천 슬롯이 당일 배치 캐시라 방금 등록한 페르소나가 탐색 피드에 바로 뜨지 않았다 — 대신 프로필 상세 화면(같은 실제 UI, 사진+인증뱃지+자동타이틀+이름+받은 찜 수)을 캡처했다. 손으로 그린 요소는 전혀 없다.
  5. 작업에 쓴 sample_m1 프로필 데이터(닉네임·지역·자기어필·인증뱃지)는 캡처 완료 직후 원래 값으로 되돌렸다.
아이브로우(직접 작성): "직업까지 확인하고 만나요" — 5차 개정으로 다른 7장과 동일하게 아이브로우를 다시 넣었다(3차 개정에서는 없었음). 3~8차 개정 이력(참고용, 지금은 폐기됨): 배경을 코랄→브랜드 그라데이션으로 통일, 남성 기본 아바타(man1/man2.webp)로 손 재현, 실제 색상 토큰·찜하기/매칭요청 버튼을 단계적으로 맞춰나갔다 — 그래도 배지 디자인·버튼 크기·자동타이틀 정렬이 실제 앱과 계속 미묘하게 달랐다. 9차 개정에서 이 손 재현 방식 자체를 폐기하고 위 실제 캡처 2장으로 완전히 교체했다. 배치: 겹침 배율·회전은 #8과 같은 공식(place_card_pair)을 그대로 써서 카드1은 -6°, 카드2는 +5°로 겹치며 화면 하단으로 갈수록 커지게 배치했다 — 8장 갤러리 전체의 리듬을 유지한다.
화면6 시안
7
매니저가 케어까지
화면 내용: 매니저와 대화 화면
템플릿 B · 보더리스 기능카드형참고 이미지 없음✅ 9차 개정 — 대화 폰트 한 단계 더 확대
아이브로우(직접 작성): "혼자 두지 않아요" 실사 캡처 소스: 에뮬레이터로 실제 "사랑매니저" 채팅방 헤더와 말풍선 모양·색(수신: 연회색, 발신: 브랜드 핑크)을 그대로 옮겼다. 대화 내용은 가상의 다정한 케어 멘트로 새로 작성했다(말풍선 UI 자체는 실사 그대로). 5차 개정: 소유자 지시로 대화를 4턴 → 8턴으로 늘려 카드가 캔버스 하단까지 자연스럽게 채워지도록 했다. 제작 방법
  1. 배경: 브랜드 그라데이션, 헤드라인 "매니저가 케어까지"
  2. 카드 상단에 실제 채팅 헤더(💬 아이콘 + "사랑매니저") 재현, 하단에 수신·발신 말풍선 8개를 교차 배치
  3. 6차 개정 — 말풍선·헤더 폰트를 더 키우고(25→29px) 카드 폭·높이도 넓혀 화면을 더 꽉 채웠다
  4. 7차 개정 — 말풍선 폰트를 29→38px까지 키우고, 큰 글자에 맞춰 대화 내용도 짧고 자연스럽게 다시 썼다. 말풍선 안쪽 여백도 폰트 크기에 비례하도록 고쳤다(가로 1.15배·세로 0.85배).
  5. 8차 개정 — "더 키우고 더 두껍게"라는 지적으로 말풍선 폰트를 38→44px로 키우고 처음으로 볼드체를 적용했다(이전까지는 크기만 키우고 일반 굵기였다). 커진 말풍선에 맞춰 카드 높이도 늘렸다.
  6. 9차 개정 — 아이브로우("혼자 두지 않아요") 폰트도 다른 화면과 함께 확대(46→60px)했다.
  7. 완성 시안: 아래 이미지 그대로 Figma에 옮기면 된다
화면7 시안
8
1:1소개, 초청 모임, 원하는 사람과 함께
화면 내용: 1:1대화화면, 초청화면
템플릿 C · 플로팅 카드형참고 이미지 5✅ 9차 개정 — 대화 볼드 + 초청 아이콘 실사 교체
아이브로우(직접 작성, 2026-08-01 재작성): "1:1도, 모임도 원하는 대로" — 이전 "셋도 여럿도 아닌, 나에게 맞는 방식으로"는 뜻이 통하지 않는다는 소유자 지적으로 다시 썼다. 5차 개정 — 실제 캡처 대신 완전히 가상의 콘텐츠로 재구성: 카드 1(1:1 채팅)은 실제 대화가 아니라 가상 회원("정우, 33")과의 자연스러운 6턴 대화로 새로 썼고, 카드 2(초청)는 실제 캡처했던 사진 대신 자체 제작한 골프장 일러스트 썸네일로 채웠었다. 6차 개정 — 초청 카드 사진을 실제 남산 야경 사진으로 교체 + 초청글 재작성 + 인원 표기 수정: 일러스트 대신 assets/assets/namsan-night-view.png(남산타워 야경 실사 사진)를 썸네일로 사용했다. 소개글도 "야경 보면서 가볍게 저녁"이라는 짧은 문장에서 "남산타워 야경 보면서 도란도란 이야기 나눠요. 케이블카 타고 같이 올라가서 사진도 찍고, 근처에서 가볍게 저녁도 해요"로 실제 초청 글처럼 더 구체적으로 다시 썼다. 참여 인원 표기는 "여 2/4명"이 어색하다는 지적으로 "여 1/2명"으로 수정했다. 6차 개정 — #6과 겹침 레이아웃 통일: 두 카드가 겹치는 방식(회전각·위치)을 #6과 같은 공식(place_card_pair)으로 맞췄다 — 카드1이 위쪽에서 -6°, 카드2가 아래쪽에서 +5°로 겹치며 화면 하단으로 갈수록 커져 자연스럽게 잘리는 느낌을 8장 갤러리 전체에서 일관되게 가져간다. 7차 개정: 1:1 채팅 카드(카드1)의 말풍선이 테두리에 너무 붙어 있다는 지적으로, 말풍선 안쪽 여백을 폰트 크기 비례 계산으로 바꾸고(#7과 공통 로직) 대화 폰트도 27→32px로 키웠다. 초청 카드(카드2)도 제목·날짜·소개글·인원 필 폰트를 전부 한 단계씩 키웠다. 8차 개정 — "카드 안에 글자들 더 키워"라는 지적으로 두 카드 모두 한 번 더 확대했다: 카드1 대화 폰트 32→37px, 이름 38→42px. 카드2 제목 44→52px, 날짜·시간·장소 31→36px, 소개글 31→36px, "데이트·남성 부담"·참여 인원 필 33→38px, 마감·참여자 코멘트도 한 단계씩 키웠다. 커진 텍스트에 맞춰 두 카드 높이 모두 늘렸다. 9차 개정 — 카드1 대화 폰트를 37→42px로 한 번 더 키우고 #7처럼 볼드체를 적용했다. 카드2의 날짜·시간·장소 아이콘을 손그림(달력·시계·핀)에서 실제 초청(meetups) 목록 화면에 쓰이는 calendar·time·source 아이콘(icon-registry.ts 원본 벡터 렌더링)으로 교체했다. 제작 방법
  1. 배경: #6와 동일한 브랜드 그라데이션 — #6과 #8이 같은 템플릿 C를 쓰므로 갤러리 끝부분에 리듬감 있게 재등장
  2. 카드 1: 아바타(man3.webp, 얼굴 프레임 밖) + 이름 + 6턴 대화. 카드 2: 남산 야경 실사 사진 + 제목 + 날짜·시간·장소 아이콘 행 + 소개글 4줄 + 참여 인원 필("여 1/2명") + 마감 D-3 + 참여자 코멘트
  3. 완성 시안: 아래 이미지 그대로 Figma에 옮기면 된다
화면8 시안

6. 이미 준비된 소재 — 표지 아트웍

Exhibit 3 — assets/playstore/ 폴더 현황

파일용도상태
screenshots/1_splash_screen_background1_redrawn_1080x1920.png#1·#2 공통 배경(벚꽃 골프장, 핑크 골프백+하트 골프공)✅ 1080×1920 완성본
splash_screen/splash_screen_text_두근두근설레는골프인연.png#1 텍스트 레이어(투명 배경, 손글씨체)✅ 완성
splash_screen/splash_screen_text_공치고썸타고.png#2 텍스트 레이어(투명 배경)✅ 완성
splash_screen/splash_screen.png두 텍스트를 한 화면에 합친 버전(앱 실제 스플래시 화면)참고용 — #1·#2는 이걸 나눠서 각각 한 문구씩만 노출해야 함

이 파일들은 D:\work\sales\apps\gongssum\assets\playstore\ 아래에 있다 — 프로젝트 로컬 자산 폴더라 이 리포트 사이트에는 별도로 올리지 않았다(참고 이미지·피처 그래픽만 §4·§2에 표시).

7. Figma 작업 순서

  1. 기존 Figma 파일 "공썸 Play Store 에셋"(Feature Graphic 1024x500 프레임이 이미 있는 파일)을 그대로 이어서 사용 — 새 파일을 만들지 않아야 브랜드 토큰(그라데이션 색상값·폰트)을 다시 세팅하지 않아도 된다
  2. 템플릿 A·B·C를 각각 1080×1920 프레임으로 먼저 만들고, 안전 여백 120px를 레이아웃 가이드로 고정
  3. 템플릿 B는 "보더리스 카드"(스트로크 없는 흰 카드 + 그림자 이펙트)를 컴포넌트로 만들어 #3·#4·#6·#7에서 인스턴스로 복제 — 코너 반경·그림자 값을 한 곳에서 관리하면 4장의 톤이 어긋나지 않는다
  4. 실제 UI 캡처가 필요한 화면(#3·#4·#6·#7·#8)은 에뮬레이터로 해당 화면을 먼저 찍어 로컬에 저장한 뒤, 마스크로 프레임 안에 맞춰 넣는다
  5. 표지 2장(#1·#2)은 §6의 완성 소재를 그대로 배치만 하면 되므로 가장 먼저 완성해 전체 갤러리의 톤을 확정하는 기준으로 삼는 것을 권장
  6. 8장을 다 만든 뒤 축소 배율로 한 화면에 나열해 "넘기다 이탈하는" 갤러리 흐름이 자연스러운지 검토 — Phase 3-1 벤치마크가 확인한 "3번째 슬롯에 최강 증거" 원칙대로 배치돼 있는지도 함께 확인(문구 순서 자체는 xlsx 확정본을 따르므로 순서를 바꾸는 게 아니라 시각적 강약만 점검)

8. 프레임 스타일 최종 방향 — 아웃라인 완전 제거

Exhibit 4 — 최종 방향: 폰 프레임(아웃라인) 없이 보더리스 카드 + 그림자만

경위. 처음엔 A(심플 아웃라인+브랜드 컬러)/B(참고 이미지 원색)/C(두꺼운 베젤+노치) 3안을 실제로 그려 비교했고 A를 권장했다. 이어서 소유자가 A의 아웃라인 코너가 튀어나와 보이는 문제를 지적했고, 곧이어 레퍼런스 이미지(보더리스 그림자 카드 레이아웃)를 직접 첨부하며 "아예 아웃라인 자체를 없애"라고 재지시 — 그래서 스트로크·노치 비교 자체를 폐기하고, 처음부터 보더리스 카드로 다시 그렸다.
최종 보더리스 카드 예시

최종 방향: 카드에 스트로크·노치를 전혀 넣지 않고, 흰 카드를 배경 위에 살짝 띄운 뒤 소프트 그림자만으로 입체감을 준다. 코너 반경 32px, 그림자는 아래로 18~20px 오프셋 + 블러 30px 정도의 부드러운 값을 쓴다. §5의 #3·#4·#6·#7 시안 이미지가 전부 이 최종 스타일로 이미 만들어져 있다 — 별도 A/B/C 선택은 더 이상 필요 없다.

9. 확인 필요 사항

✅ 9차 개정으로 해결된 항목.
⚠️ 소유자 확인이 필요한 항목.

이 문서의 상세 개정 이력은 허브 문서에서 확인할 수 있다. 상태: 9차 개정 — 8장 전부 완료(#6 실사 캡처 포함), 남은 항목은 PASS 법무 확인·Figma 프레임 갱신뿐.