협업 & 프로세스

MVP 이후 디자인 QA 대응

피그마 오픈카톡방2026. 3. 7.

질문사항

MVP 이후 디자인 QA 과정에서 개발된 화면이 디자인 시안과 너무 다를 때 어떻게 대응해야 할까요? 위치와 요소는 맞지만 간격, 높이, 비율 등이 러프하게 구현된 경우, 모든 부분을 하나하나 수정 요청해야 할지 고민입니다.

개발된 화면이 디자인 시안과 크게 다를 때, 특히 간격, 높이, 비율 등 기본적인 디자인 가이드라인이 지켜지지 않은 경우 효과적인 대응 방법은 다음과 같습니다.

전체적인 불일치 시:

만약 특정 영역이 아닌 대부분의 페이지에서 디자인 시안과의 불일치가 발생했다면, 모든 부분을 하나하나 지적하기보다는 전체적인 재검토를 요청하는 것이 효율적입니다. 모든 디테일을 지적하는 것은 디자이너와 개발자 모두에게 큰 리소스 낭비가 될 수 있습니다.

소통 방법:

문제점 명확화: 몇 가지 대표적인 예시 화면을 캡처하여 디자인 시안과 비교하며, 어떤 부분이 어떻게 다른지 명확하게 보여줍니다. (예: '이 부분의 간격은 20px인데 30px로 적용되었습니다', '이 버튼의 높이는 48px인데 40px로 보입니다' 등)

영향 설명: 단순히 '다르다'고 말하기보다는, "현재 디자인 가이드라인이 제대로 적용되지 않아 QA 진행이 어렵고, 사용자 경험에 부정적인 영향을 줄 수 있다"는 점을 설명하여 문제의 중요성을 인지시킵니다.

전체 재검토 요청: 프론트엔드 개발자에게 전체적인 디자인 가이드라인 준수 여부를 재검토하고 수정해달라고 요청합니다. 이때, 디자인 시스템이나 가이드 문서가 있다면 함께 공유하여 참고하도록 합니다.

우선순위 협의: 만약 모든 수정이 어렵다면, 핵심적인 사용자 경험에 영향을 미치는 부분부터 우선순위를 정해 수정하도록 협의합니다.

사전 예방:

이러한 문제를 줄이기 위해 개발 시작 전 디자인 시스템(컴포넌트, 스타일 가이드)을 명확히 공유하고, 개발 초기 단계부터 주기적인 디자인 리뷰를 통해 싱크를 맞추는 것이 중요합니다.

Figma의 Dev Mode나 Zeplin, Storybook 같은 툴을 활용하여 디자인 스펙을 정확하게 전달하고, 개발자가 쉽게 참고할 수 있도록 하는 것도 도움이 됩니다.