웹이 얼마나 복잡해졌는지를 감안할 때 , 대규모 릴리스 직전에 몇 가지 미세한 세부 사항을 간과 하기 쉽습니다. 때로는 특정 문제를 해결하기 위해 올바른 기술이나 전략을 선택하기가 어렵습니다. 그것이 디자인 체크리스트 가 도움이 될 수 있는 곳이며, 도움이 될 만한 몇 가지 새로운 체크리스트도 있습니다. 체크리스트 디자인 # 체크리스트 디자인 은 계속 증가하는 최고의 디자인 사례 모음으로 , 모두 한 곳에 모였습니다. 독립형 페이지에 대한 체크리스트부터 요소와 흐름, 주제 및 브랜딩에 이르기까지 거의 모든 것을 찾을 수 있습니다. George Hatzis가 만든 깔끔한 작은 리소스입니다. 체크리스트 디자인 양식 제어에서 비밀번호 복구에 이르기까지 모든 UI에 대한 포괄적 인 체크리스트 . 디자인 시스템 체크리스트 # 디자인 시스템 체크리스트 는 디자인 시스템을 계획, 구축 및 성장시키기 위한 오픈 소스 체크리스트 입니다. 여기에는 디자인 언어, 디자인 토큰, 핵심 구성 요소, 도구 및 프로젝트 관리에 대해 염두에 두어야 할 사항의 기초가 포함됩니다. reshaped 의 훌륭한 사람들이 아름답게 만들고 유지 관리 합니다. 또한 Design Systems Handbook 도 확인 하고 Figma에서 Design System Checklist를 다운로드 할 수 있습니다 . 디자인 시스템 체크리스트 디자인 시스템 체크리스트 에서 디자인 시스템에서 염두에 두어야 할 사항을 잘 상기시켜줍니다 . 접근성 비 체크리스트 # Accessibility Not-Checklist 는 WCAG 2.0 및 WCAG 2.1에 대한 필터와 모범 사례 권장 사항과 함께 주제 및 성공 기준별로 그룹화된 포인트와 함께 접근성에 대한 철저한 가이드 입니다. 주제 및 역할별로 체크리스트를 정렬할 수 있습니다. intopia 의 훌륭한 사람들이 만든 환상적인 도구 입니다. 접근성 비 체크리스트 주제 및 성공 기준별로 그룹화된 매우 철저한 접근성 체크리스트 . 좋은 UX는 좋은 접근성에 관한 것입니다. A11y 프로젝트 체크리스트 # A11y 프로젝트 체크리스트 는 형식과 컨트롤에서 비디오, 오디오 및 애니메이션 에 이르기까지 모든 세부 사항에 들어가는 접근성을 위한 또 다른 매우 철저한 체크리스트입니다 . 또한 추가 예제 및 지침과 함께 모든 개별 섹션에서 WCAG의 특정 부분으로 연결됩니다. 정돈된! A11y 프로젝트 체크리스트 A11y 프로젝트 체크리스트 에는 목록에서 비디오 및 오디오에 이르기까지 일반적인 구성 요소와 함께 고려해야 할 접근성 문제에 대한 매우 자세한 개요가 포함되어 있습니다. 금광! 점프 후 더! 아래에서 계속 읽기 ↓ Vitaly Friedman 의 라이브 인터페이스 디자인 패턴 UX 교육 으로 UX 기술을 향상시키십시오 . 100가지 의 실용적인 예제 , 복잡한 UX 챌린지, 1:1 피드백 및 4가지 실제 UX 챌린지. 또한 디자인 패턴에 대한 8시간짜리 비디오 코스 도 있습니다. 라이브 UX 교육 바로가기 ↬ 기능 패널 디자인 시스템 체크리스트 Trello 템플릿 # 당신과 당신의 팀은 디자인 시스템에 대해 작업하고 있습니까? Trello용 디자인 시스템 체크리스트 템플릿은 작업을 구조화하고 모든 사람이 동일한 페이지에 참여하도록 하는 방법의 좋은 예 입니다 . Trello 사용자가 아니더라도 템플릿은 이와 같은 대규모 프로젝트에서 작업할 때 처리해야 할 체크리스트를 만드는 데 유용한 아이디어를 제공합니다. 디자인 시스템 체크리스트 템플릿 UI 구성 요소에서 디자인 토큰, 접근성 터치포인트에 이르기까지 모든 것이 Trello 템플릿 에 준비되어 있습니다. Gov.UK 디자인 시스템 구성 요소(피그마) # Gov.UK 뒤에 있는 멋진 팀은 영국 정부 서비스를 위해 설계된 전체 스타일 및 구성 요소 컬렉션을 출시했습니다. 설계 과정에서 팀은 구성 요소의 설계를 테스트하고 검증했으며, 이를 사용하여 설계에서 아직 고려하지 않은 상태나 조건 을 탐색할 수 있습니다. 또한 모든 구성 요소를 로컬에 설치하려는 경우 GOV.UK 프로토타입 키트 를 확인하고 프로토타이핑 에서 스타일과 구성 요소를 사용하는 방법을 탐색하기 위해 GOV.UK 디자인 시스템 을 확인할 수 있습니다. 디자인 시스템 체크리스트 템플릿 모든 상태의 모든 구성 요소를 한 곳에서: GOV.UK 디자인 시스템 구성 요소 Figma 파일 . 복잡한 테이블 UX 트리 # 복잡한 테이블 설계 에 대한 기사에서 Slava Shestopalov는 고급 테이블 을 설계하고 설계하는 방법을 탐구합니다 . 자주 잊거나 간과되는 모든 세부 사항에 대한 매우 포괄적인 테이블 트리 체크리스트를 사용합니다. 복잡한 테이블 UX 체크리스트 행, 열 및 셀에 대한 다양한 상태와 함께 복잡한 테이블에 들어가는 모든 것: 복잡한 테이블 UX 체크리스트 . UX 프로젝트 도구 체크리스트 # UX 레시피 는 프로젝트를 위한 일부 UX 프로젝트 도구 및 기술 을 발견하고 선택하는 데 도움이 되는 작은 도구 입니다. 또한 수행된 작업에 필요한 시간을 추정할 수 있습니다. 모든 도구는 그룹으로 분류되어 있으며 해시태그를 클릭하면 각 범주에 대한 유용한 리소스를 많이 찾을 수 있습니다. Alecsandru Grigoriu가 만들고 유지 관리합니다. UX 레시피 UX 레시피 로 나만의 UX 모험을 선택하세요 . UX 연구 방법 순서도 # 가장 적합한 UX 연구 방법 을 어떻게 선택 합니까? 최소 20개의 인기 있는 방법이 있으며 Norman-Nielsen Group 의 편리한 UX 연구 방법 순서도 가 올바른 방법을 찾는 데 도움이 됩니다. 행동, 태도, 정성 및 양적 방법으로 그룹화 된 일반적인 전략의 개요를 제공합니다. 어떤 통찰력을 추구하는지 알게 되면 차트를 사용하여 전략을 선택할 수 있습니다. UX 연구 방법 순서도 올바른 UX 연구 방법을 선택하는 방법은 무엇입니까? UX 연구 방법 순서도 가 도움이 되었습니다. 양식 디자인 UX 체크리스트 # 웹 양식 디자인 을 사용하면 특정 질문을 할 때 사용할 올바른 구성 요소 를 파악하는 것이 매우 어려울 수 있습니다 . Lyft 뒤에 있는 팀 은 디자이너(디자이너가 아닌)가 양식에 대한 결정을 쉽게 내릴 수 있도록 순서도를 만들었습니다. 양식 선택 패턴에 대한 기사 에서 Runi Goswami는 팀이 분할된 제어를 설계할 때 겪었던 어려움과 결과적으로 양식 선택 제어 순서도 를 만든 방법을 설명 합니다. 양식 디자인 UX 체크리스트 양식을 중심으로 디자인 결정을 내리는 방법은 무엇입니까? Lyft의 Form Design UX 체크리스트 가 도움이 됩니다. 디자인 시스템 구성 요소에 대한 의사 결정 트리 # 디자인 시스템은 종종 다양한 형태로 제공됩니다. 확실히 기본 구성 요소, 색상, 타이포그래피 및 간격이 있을 뿐만 아니라 보다 정교한 구성 요소, 사용 지침, 접근성 고려 사항 및 실시간 미리 보기도 있을 것입니다. 또한 Workday Canvas Design System 에는 사용할 구성 요소를 결정하기 위한 순서도 가 포함되어 있으며 , 디자이너와 디자이너가 아닌 사람이 결정을 내리기 위해 따를 수 있는 결과의 예도 있습니다. 디자인 시스템 구성 요소에 대한 순서도 Workday의 Canvas 디자인 시스템 에는 많은 패턴과 구성 요소에 대한 의사 결정 트리와 순서도가 포함되어 있습니다. 인터랙션 디자인 체크리스트 # Aaron Legaspi와 Amit Jakhu가 만든 IxD 체크리스트 는 상호작용에 대한 이해를 높이는 데 도움이 됩니다 . 컨트롤, 탐색 또는 전체 인터페이스와 같은 일종의 상호 작용을 구축할 때마다 체크리스트를 사용하여 어포던스, 단순성, 구조, 일관성, 접근성, 허용 오차 및 피드백에 대해 디자인을 평가하여 다음과 같은지 확인할 수 있습니다. 누구나 사용하기 쉽습니다. IxD 체크리스트 Interaction Design Checklist 를 사용하여 디자인의 상호 작용을 평가하십시오 . React용 KendoUI 개발자의 삶을 더 쉽게 만들어주는 React Data Grid? 예, KendoReact 그리드가 있습니다. 데이터 그리드 가져오기 보너스: 텍스트-타임라인 도구 # Markwhen: Text-to-Timeline 은 프로젝트 계획이나 라이프 타임 라인과 같은 타임라인을 생성 하는 믿을 수 없는 작은 도구 입니다! 마크다운 같은 텍스트를 작성 하면 멋진 계단식 타임라인으로 변환됩니다. VS 코드 확장 으로도 사용할 수 있습니다 . 텍스트-타임라인 도구 Markwhen 을 사용하여 일반 텍스트에서 타임라인을 생성합니다 . 그리고 그것은 랩입니다! # 이와 같은 보석을 더 찾고 있다면 지난 몇 년 동안 체크리스트가 포함된 몇 가지 UX 가이드를 게시했으므로 자유롭게 계속 탐색하십시오. 모두 즐거운 체크리스트!