
[DAN 24] 데이터 기반으로 지속 성장이 가능한 네이버 검색 FE 시스템 구축하기
네이버 검색 FE 시스템의 반복 작업과 UI 중복, 느린 피드백 문제를 해결하기 위한 구조를 정리했습니다. 서버 주도 UI, 디자인 시스템, 데이터 기반 개선과 Design To Code 자동화를 함께 소개했습니다.

네이버 검색 FE 시스템의 반복 작업과 UI 중복, 느린 피드백 문제를 해결하기 위한 구조를 정리했습니다. 서버 주도 UI, 디자인 시스템, 데이터 기반 개선과 Design To Code 자동화를 함께 소개했습니다.

디자이너와 개발자의 리소스 관리를 일원화하기 위해 3단계 토큰 기반 디자인 시스템을 구축했습니다. Figma와 코드, Storybook을 연결해 테마 전환과 컴포넌트 커스터마이징을 유연하게 운영했습니다.


디자인 시스템 운영이 단순한 컴포넌트 관리가 아니라 프로덕트 운영에 가깝다는 점을 짚었습니다. 버전 추적과 가이드 부족, 이슈 처리 부재로 생긴 비효율을 정리했습니다.


Figma Slides를 디자이너 관점에서 테스트하며 팀 도입 가능성을 살펴보았습니다. 기존 툴의 한계를 보완하면서 협업과 수정 효율을 높일 수 있다는 점이 인상적이었습니다.

디자인 토큰을 Figma에서 정의하고 GitHub Actions와 token-transformer로 자동 변환하는 과정을 소개했습니다. 또한 Panda CSS에 맞게 토큰을 재구성해 디자인 시스템에 연결한 흐름을 설명했습니다.

QueryPie PM의 업무 방식과 협업 도구, 요구사항 관리 흐름을 소개했습니다. 고객 VoC부터 릴리즈 조율까지 제품 관리에 필요한 역량도 함께 정리했습니다.
쿠팡 파트너스
이 게시물은 쿠팡 파트너스 활동의 일환으로, 이에 따른 일정액의 수수료를 제공받습니다.

Figma를 중심으로 기획, 디자인, 개발, QA를 실시간으로 연결하는 협업 방식의 장점을 소개했습니다. 과거의 파일 공유와 버전 관리 문제를 줄이고 생산성과 일관성을 높이는 흐름을 설명했습니다.

QueryPie PM이 고객 요구를 제품으로 옮기기 위해 어떤 방식으로 일하는지 소개했습니다. Jira, Slack, Figma, 자체 테스트 환경과 성장 지원 제도를 함께 다뤘습니다.

Figma 도입 전의 협업 비효율과 그로 인한 문제를 정리하고, 쿼리파이의 실시간 협업 프로세스를 소개했습니다. 또한 Figma가 기획부터 QA까지 전 단계에서 생산성과 커뮤니케이션을 높이는 이유를 설명했습니다.

QueryPie PM이 고객 요구를 수집하고 릴리즈를 이끄는 업무 방식을 소개했습니다. Jira, Slack, Figma와 테스트 환경, 성장 지원 제도까지 함께 설명했습니다.

Figma를 통해 QueryPie의 기획·디자인·개발·QA 협업이 실시간으로 연결되며 효율이 높아졌습니다. 클라우드 협업, 컴포넌트 재사용, Dev Mode로 생산성과 일관성도 강화했습니다.

피그마의 필수 기능을 소개하는 글의 제목과 연장 맥락만 확인됩니다. 제공된 발췌만으로는 핵심 내용을 충분히 파악하기 어렵습니다.

디자인 시스템에서 Figma와 코드 간 간극이 커지며 커뮤니케이션 비용과 개발 피로도가 늘어나는 문제를 다뤘습니다. Figma 규약 정비와 Plugin API 기반 도구로 명세 검증과 코드 변환을 자동화하는 방안을 소개했습니다.


Figma의 플러그인 확장성을 활용해 디자이너가 직접 플러그인을 만들어 본 경험을 공유했습니다. ChatGPT와 공식 문서를 참고한 제작 과정을 중심으로 정리했습니다.