InfoGrab DocsInfoGrab Docs

디자인 및 사용자 인터페이스 변경 사항

GitLab에 기여할 때 디자인 및 사용자 인터페이스(UI) 변경에 대한 가이드라인과 체크리스트를 설명합니다.

디자인 및 사용자 인터페이스(UI) 변경에 기여하거나 검토할 때 다음 가이드라인을 따르세요. 일반적인 코드 리뷰에 대한 폭넓은 조언과 모범 사례는 코드 리뷰 가이드 를 참조하세요. 이 가이드라인의 대부분은 GitLab 디자인 시스템인 Pajamas 를 기반으로 합니다. 추가 및 개선 사항으로 Pajamas에 기여 하는 것을 권장합니다. 머지 리퀘스트 리뷰 # 머지 리퀘스트(MR) 작성자는 다음을 반드시 해야 합니다: MR 워크플로 에 설명된 대로 설명에 변경 사항의 이전 과 이후 스크린샷(또는 동영상)을 포함시켜야 합니다. 이러한 스크린샷/동영상은 모든 리뷰어에게 매우 유용하며, 특히 변경이 작을 경우 리뷰 프로세스를 빠르게 할 수 있습니다. 사용자에게 보이는 변경이 있는 모든 머지 리퀘스트에 ~UX 라벨을 첨부해야 합니다. 이렇게 하면 Reviewer Roulette이 UX 리뷰어 를 제안하게 됩니다. 팀 멤버 인 경우: Reviewer Roulette 에서 제안한 Product Designer를 리뷰어로 지정하는 것을 권장합니다. 이것은 작업을 균등하게 분배하고, 소통을 개선하며, UI를 더 일관성 있게 만드는 데 도움이 됩니다. 다른 리뷰어를 선택해야 하는 이유가 있다면, 직접 선택한 Product Designer에게 배정했음을 코멘트로 언급하세요. 커뮤니티 기여자 인 경우: Reviewer Roulette에 관계없이, 기여하는 영역의 도메인 전문가 인 Product Designer를 선택하는 것을 선호합니다. 체크리스트 # UI 변경을 설계 하거나 검토 할 때 다음 사항을 확인하세요. 문서 작성 # UI 텍스트에 대한 기본 가이드라인으로 Pajamas 를 따르고, 보조 가이드라인으로 문서 스타일 가이드 를 따르세요. 명확하고 일관된 용어를 사용하세요. 문법과 맞춤법을 확인하세요. 도움말 콘텐츠를 고려하고 해당 가이드라인 을 따르세요. 적절한 Technical Writer 에게 리뷰를 요청하고, 검토해야 할 특정 파일이나 라인과 사용자 관점에서 텍스트의 위치/맥락을 미리 보거나 이해하는 방법을 알려주세요. 패턴 # 제품에서 사용되는 유사한 패턴을 고려하고, 패턴에서 벗어날 때는 이슈에서 이유를 설명하세요. 적절한 컴포넌트 와 데이터 시각화 를 사용하세요. 시각적 디자인 # 브라우저의 요소 인스펙터( Chrome , Firefox )를 사용하여 시각적 디자인 속성을 확인하세요. 디자인 시스템은 지원되는 모든 모드에서 작동하는 디자인 토큰 과 컴포넌트 를 제공합니다. 통합된 제품 경험을 설계하는 일환으로 의미론적 의미에 기반한 권장 색상 을 사용하세요. 이러한 색상 조합은 모든 모드에서 지원됩니다. 타이포그래피 가이드라인 을 따르세요. 레이아웃 가이드라인 을 따르세요. 기존 아이콘 과 일러스트레이션 을 사용하거나, 아이코노그래피 및 일러스트레이션 가이드라인에 따라 새 것을 제안하세요. 지원되는 모든 모드 를 고려하세요. 디자인 시스템은 지원되는 모드에서 작동하는 디자인 토큰 과 컴포넌트 를 제공합니다. 모드가 고객 결과에 주요 요인인