인프런 커뮤니티 질문&답변
작성한 질문수
디자인시스템 리뉴얼 관련
해결된 질문
24.04.22 17:46 작성
·
231
1
안녕하세요 선생님, 강의 잘 듣고 있습니다.
현재 디자인시스템 리뉴얼을 하려고 하는데 많은 도움이 되고있습니다.
디자인시스템 리뉴얼 중 질문이 생겨 여쭙습니다.
이미 등록되어있는 디자인시스템이 있는데 (배리어블 말고 스타일로만 등록되어 있습니다.) 현재 디자인시스템으로 작업한 핸드오프를 계속 넘기는 작업과 동시에 디자인시스템 리뉴얼 + 전체 서비스 파악 후 리뉴얼 한 디자인시스템 적용을 해야하는 상황입니다.
현재 디자인시스템과 리뉴얼할 디자인시스템이 헷갈리지 않고 적용되게 할 수 있는 방법이 있을지 궁금합니다. 특히 색상의 경우 프라이머리 컬러가 같고, 프리미티브 팔레트 내에서만 살짝씩 변화가 있어 육안으로는 구별이 힘듭니다.
피그마 화면 내에서만 작업을 하고 리뉴얼 완료 시점에 배리어블, 혹은 스타일에 한번에 등록하는게 좋을까요?
어떻게 작업해도 헷갈리게 될 것 같아 혹시 좋은 방법이 있으시거나 비슷한 경험이 있으실까 하여 여쭙습니다.
항상 감사합니다!!
답변 1
0
2024. 04. 23. 03:49
안녕하세요.
우선 질문 주셔서 정말 감사합니다. 저도 실무에서 성공과 실패의 경험이 있어서 우선 공유해드립니다.
(정답은 아니니 참고만 하세요.)
우선 디자인 시스템 마이그레이션(Migration)은 정말 어려운 과제 중 하나입니다.
잘못했다가는 이도저도 아닌 상황이 될 수 있습니다.
제가 했던 방법을 소개하고 개인적으로는 이 방법을 추천합니다. 하지만 팀원들과 개발자들과 상의하에 결정하시기 바랍니다.
피그마에서 새로운 디자인 시스템 UI kit v2 디자인 파일을 만듭니다. 이렇게 하는 이유는 우선 기존 레거시 파일의 경우 예전 디자인 시스템과 연결되어 있고 이것을 전체 다 바꾸는 것은 어렵습니다.
개발의 경우 개발자와 상의하에 결정하시는 걸 추천드리며, 저의 경우는 새로운 베리어블이 포함된 개발쪽 스타일 파일을 새로 만들어서 컴포넌트를 나누어서 차근차근 연결했습니다.
주요 디자인 페이지를 모은 공용 피그마 파일을 하나 새로 만들어서 새로운 디자인 시스템 UI Kit v2와 모두 연결합니다. 이 경우는 오른쪽 메뉴에서 Paste replace(단축키: command shift R)을 눌러 쉽게 컴포넌트를 바꿀 수 있습니다.
이 과정을 완성되기 전까지는 기존 디자인 시스템을 사용해서 페이지를 관리합니다.
이렇게 하는 이유는 기존 레거시와 디자인 시스템을 유지함이 목적이고, 새로운 디자인 시스템과 이와 연결된 프로젝트 파일을 따로 생성해서 관리하기 위함입니다.
질문에 대한 답변이 되었으면 좋겠습니다. 이해가 안되시거나 궁금하신 점 있으면 알려주세요 감사합니다.
2024. 04. 23. 09:04
아하! 자세한 답변 정말 감사합니다.
선생님 말씀은 리뉴얼한 디자인 시스템 피그마 파일을 새로 만들어 등록은 하되, 주요 디자인 페이지를 모은 피그마 파일을 새로 만들어 일단 여기에만 연결 해두라는 말씀이시군요.
막막했는데 많은 도움이 되었습니다. 감사합니다! 오늘도 좋은하루 보내세요!! :)