"기능 추가" 태그로 연결된 30개 게시물개의 게시물이 있습니다.

작업 일자: 2026-07-07 작업 브랜치: feature/1.54.0-list-redesign 설계 근거: RES-002 레퍼런스 조사 · UX-004 재설계

📋 작업 개요​

작업 유형: 페이지 전면 재구성 (2단계 — 페이지 단위 재구성 2호) 담당: jsg3121 + Claude

홈(PR #179)에 이어 /list를 개편. 조사(RES-002) → ux-designer 설계(UX-004) → DS 시안 → 시안 피드백 7건 반영 → 구현의 사이클. FilterBar·FilterModal·TypeChip 등 이 페이지를 위해 준비했던 DS organism이 실제로 조립된 첫 페이지다.

🎯 해결한 문제​

• [Critical] 카드가 fixed 헤더 뒤로 파고들어 잘림 — 데스크톱은 가변 높이 헤더에 고정 스페이서(h-44), 모바일은 검색창의 독자 fixed 레이어가 충돌하던 구조
• UA 분기 데/모 2벌 — 뷰·컨테이너·카드·필터·헤더까지 전부 2벌(ADR-0007 위반)
• ISR 1년 + headers() 공존 — revalidate 선언이 실효 없는 거짓 신호
• 순수 무한스크롤(푸터 접근 불가·위치 감각 상실), 모달 필터 적용 후 미표시, 빈 상태 재시도 동선 부재

작업 일자: 2026-07-06 작업 브랜치: feature/1.54.0-home-redesign 설계 근거: RES-001 레퍼런스 조사 · UX-003 재설계

📋 작업 개요​

작업 유형: 페이지 전면 재구성 (2단계 — 페이지 단위 재구성 1호) 담당: jsg3121 + Claude

DS(원자·organism) 구축 완료 후 첫 페이지 개편. 외부 레퍼런스 조사(RES-001) → ux-designer 재설계(UX-003) → DS 기반 시안(ui-publisher) → 구현의 사이클로 진행했다.

🎯 작업 목표​

• 홈의 UA 서버 분기 + 데/모 컴포넌트 2벌(ADR-0007 위반)을 반응형 단일 뷰로 통합
• 최근 유입이 많은 챔피언스를 폴드 위로 올려 유입 확대(사용자 결정)
• 홈 본문에 없던 콘텐츠 허브 진입(타입상성·기술·특성 등) 신설 — 내부 링크 권위 분배
• 광고가 폴드 최상단을 차지하던 문제 해소

작업 일자: 2026-07-01 작업 브랜치: feature/1.54.0-ds-organisms

📋 작업 개요​

작업 유형: 디자인 시스템 (organism 조립) 담당: jsg3121 + Claude

원자 DS 구축(라운드1·2·3) 완료 후, 원자를 조립하는 organism 단계의 첫 작업. 데/모 2벌로 분리돼 있던 챔피언스 상단 서브네비를 TabItem 원자로 조립한 CSS 반응형 단일로 통합한다(ADR-0007, UA 분기·display:none 없음).

🎯 작업 목표​

챔피언스 서브네비는 데스크톱(ChampionsSubNav)/모바일(ChampionsSubNavMobile) 2벌로 분리돼 navItems·pathname 매칭 로직이 중복됐다. 이를 TabItem(underline)을 배열로 조립한 단일 organism으로 합치고, 모바일에서 스크롤 없이 화면을 꽉 채운다.

작업 일자: 2026-07-01 작업 브랜치: feature/1.54.0-ds-organisms

📋 작업 개요​

작업 유형: 디자인 시스템 (organism 조립 + 원자 보강) 담당: jsg3121 + Claude

서브네비 organism에 이어, 데/모 2벌로 분리돼 있던 필터 모달·타입 필터 바를 CSS 반응형 단일 organism으로 통합하고, 포맷 탭을 TabItem(fill) 원자 조립으로 DS 규격화했다 (ADR-0007, UA 분기·display:none 없음). 조립에 필요한 타입 아이콘 토글은 TypeChip 원자로 먼저 규격화했다(ADR-0010 원자→조립).

🎯 작업 목표​

/list(도감)의 필터 UI는 필터 모달·타입 필터 바가 각각 데스크톱/모바일 2벌로 복제돼 있었고(모달은 크기만 다른 복붙, 바는 레이아웃까지 상이), 챔피언스 포맷 탭은 인라인 알약 스타일(border-2·rounded-full 임의값)이었다. 이를 원자 조립 기반의 반응형 단일로 재구축한다.

작업 일자: 2026-06-30 작업 브랜치: feature/1.54.0-ds-round3-atoms

📋 작업 개요​

작업 유형: 디자인 시스템 (원자 컴포넌트 신규/보강) 담당: jsg3121 + Claude

라운드1·2 후 organism 조립으로 넘어가기 전 원자 전수 재점검을 했더니, 폼 컨트롤 (Radio·Checkbox)과 PageHeader가 누락돼 있었다(story 없음 / 데·모 2벌 / 임의값). organism이 이 원자에 의존하므로 조립 전에 먼저 채운다(ADR-0010 원자→조립 순서).

🎯 작업 목표​

라운드1·2가 버튼·입력·탭·칩 위주여서 폼 컨트롤이 빠졌다. "이미 완성됐다"고 본 Radio/ Checkbox는 실제로 story 없음 + 임의값 잔존, PageHeader는 데/모 2벌이었다. 핵심 4개만 ADR-0010 기준(2곳 이상 + 자명)으로 구축한다.

작업 일자: 2026-06-29 작업 브랜치: feature/1.54.0-atomic-components-plan

📋 작업 개요​

작업 유형: 디자인 시스템 (원자 컴포넌트 신규 구축) 담당: jsg3121 + Claude

ADR-0010 원자 우선 DS 구축의 라운드2. 코드베이스 전수 조사로 실사용처가 있는 입력 컨트롤·아이콘 버튼만 원자화했다(추측 선제작 금지).

🎯 작업 목표​

라운드1(Button·LinkButton·TabItem·Chip)에 이어, 입력 계열 원자를 정리했다. 조사 결과 Modal/Dialog는 도메인별 body 구조가 제각각이라 **원자가 아닌 조립물(organism)**로 두고, 그 구성요소 중 반복되는 닫기 버튼만 원자로 추출했다. ModalOverlay(딤 배경 한 줄)는 추상화 이득이 없어 제외하고 Modal 조립 시 인라인 처리한다.

작업 일자: 2026-06-28 작업 브랜치: feature/1.54.0-atomic-components-plan

📋 작업 개요​

작업 유형: 디자인 시스템 (원자 컴포넌트 신규 구축) 담당: jsg3121 + Claude

ADR-0010 원자 우선 DS 구축의 라운드 1 #4. 코드베이스의 칩/뱃지를 전수 조사한 뒤, 실제 반복되는 "작은 라벨 칩"만 단일 원자로 통합했다.

🎯 작업 목표​

조사 결과 칩/뱃지는 색 처리 방식이 제각각이었다(동적 chip-type-, 정적 badge-damage-, 하드코딩 sky-400 등). 이를 무리하게 하나로 묶지 않고 역할별로 정리했다.

• 타입 칩(18종): 이미 Tag 컴포넌트가 담당 → 신규 제작 안 함(중복 방지)
• 필터 칩(세대/타입/이펙트, 선택 피드백): /moves 등 특정 페이지 한정 → 페이지 필터 컴포넌트로 유지(DS 원자 아님)
• 데미지 유형·세대 칩: 여러 페이지에서 같은 디자인 반복 → 단일 Chip 원자로 통합

작업 일자: 2026-06-25 작업 브랜치: feature/1.54.0-atomic-components-plan

📋 작업 개요​

작업 유형: 디자인 시스템 (원자 컴포넌트 신규 구축) 담당: jsg3121 + Claude

ADR-0010 원자 우선 DS 구축의 라운드 1 #1. 코드베이스에서 가장 제각각이고 빈번한 원자인 액션 버튼을 DS로 규격화했다.

🎯 작업 목표​

버튼/CTA는 코드베이스에 약 73회 등장하는데 스타일이 매우 불통일했다.

• 모서리: rounded-lg / rounded-md / rounded-full / rounded-[20px] / rounded-[0.725rem]
• 패딩: px-4 / px-[2rem] / px-3
• 높이: h-8 / h-12 / h-[3rem] / h-[4rem]
• 배경: bg-primary-1~4 / bg-[#b8bfc9]
• hover: hover:bg-primary-1 / hover:scale-[1.025] / hover:shadow-lg

이를 토큰 기반 신규 컴포넌트로 통일하고, 임의값([...])을 표준 토큰으로 정규화한다.

작업 일자: 2026-06-25 작업 브랜치: feature/1.54.0-atomic-components-plan

📋 작업 개요​

작업 유형: 디자인 시스템 (원자 컴포넌트 신규 구축) 담당: jsg3121 + Claude

ADR-0010 원자 우선 DS 구축의 라운드 1 #2. 버튼형 CTA 중 "페이지 이동"에 해당하는 링크 CTA를 별도 원자로 규격화했다.

🎯 작업 목표​

CTA에는 "클릭 액션"(<button>)과 "페이지 이동"(<Link>) 두 종류가 섞여 있었다. 시각은 동일하지만 의미가 다르다. 시각 스타일은 공유하되, 의미를 명확히 하기 위해 이동용 CTA를 별도 컴포넌트로 분리한다(예: "챔피언스 전체 도감 보기" 섹션 CTA).

작업 일자: 2026-06-25 작업 브랜치: feature/1.54.0-atomic-components-plan

📋 작업 개요​

작업 유형: 디자인 시스템 (원자 컴포넌트 신규 구축) 담당: jsg3121 + Claude

ADR-0010 원자 우선 DS 구축의 라운드 1 #3. 코드베이스의 탭 UI를 전수 조사한 뒤, "탭 항목 하나"를 active(선택됨) 상태를 가진 신규 DS 원자로 규격화했다.

🎯 작업 목표​

코드베이스에는 탭이 6곳에 제각각 구현돼 있었다(포맷 탭, 상단 서브네비 데/모 2벌, 메타 탭, 폼 탭 등). 모서리·패딩·배경·active 표시·hover가 전부 불통일이고, 모바일 상단 서브네비는 4개 항목을 화면 폭에 균등분할하다 라벨이 줄바꿈돼 글자가 깨졌다.

이들을 직접 추출·통합하지 않고, 서비스 UI를 고려해 탭 항목 원자를 새로 디자인한다. 버튼과 분리하는 이유는 탭이 버튼에 없는 active 의미축을 갖기 때문이다.