모든 것이 여기에 있습니다: Unity에서 UI 인터페이스를 제작하는 궁극의 가이드

수천 명의 사람들이 사전 등록을 마쳤고 이제 드디어 출시되었습니다: 역대 최대 규모의 전자책입니다, Unity로 사용자 인터페이스 디자인 및 구현를 다운로드할 수 있습니다. 130페이지가 넘는 UI 디자인에 대한 고급 지침을 살펴볼 준비를 하세요.
게임의 사용자 인터페이스는 플레이어와 소통하고 안내할 수 있는 가장 직접적인 방법이며, 플레이어가 진행하면서 단서, 주요 세부 정보, 방향을 알려주는 접힌 지도와 같습니다. 체력 표시줄이나 팝업 메시지와 같은 전통적인 요소를 사용하든, 플레이어의 생존복 뒷면에 통계를 표시하는 등 게임 세계에 완전히 내장된 요소를 사용하든, UI는 플레이어가 게임의 스토리, 영역, 예술적 스타일에 몰입하는 데 필수적인 요소입니다.
최신 기술 전자책을 발표하게 되어 기쁘게 생각합니다, Unity의 사용자 인터페이스 디자인 및 구현를 무료로 다운로드할 수 있게 되었습니다. 이미 수천 명의 사람들이 이 툴킷에 등록했으며, 그에 못지않게 많은 사람들이 데모 프로젝트를 다운로드했습니다, UI 툴킷 샘플 - 드래곤 크래셔를 다운로드했습니다. 이제 여러분 차례입니다.

이 전자책에 대한 관심은 충분히 이해할 수 있습니다. "사용자 인터페이스는 모든 게임에서 중요한 부분입니다... 견고한 그래픽 사용자 인터페이스(GUI)는 게임의 시각적 정체성의 확장입니다... [그리고] 현대의 사용자들은 애플리케이션과 원활하게 통합되는 세련되고 직관적인 GUI를 갈망하고 있습니다."
이 가이드는 UI 디자인 및 아트 제작의 기초를 다루는 것으로 시작하여 Unity의 UI 개발에 대한 심층적인 교육 섹션으로 이동합니다. 외부 및 유니티 전문가인 기술 및 UI 아티스트가 집필하고 검토한 이 전자책은 기본 솔루션인 Unity UI와 최신 UI 툴킷을 모두 다룹니다.
그러나 UI 툴킷은 이제 복잡한 전체 화면 인터페이스를 가진 프로젝트에 많은 이점을 제공하기 때문에 후자의 툴셋에 중점을 두고 있습니다. 런타임 UI를 위해 확장 가능하고 성능이 뛰어난 시스템이 필요한 프로젝트를 생각해 보세요. 프로젝트에 적합한 솔루션을 선택하는 데 도움이 되려면 Unity 매뉴얼의 이 섹션을 참조하세요.

이 전자책은 UI 개발에 대한 지식을 심화하고자 하는 전문 UI 디자이너, 아티스트 및 기타 Unity 크리에이터를 위한 정보의 보고입니다. 다음은 내부 내용을 간략하게 보여주는 스냅샷입니다.
첫 번째 섹션에서는 효과적인 UI를 만들기 위한 기초적인 팁을 통해 영감을 얻고자 합니다. 스토리에서 UI 요소를 바로 찾아볼 수 있는 다이제틱 UI의 예를 살펴보고, 게임 세계의 일부가 사용자 인터페이스로 기능하도록 합니다. 플레이어가 경험하는 몰입도에 어떤 요소가 기여하거나 방해할 수 있는지 설명합니다. 이 섹션을 블로그 게시물로 만들어 여기에서 읽어보실 수 있습니다.
그런 다음 UI 디자이너의 역할과 책임, UI 와이어프레임, 목업을 통한 아트 제작, 폰트, 그레이박싱 등 어떤 도구와 방법을 사용하는지 살펴봅니다. 디지털 콘텐츠 제작 (DCC) 도구에서 에셋 준비 및 그래픽 내보내기에 대한 장도 있습니다. 이 가이드의 앞부분은 사용 중인 게임 엔진과 UI 솔루션에 관계없이 도움이 됩니다.
이 장에서는 Unity UI에 대해 자세히 다룹니다. Unity UI는 게임 내 UI를 제작하기 위한 유니티의 오랜 시스템으로, 현재 3D 월드에 UI를 배치하거나 게임 오브젝트 기반 유니티 시스템을 사용하는 데 가장 많이 사용되는 솔루션입니다.

이 섹션에서는 에디터에서 에셋을 프로토타이핑하고 통합하는 데 필요한 캔버스, 사전 빌드된 UI 요소, 텍스트메시 프로, 프리팹 등 Unity UI의 기본 사항을 간략하게 설명합니다. 유니티는 최근 Unity UI의 고급 최적화 기법에 대한 기사를 업데이트했으며, 관련 주제에 대한 팁을 확인할 수 있습니다.
UI 툴킷은 표준 웹 기술에 기반한 워크플로와 저작 도구로 성능과 재사용성을 극대화하기 위해 만들어졌습니다. 특히 웹 페이지를 디자인한 경험이 있는 UI 디자이너와 아티스트는 익숙하게 사용할 수 있을 것입니다.
가이드의 세 가지 주요 섹션에서는 UI 툴킷으로 런타임 UI를 개발하는 방법을 중점적으로 설명합니다. UI 툴킷으로 만든 UI를 구성하는 부분, 즉 UI 빌더를 사용한 UXML( Unity 확장 가능한 마크업 언어 ) 및 USS( Unity 스타일 시트 )에 대한 자세한 설명이 포함되어 있습니다.
UI 툴킷이 다음을 기반으로 시각적 요소를 배치하는 방법을 살펴봅니다. 요가의 하위 집합을 구현하는 HTML/CSS 레이아웃 엔진인 Flexbox. 플렉스박스 아키텍처는 반응형 UI와 같은 장점을 제공하여 다양한 화면 해상도 및 크기에 맞게 UI를 조정할 수 있습니다. UXML과 USS를 모두 사용하면 UI 레이아웃에 적용된 스타일을 분리하고(필요에 따라 스타일을 전환할 수 있음) 로직과 기능은 코드에 계속 유지하면서 사용할 수 있습니다. 각 인터페이스의 기본 구성 요소인 시각적 요소에 대한 워크플로도 위치, 크기, 정렬 설정부터 여백 및 패딩에 이르기까지 매우 상세하게 설명합니다.


스타일링 장에서는 셀렉터로 시각적 요소에 재사용 가능한 스타일링을 정의하고, 인라인 스타일로 스타일을 재정의하고 고유 속성을 정의하고, USS 애니메이션과 카메라 렌더 텍스처로 애니메이션과 효과를 만드는 방법을 보여줍니다. 또한 휴일 및 기타 특별 이벤트에 맞게 UI 요소를 테마화하는 방법도 보여줍니다.
전자책은 다음과 같은 내용을 담고 있습니다. UI 툴킷 샘플 - 드래곤 크래셔를 통해 메뉴와 방사형 카운터 또는 탭 보기와 같은 사용자 지정 컨트롤부터 임베디드 UXML 템플릿 등 다양한 섹션을 통해 UI가 어떻게 만들어졌는지 살펴볼 수 있습니다.

마지막으로, 이 가이드는 스튜디오 Mechanistry의 새 게임인 Timberborn을 위한 UI 툴킷으로의 UI 마이그레이션에 대한 미니 프로필로 마무리합니다. 이 간단한 연구에서는 린 팀이 어떻게 다양한 메뉴와 화면에서 게임을 확장하고 일관성을 유지할 수 있었는지 보여줍니다.
137페이지에 달하는 UI 전자책은 가볍게 읽을 수 있는 분량이 아닙니다. 작년에 출시된 다른 기술 전자책과 마찬가지로 지속적으로 참고 자료로 활용하세요.
전자책과 함께 Unity UI 및 UI 툴킷을 활용하는 데 유용한 팁이 담긴 최근 출시된 두 가지 리소스도 확인해 보세요:
- 유나이트 2022 세션, UI 툴킷을 사용하여 커스텀 툴로 Unity 에디터 확장하기에서는 프로그래머가 UI 빌더를 사용하여 실시간 플레이 모드 디버그 데이터 시각화를 위한 커스텀 인스펙터를 만드는 방법을 소개합니다.
- 웨비나 ' 모바일 UI 디자인 모범 사례'에서는 Outfit7, 삼성, 유니티의 전문가들이 모여 모바일 게임의 창의성과 흐름을 극대화하기 위한 전략을 공유합니다.
이 페이지 중 하나 또는 두 페이지를 북마크에 추가하세요. 모든 기술 전자책과 고급 콘텐츠를 편집합니다:
이 최신 전자책이 도움이 되셨기를 바라며 이 포럼에서 여러분의 피드백을 기다리겠습니다.
