로딩 중...
로딩 중...
디자인 수정 요청이 끝없이 반복되는 상황을 해결한 경험을 공유합니다. **지옥의 수정 요청 사례** 프로젝트: 중소기업 홈페이지 리뉴얼 계약금: 800만 원 예상 기간: 4주 실제 기간: 12주 (3배) 수정 횟수: 27회 수정 요청 패턴: 1차: "전체적으로 괜찮은데, 색상이 좀..." 2차: "색상은 좋은데, 레이아웃이..." ... 27차: "처음 시안이 나았던 것 같은데..." **문제의 근본 원인** 1. 추상적인 피드백 ("좀 더 고급스럽게") 2. 의사결정권자 불명확 3. 계약서 미비 (수정 횟수 제한 없음) **해결책 1: 사전 정의 프로세스** 킥오프 미팅에서 반드시 합의: 1. 무드보드 작성 (선호하는 디자인 레퍼런스 5개) 2. 디자인 키워드 3개 선정 (예: 미니멀, 신뢰감, 모던) 3. 의사결정권자 1명 지정 **해결책 2: 계약서 강화** 필수 조항: - 1차 시안: 3개 방향 제시 - 방향 선정 후 수정 2회까지 무료 - 3회부터 회당 30만 원 추가 비용 단계별 확정: 1단계: 레이아웃 확정 (서명 필수) 2단계: 색상/폰트 확정 (서명 필수) 3단계: 콘텐츠 확정 (서명 필수) **해결책 3: 구조화된 피드백 양식** 클라이언트에게 제공하는 피드백 시트: - 전체 방향성 (O / X) - 레이아웃 수정 요청 (페이지 + 섹션 명시) - 색상 수정 요청 (Hex 코드 또는 레퍼런스) - 우선순위 (1~5점) **해결책 4: 실시간 협업 툴 활용** Figma 공유 + 댓글 기능: - 클라이언트를 Figma에 초대 (View 권한) - 수정 요청 부분에 직접 댓글 - 수정 히스토리 자동 기록 **해결책 5: 단계별 체크포인트** 1단계: 와이어프레임 (흑백) - 레이아웃만 확정 2단계: 스타일 가이드 - 색상, 폰트 확정 3단계: 주요 페이지 1개 - 톤앤매너 검증 4단계: 전체 페이지 - 일괄 제작 **실전 사례: 개선 후** 프로젝트: 스타트업 브랜딩 패키지 계약금: 1,200만 원 예상 기간: 6주 실제 기간: 6주 (정시 완료!) 수정 횟수: 5회 적용한 방법: - 킥오프에서 무드보드 + 키워드 합의 - 계약서에 수정 2회 제한 명시 - 단계별 확정 - Figma 실시간 댓글로 소통 **클라이언트 교육도 중요** "디자인은 집 짓기와 같습니다. 기둥 세운 후에 '방 위치 바꿔달라'고 하면 전부 다시 지어야 합니다." **현실적인 조언** 완벽한 계약서도 중요하지만, 가장 중요한 건 신뢰 관계입니다. 클라이언트가 "이 디자이너는 우리를 이해한다"고 느끼면, 수정 요청이 줄어듭니다. 여러분은 어떻게 클라이언트 피드백을 관리하시나요? 팁을 공유해주세요!
중소기업에서 처음으로 디자인 시스템을 구축하면서 배운 것들을 공유합니다. **왜 디자인 시스템이 필요했나** 우리 회사 상황: - 서비스: B2B SaaS (프로젝트 관리 툴) - 디자이너: 2명 - 개발자: 5명 - 문제: 같은 버튼이 페이지마다 다르게 생김, 색상 코드 중구난방 **기존 문제점:** 1. 디자이너마다 다른 스타일 가이드 2. 개발자가 임의로 색상/여백 조정 3. 신규 기능 추가 시 일관성 깨짐 4. 유지보수 비용 증가 (같은 컴포넌트를 매번 새로 만듦) **디자인 시스템 구축 프로젝트 시작** **1단계: 현황 조사 (1주)** - 전체 화면 200개 수집 - 사용 중인 색상: 47개 (실제 필요한 건 10개) - 버튼 스타일: 12종 (통일 가능) - 폰트 사이즈: 18종 (8종으로 축소 가능) **2단계: 디자인 토큰 정의 (2주)** **색상 체계:** - Primary: #1B3A5C (메인 브랜드) - Secondary: #4BACC6 (보조 액센트) - Gray Scale: 50/100/200/300/400/500/600/700/800/900 - Semantic Colors: Success/Warning/Error/Info **타이포그래피:** - Heading 1~6 (32px ~ 16px) - Body: Regular 14px / Small 12px - Line Height: 1.5 (본문) / 1.2 (제목) **간격 (Spacing):** - 4px 단위 체계 (4, 8, 12, 16, 24, 32, 48, 64) **3단계: Figma Tokens Studio 도입** Figma 플러그인으로, 디자인 토큰을 JSON 형식으로 관리하고 개발 코드와 동기화할 수 있습니다. **설치 및 설정:** 1. Figma 플러그인 → "Tokens Studio" 설치 2. GitHub 연동 (토큰 JSON 파일 버전 관리) 3. 토큰 세트 생성 (Global / Semantic / Dark Mode) **4단계: 컴포넌트 라이브러리 구축 (4주)** - Atoms: Button, Input, Badge, Icon - Molecules: Form Field, Card, Modal, Dropdown - Organisms: Navigation Bar, Table, Form, Dashboard Widget **5단계: 개발팀 협업** Style Dictionary로 Figma 토큰을 CSS/TypeScript 코드로 자동 변환: 개발팀 반응: ✅ 색상/여백 코드 복사 안 해도 됨 ✅ 다크 모드 전환 쉬움 ❌ 초기 학습 곡선 (개발자도 Figma 이해 필요) ❌ 기존 코드 마이그레이션 시간 소요 (3주) **성과 측정 (6개월 후)** - 신규 화면 디자인 시간: 3일 → 1일 (66% 단축) - 개발 시간: 5일 → 3일 (40% 단축) - 디자인 QA 이슈: 월 15건 → 3건 (80% 감소) **실패와 교훈** - 처음부터 완벽하게 만들려다 3개월 기획만 함 - 디자이너끼리만 만들어서 개발 적용 안 됨 - 과도한 추상화로 오히려 복잡해짐 **현실적인 조언** 디자인 시스템은 "완성"이 없습니다. 처음부터 100% 완벽하게 만들려 하지 말고, 가장 많이 쓰는 컴포넌트 5개부터 시작하세요. 여러분 회사는 디자인 시스템을 운영하고 계신가요? 경험담을 공유해주세요!
디자인 작업 효율을 크게 높여준 Figma 플러그인 5개를 소개합니다. 특히 Tokens Studio는 디자인 시스템 구축할 때 필수이고, Autoname은 레이어 정리를 자동화해줘서 협업할 때 매우 유용합니다. 각 플러그인의 장단점과 실무 활용 팁도 함께 정리했습니다.