다음 설계 권장사항은 다양한 기기와 플랫폼에서 YouTube에서 게임을 플레이하는 사용자에게 최적의 환경을 보장하는 데 도움이 됩니다.
게임 룸 환경은 운영체제 구성요소를 제외하고 주로 다음 세 가지 구성요소로 구성됩니다.
- 게임 룸 작업
- 게임 캔버스
- 메뉴 및 대화상자
이 게임 디자인 권장사항은 게임 캔버스에 게임을 빌드하는 방법에 관한 권장사항을 제공합니다.
게임 크기 조절
다음 권장사항을 고려하여 게임이 다양한 화면 크기와 방향에 적절하게 조정되도록 하세요.
게임 크기를 조절하고 캔버스의 크기와 가로세로 비율에 맞게 UI를 조정합니다.
게임이 게임 캔버스 크기와 가로세로 비율에 완전히 반응할 수 없다면 필러박스 또는 레터박스를 사용합니다.
스크롤바를 실행하지 않습니다. 스크롤바는 게임플레이와 일반 탐색 모두에 부정적인 영향을 미칩니다. 게임이 캔버스 내에서 스크롤될 수 있게 하지 않고 캔버스를 채웁니다. 스크롤바는 의도적인 스크롤에 적합합니다(예: 게임 UI 내에서 긴 세로 목록을 스크롤하는 경우). 게임이 표시 영역을 전적으로 책임지는 것이 이상적입니다.
게임 확장
다양한 화면 해상도에서 선명하게 렌더링합니다 (흐리거나 모자이크 처리되거나 늘어나지 않음).
게임 UI (텍스트, 아이콘)가 저해상도 화면 (예: 360x800 휴대기기)과 고해상도 화면 (예: 3840x2560 데스크톱 모니터) 모두에서 렌더링될 때 적절하게 크기가 조정되는지 확인합니다.
대형 화면으로 확장할 때 흐리게 보이는 저해상도 래스터화된 애셋은 사용하지 않습니다.
서체
다양한 기기와 화면 크기에서 가독성을 확보해야 합니다.
버튼, 메뉴, 말풍선과 같이 게임 내에 표시되는 텍스트는 다양한 기기와 화면 크기에서 쉽게 읽을 수 있어야 합니다. 이렇게 하려면 텍스트의 크기를 자동으로 조정하고 조정하거나 사용자에게 글꼴 크기를 조정할 수 있는 설정을 제공할 수 있습니다.
텍스트가 18pt보다 작거나 텍스트가 굵고 14pt보다 작으면 색상 대비율을 4.5:1 이상으로 설정하세요.
다른 텍스트의 경우에는 모두 색상 대비율을 3:1 이상으로 설정합니다.
일반 참조는 WCAG2.1을 참고하세요.
 |
 |
| 가독성을 위해 충분한 두께와 대비를 갖춘 큰 글꼴 크기를 사용합니다. 이 예에서 대비율은 4.48:1입니다. | 작은 글꼴 크기와 저대비 색상을 사용하지 않습니다. 이 예에서 대비율은 3.07:1입니다. |
상호작용
이 섹션에서는 사용자 상호작용 및 관련 요소에 관한 권장사항을 다룹니다.
터치 영역
터치 영역을 충분히 크게 만들어 상호작용이 용이하도록 합니다.
더 쉬운 상호작용을 위해 터치 영역은 48x48dp 이상이고 타겟 간 공간은 8dp 이상입니다 (머티리얼 디자인 가이드라인 참고).
이 예에서 시각적으로 렌더링된 버튼은 24dp이고 표시되지 않는 터치 영역은 아이콘 주위에 12dp를 포함하여 48x48dp 터치 영역을 달성합니다.
아이콘과 버튼 주위에 패딩을 추가하여 터치 영역 크기를 키웁니다.
버튼
각 버튼 상태에 고유한 스타일을 사용합니다.
- 사용 설정됨
- 사용 중지됨
- 마우스 오버 (터치 미지원 입력 기기의 경우)
- 집중력이 높아진
- 누름
또한 계층 구조에 따라 버튼을 구별하는 것을 목표로 합니다. 예를 들어 시작 메뉴에 기본 및 보조 작업 버튼이 있습니다 (버튼 관련 Google Material 2 디자인 가이드라인 참고).
각 버튼 상태를 구분하는 고유한 스타일
키보드 입력
기기 및 사용자 전체에서 게임의 접근성을 높이려면 터치 및 마우스 입력 외에도 모든 게임플레이 컨트롤과 화면 탐색에 키보드 입력을 지원합니다.
키보드 입력을 지원하는 게임의 경우 사용자가 Esc 키를 사용하여 게임 내 메뉴와 대화상자를 닫을 수 있도록 허용합니다. 이는 시각적 닫기 버튼 (예: 상단 모서리에 있는 X 아이콘)도 있는 것입니다. 모달 또는 대화상자의 일반적인 예로는 설정 메뉴, 일시중지 메뉴, 오류 메시지, 도움말 정보 팝업이 있습니다.
Esc 키를 길게 누르는 작업은 데스크톱 웹브라우저에서 전체 화면 모드를 종료하는 데 사용되므로 매핑하지 마세요.
키 누름 리스너가 등록된 게임의 경우 Esc 키 이벤트와 함께 preventDefault()를 사용하지 마세요. Safari의 전체 화면일 때 전체 화면을 종료하지 않고 게임에서 키 누름 이벤트를 사용합니다.
햅틱
적절한 경우 햅틱 반응 (진동)을 사용하여 게임을 더 재미있고 몰입감 있게 만드는 것이 좋습니다.
경기의 주요 순간
이 섹션에서는 플레이어에게 탁월한 경험을 선사하는 게임의 중요한 순간을 다룹니다.
튜토리얼
신규 플레이어를 도울 수 있도록 간단한 튜토리얼 또는 온보딩 수준을 포함합니다.
온보딩 과정을 통해 사용자는 게임을 진행하고 즐기는 데 필요한 기본적인 게임플레이와 게임 기본사항을 학습합니다.
게임 룸은 사용자가 쉽고 빠르게 플레이할 수 있도록 만들어졌으므로 온보딩을 가능한 한 최소화해야 합니다. 모든 게임에 튜토리얼이 필요한 것은 아니지만 대부분의 게임에서는 일종의 온보딩이 도움이 됩니다. 플레이어가 게임을 성공적으로 플레이하고 즐기기 위해 알아야 하는 주요 메커니즘, 규칙, 기술을 고려합니다.
튜토리얼의 형식은 다음과 같습니다.
- 게임 시작 시의 화면 (또는 적절한 경우 게임 전반에 걸쳐 상황에 따라 표시되는 것이 이상적)
- 사용자가 플레이하는 실제 튜토리얼 수준
일시중지
사용자에게 게임 상태를 명확하게 전달합니다.
게임이 일시중지되는 시점과 사용자가 게임을 재개할 수 있는 방법을 사용자에게 명확하게 전달합니다. 게임이 중단되거나 비정상 종료되었다고 사용자가 생각하지 않도록 하세요.
게임 상태에 '일시중지됨'이라는 명확한 라벨을 지정하고 게임을 재개할 수 있는 명확한 작업 (버튼)을 제공합니다.
경기 종료
사용자에게 마지막 레벨을 완료했거나 게임을 완료했음을 알립니다.
게임에 명확한 끝이 있는 경우 (예: 유한한 수의 레벨) 사용자에게 그 사실을 명확하게 전달합니다. 이렇게 하면 사용자가 게임이 손상되었거나 정지되었다고 생각하지 않게 됩니다. 플레이어가 게임을 완료한 것을 축하하고 축하하는 것이 가장 좋습니다.
오디오
게임에는 효과, 음성, 배경 음악을 위한 별도의 볼륨 컨트롤이 포함될 수 있습니다. 컨트롤은 볼륨을 조절하는 슬라이더나 각각 또는 둘 다의 음소거 토글로 구성될 수 있습니다.
접근성
디자인의 접근성은 다양한 능력을 가진 사용자가 게임을 플레이하고 즐길 수 있도록 합니다.
웹 및 소프트웨어 디자인과 달리 게임 디자인을 위한 업계 표준 접근성 가이드라인은 존재하지 않습니다. 포용적인 게임 디자인에 관한 추가 가이드라인이 포함된 유용한 리소스는 게임 접근성 가이드라인을 참고하세요. 이러한 가이드라인을 게임 디자인에 적용할 수 있는 방법을 고려하는 것이 좋습니다.