Merge는 GIT 저장소에서 UXPin 에디터로 인코딩된 React.js 컴포넌트를 가져오고 동기화할 수 있는 혁신적인 기술입니다. 가져온 컴포넌트는 개발자가 개발 프로세스에서 사용하는 컴포넌트와 100% 동일합니다. 즉, 컴포넌트는 최종 사용자가 경험하는 실제 제품과 똑같은 모양, 조작성 및 기능(인터랙션, 데이터)을 갖게 됩니다.

Merge 덕분에 디자이너는 다음을 수행 할 수 있습니다.

• 추가 작업이나 코딩 전문 지식을 필요로 하지 않고 코드 저장소에 이미 존재하는 컴포넌트를 사용한다.
• 이미 코딩된 요소의 다시 그리기를 더이상 할 필요가 없습니다.
• 제품 코드에서 사용 가능한 인터랙션 및 데이터를 사용하여 고급 사용 사례를 테스트할 수 있습니다.

엔지니어는 다음을 수행할 수 있습니다.

• 디자이너가 이미 코딩된 컴포넌트를 사용하도록 보장함으로써 워크플로우를 가속화합니다.
• 모든 디자인에 대해서 실제로 개발된 JSX를 참조하여 자동 생성된 스펙(Spec)을 사용합니다.
• 커스텀 컴포넌트 만들고, 코드레벨로 이터레이션하며, 컴포넌트를 데이터 소스에 연결함으로써 고도의 프로토타이핑 프로세스를 실현할 수 있습니다.

DesignOps/디자인시스템 팀은 다음을 수행할 수 있습니다.

• 코드로 구성된 single source of truth (신뢰할 수 있는 유일한 정보원)을 통해 디자이너와 엔지니어 모두에게 서비스를 제공하는 통합 설계 시스템을 구축합니다.
• React.js 컴포넌트의 속성(prop-types, flow 또는 typescript의 type, interface)를 제어하여 시스템의 컴포넌트에 대한 변경을 제어합니다.
• 디자인시스템의 버전을 관리하고 설계자와 엔지니어 모두에게 GitHub를 통해 릴리스를 관리합니다.

디자인 및 개발 리더는 다음을 수행할 수 있습니다.

• 디자인 및 개발 프로세스를 연결하고 동기화할 수 있습니다.
• 워터폴 핸드오프 없이 애자일 프로세스를 실현합니다.
• 아이디어를 테스트하고 새로운 기능과 제품을 시장에 투입하기까지의 시간을 극한으로 단축할 수 있습니다.

어떻게 작동할까요?

UXPin이 구축한 패러다임 덕분에 Merge는 가능합니다. UXPin은 처음부터 코드 기반 디자인 툴이었습니다.