SlideShare a Scribd company logo
1 of 23
Download to read offline
UI드자이너의
짧은 언리얼 UMG 사용기
2019.06.29
데브루키
조홍기
소개
•조홍기
•87년생
•게임 UI 디자이너
•그 외 게임 잡지식에 관심 많음
UMG 가 무요?
•Unreal Motion Graphics UI Designer
•언리얼 엔진에 탑재된 UI위젯 시스템
•유니티의 Canvas UI컴포넌트와 대칭
•사용방법은 유니티와 다름
UMG 특 1
•계층구조에 다른WBP 불러오는 경우 많음
•UI드로우 관리 꼬임
•하지만 요즘 폰 성능 좋잖아?? 하하하
UMG 특 1
• 계층에서 다른 WBP를 불러 쓰는 경우가 많음(사용자 생성)
UMG 특 1
• 다중 WBP배치 가능, Batching 효율 관리 힘듬
• 인스턴스 구조와 내부 레이어 계획 필요
• WBP중 해상도대응 할 레이어 계획 필요
한마디로
관리가
지랄맞다
UMG 특 1
관리 못해도 유니티보다 플레이 체감 빠름
??????
관리하면 더 빠르기 핵가능
UMG 특 2
• WBP내부 패널로 임의 사이즈 조절 가능
• (뷰 상단 커스텀 사이즈도 가능)
UMG 특 2
•WBP 인스턴스 많아 사이즈 변동 잦음
•사이즈 커스텀 통일 필요
•기능 사용적 정의 필요
UMG 특 2
초반에 틀 잡고 가야하는 부분
하지만 이런거
틀잡고 가는 경우를 본적이 없다
출시 코앞 되서 UI에 드로우가 높네
메모리가 많네.. 하게됨
(대충 불만어린 짤)
UMG 특 3
• 위젯내 애니메이션이 손상돼도 컴파일은 가능
WBP 컴파일 시 애니손상에 상관 없음
장점 : 애니수정요소 자유로움
단점 : 손상발견 어려움
UMG 특 3
저장시 간략히 팝업알림 하면 매우 좋을 듯
명색이 모션 그래픽 툴인데
모션 그래픽이 에러 난걸 무시하는 상남자 햐-
UMG 특 4
• 자주 사용하는 UI요소의 인스턴스용 WBP
UMG 특 4
• WBP에 사용자생성 해도 일부설정 변경 가능
•텍스트 스타일
•쓰이는 이미지
•박스컨트롤
•크기
•등등등
UMG 특 4
•장점이 많은 사용 방식 (권장)
•프로그램팀 기능 개발 필요
•잦은 WBP 인스턴스화 가능
•개별 페이지의 드로우콜 관리에 도움 됨
UMG 특 5
•유사WBP 드로우 구조화 필요
•언리얼 테이블 이용이 괜찮음
•기획, 프로그램, UI 사전조율 필요
UMG 특 5
•유사WBP 드로우 구조화 필요
• 넣는 데이터 틀이 같다
• 넣는 이미지 틀이 같다
• 구조 돌려쓰기 가능하다
UMG 특 5
•라이브 이벤트 페이지에 적합
• 생산성 증대
적은 디자인적 공수로
서로다른 표현 가능
단점은 지나친 양산이벤트화 가능
UMG 특 마무리
1. 잦은 불러쓰기 구성이다
2. 드로우 배칭이 어려울 수 있다 (관리필요)
3. 인스턴스화를 잘 써야 한다
4. 커스텀 위젯이 필요할 수 있다
UMG 특 마무리
관리 못해도 유니티보다 플레이 체감 빠름
관리하면 확실히 빠를 것 이다
근데 사용이 친절하진 않다
UMG 특 마무리 : 개인생각
모바일에서 UI 드로우콜 / 메모리 / UI이펙트 이슈는
엄청난 회색지대 이다
UI디자이너 : 그 기능을 왜 우리가 알아야 함??
클라이언트 : UI 기능 그거 뭐 내가 알아서 뭐함??
테크니컬아트 : 3D이슈도 바쁜데 UI에 신경쓸새 어딨음??
UMG 특 마무리 : 개인생각
기술기반 사용으로 아낀 성능과 자원은
결국 게임아트가 좀더 멋지고 다양하게
표현되는 데에 쓰인다.
게임은 원래 쓸데없이 멋있는걸 보는 맛 이니까
오늘 발표 끝-
감사합니다
질문 받습니다

More Related Content

What's hot

레퍼런스만 알면 언리얼 엔진이 제대로 보인다
레퍼런스만 알면 언리얼 엔진이 제대로 보인다레퍼런스만 알면 언리얼 엔진이 제대로 보인다
레퍼런스만 알면 언리얼 엔진이 제대로 보인다Lee Dustin
 
나만의 엔진 개발하기
나만의 엔진 개발하기나만의 엔진 개발하기
나만의 엔진 개발하기YEONG-CHEON YOU
 
UE4 Garbage Collection
UE4 Garbage CollectionUE4 Garbage Collection
UE4 Garbage CollectionQooJuice
 
멀티스레드 렌더링 (Multithreaded rendering)
멀티스레드 렌더링 (Multithreaded rendering)멀티스레드 렌더링 (Multithreaded rendering)
멀티스레드 렌더링 (Multithreaded rendering)Bongseok Cho
 
조정훈, 게임 프로그래머를 위한 클래스 설계, NDC2012
조정훈, 게임 프로그래머를 위한 클래스 설계, NDC2012조정훈, 게임 프로그래머를 위한 클래스 설계, NDC2012
조정훈, 게임 프로그래머를 위한 클래스 설계, NDC2012devCAT Studio, NEXON
 
[0903 구경원] recast 네비메쉬
[0903 구경원] recast 네비메쉬[0903 구경원] recast 네비메쉬
[0903 구경원] recast 네비메쉬KyeongWon Koo
 
전형규, 가성비 좋은 렌더링 테크닉 10선, NDC2012
전형규, 가성비 좋은 렌더링 테크닉 10선, NDC2012전형규, 가성비 좋은 렌더링 테크닉 10선, NDC2012
전형규, 가성비 좋은 렌더링 테크닉 10선, NDC2012devCAT Studio, NEXON
 
전형규, SilvervineUE4Lua: UE4에서 Lua 사용하기, NDC2019
전형규, SilvervineUE4Lua: UE4에서 Lua 사용하기, NDC2019전형규, SilvervineUE4Lua: UE4에서 Lua 사용하기, NDC2019
전형규, SilvervineUE4Lua: UE4에서 Lua 사용하기, NDC2019devCAT Studio, NEXON
 
언리얼을 활용한 오브젝트 풀링
언리얼을 활용한 오브젝트 풀링언리얼을 활용한 오브젝트 풀링
언리얼을 활용한 오브젝트 풀링TonyCms
 
Igc2016 Technical Artist가 뭐하는 사람이에요?
Igc2016 Technical Artist가 뭐하는 사람이에요?Igc2016 Technical Artist가 뭐하는 사람이에요?
Igc2016 Technical Artist가 뭐하는 사람이에요?SangYun Yi
 
게임 인공지능 설계
게임 인공지능 설계게임 인공지능 설계
게임 인공지능 설계ByungChun2
 
2009-2016 기본기(손맵)의 중요성
2009-2016 기본기(손맵)의 중요성2009-2016 기본기(손맵)의 중요성
2009-2016 기본기(손맵)의 중요성Gunho Shin
 
그럴듯한 랜덤 생성 컨텐츠 만들기
그럴듯한 랜덤 생성 컨텐츠 만들기그럴듯한 랜덤 생성 컨텐츠 만들기
그럴듯한 랜덤 생성 컨텐츠 만들기Yongha Kim
 
[데브루키/141206 박민근] 유니티 최적화 테크닉 총정리
[데브루키/141206 박민근] 유니티 최적화 테크닉 총정리[데브루키/141206 박민근] 유니티 최적화 테크닉 총정리
[데브루키/141206 박민근] 유니티 최적화 테크닉 총정리MinGeun Park
 
스케일폼(Scaleform) ue4에 통합 및 간단한 사용법
스케일폼(Scaleform) ue4에 통합 및 간단한 사용법스케일폼(Scaleform) ue4에 통합 및 간단한 사용법
스케일폼(Scaleform) ue4에 통합 및 간단한 사용법Kiyoung Moon
 
프레임레이트 향상을 위한 공간분할 및 오브젝트 컬링 기법
프레임레이트 향상을 위한 공간분할 및 오브젝트 컬링 기법프레임레이트 향상을 위한 공간분할 및 오브젝트 컬링 기법
프레임레이트 향상을 위한 공간분할 및 오브젝트 컬링 기법YEONG-CHEON YOU
 
[NDC 2021] 게임 PD가 되어 보니
[NDC 2021] 게임 PD가 되어 보니[NDC 2021] 게임 PD가 되어 보니
[NDC 2021] 게임 PD가 되어 보니Yongha Kim
 
전형규, 프로젝트DH의 절차적 애니메이션 시스템, NDC2017
전형규, 프로젝트DH의 절차적 애니메이션 시스템, NDC2017전형규, 프로젝트DH의 절차적 애니메이션 시스템, NDC2017
전형규, 프로젝트DH의 절차적 애니메이션 시스템, NDC2017devCAT Studio, NEXON
 
[Kgc2012] deferred forward 이창희
[Kgc2012] deferred forward 이창희[Kgc2012] deferred forward 이창희
[Kgc2012] deferred forward 이창희changehee lee
 

What's hot (20)

레퍼런스만 알면 언리얼 엔진이 제대로 보인다
레퍼런스만 알면 언리얼 엔진이 제대로 보인다레퍼런스만 알면 언리얼 엔진이 제대로 보인다
레퍼런스만 알면 언리얼 엔진이 제대로 보인다
 
나만의 엔진 개발하기
나만의 엔진 개발하기나만의 엔진 개발하기
나만의 엔진 개발하기
 
UE4 Garbage Collection
UE4 Garbage CollectionUE4 Garbage Collection
UE4 Garbage Collection
 
멀티스레드 렌더링 (Multithreaded rendering)
멀티스레드 렌더링 (Multithreaded rendering)멀티스레드 렌더링 (Multithreaded rendering)
멀티스레드 렌더링 (Multithreaded rendering)
 
조정훈, 게임 프로그래머를 위한 클래스 설계, NDC2012
조정훈, 게임 프로그래머를 위한 클래스 설계, NDC2012조정훈, 게임 프로그래머를 위한 클래스 설계, NDC2012
조정훈, 게임 프로그래머를 위한 클래스 설계, NDC2012
 
[0903 구경원] recast 네비메쉬
[0903 구경원] recast 네비메쉬[0903 구경원] recast 네비메쉬
[0903 구경원] recast 네비메쉬
 
전형규, 가성비 좋은 렌더링 테크닉 10선, NDC2012
전형규, 가성비 좋은 렌더링 테크닉 10선, NDC2012전형규, 가성비 좋은 렌더링 테크닉 10선, NDC2012
전형규, 가성비 좋은 렌더링 테크닉 10선, NDC2012
 
전형규, SilvervineUE4Lua: UE4에서 Lua 사용하기, NDC2019
전형규, SilvervineUE4Lua: UE4에서 Lua 사용하기, NDC2019전형규, SilvervineUE4Lua: UE4에서 Lua 사용하기, NDC2019
전형규, SilvervineUE4Lua: UE4에서 Lua 사용하기, NDC2019
 
언리얼을 활용한 오브젝트 풀링
언리얼을 활용한 오브젝트 풀링언리얼을 활용한 오브젝트 풀링
언리얼을 활용한 오브젝트 풀링
 
Igc2016 Technical Artist가 뭐하는 사람이에요?
Igc2016 Technical Artist가 뭐하는 사람이에요?Igc2016 Technical Artist가 뭐하는 사람이에요?
Igc2016 Technical Artist가 뭐하는 사람이에요?
 
게임 인공지능 설계
게임 인공지능 설계게임 인공지능 설계
게임 인공지능 설계
 
2009-2016 기본기(손맵)의 중요성
2009-2016 기본기(손맵)의 중요성2009-2016 기본기(손맵)의 중요성
2009-2016 기본기(손맵)의 중요성
 
그럴듯한 랜덤 생성 컨텐츠 만들기
그럴듯한 랜덤 생성 컨텐츠 만들기그럴듯한 랜덤 생성 컨텐츠 만들기
그럴듯한 랜덤 생성 컨텐츠 만들기
 
카툰 렌더링
카툰 렌더링카툰 렌더링
카툰 렌더링
 
[데브루키/141206 박민근] 유니티 최적화 테크닉 총정리
[데브루키/141206 박민근] 유니티 최적화 테크닉 총정리[데브루키/141206 박민근] 유니티 최적화 테크닉 총정리
[데브루키/141206 박민근] 유니티 최적화 테크닉 총정리
 
스케일폼(Scaleform) ue4에 통합 및 간단한 사용법
스케일폼(Scaleform) ue4에 통합 및 간단한 사용법스케일폼(Scaleform) ue4에 통합 및 간단한 사용법
스케일폼(Scaleform) ue4에 통합 및 간단한 사용법
 
프레임레이트 향상을 위한 공간분할 및 오브젝트 컬링 기법
프레임레이트 향상을 위한 공간분할 및 오브젝트 컬링 기법프레임레이트 향상을 위한 공간분할 및 오브젝트 컬링 기법
프레임레이트 향상을 위한 공간분할 및 오브젝트 컬링 기법
 
[NDC 2021] 게임 PD가 되어 보니
[NDC 2021] 게임 PD가 되어 보니[NDC 2021] 게임 PD가 되어 보니
[NDC 2021] 게임 PD가 되어 보니
 
전형규, 프로젝트DH의 절차적 애니메이션 시스템, NDC2017
전형규, 프로젝트DH의 절차적 애니메이션 시스템, NDC2017전형규, 프로젝트DH의 절차적 애니메이션 시스템, NDC2017
전형규, 프로젝트DH의 절차적 애니메이션 시스템, NDC2017
 
[Kgc2012] deferred forward 이창희
[Kgc2012] deferred forward 이창희[Kgc2012] deferred forward 이창희
[Kgc2012] deferred forward 이창희
 

More from Hong-Gi Joe

유니티3D 2017의 UI Sprite Atlas 와 아쉬운 UI 기능들
유니티3D 2017의 UI Sprite Atlas 와 아쉬운 UI 기능들유니티3D 2017의 UI Sprite Atlas 와 아쉬운 UI 기능들
유니티3D 2017의 UI Sprite Atlas 와 아쉬운 UI 기능들Hong-Gi Joe
 
사용성의 게임 Ux #1
사용성의 게임 Ux #1사용성의 게임 Ux #1
사용성의 게임 Ux #1Hong-Gi Joe
 
The스프라이트
The스프라이트The스프라이트
The스프라이트Hong-Gi Joe
 
유니티3D 5의 Ugui #2
유니티3D 5의 Ugui #2유니티3D 5의 Ugui #2
유니티3D 5의 Ugui #2Hong-Gi Joe
 
Unity3D 5 의 ugui #1
Unity3D 5 의 ugui #1Unity3D 5 의 ugui #1
Unity3D 5 의 ugui #1Hong-Gi Joe
 
151003 원화하던 쪼랩의 UI 전직기
151003 원화하던 쪼랩의 UI 전직기151003 원화하던 쪼랩의 UI 전직기
151003 원화하던 쪼랩의 UI 전직기Hong-Gi Joe
 
손가락이 제멋대로 UX하고 움직이는 UI #2
손가락이 제멋대로 UX하고 움직이는 UI #2손가락이 제멋대로 UX하고 움직이는 UI #2
손가락이 제멋대로 UX하고 움직이는 UI #2Hong-Gi Joe
 
손가락이 제멋대로 UX 하고 움직이는 UI
손가락이 제멋대로 UX 하고 움직이는 UI손가락이 제멋대로 UX 하고 움직이는 UI
손가락이 제멋대로 UX 하고 움직이는 UIHong-Gi Joe
 
다함께 자전거
다함께 자전거다함께 자전거
다함께 자전거Hong-Gi Joe
 
140726컨셉론 소형
140726컨셉론 소형140726컨셉론 소형
140726컨셉론 소형Hong-Gi Joe
 
Spine과 함께하는 뼈대세우기
Spine과 함께하는 뼈대세우기Spine과 함께하는 뼈대세우기
Spine과 함께하는 뼈대세우기Hong-Gi Joe
 

More from Hong-Gi Joe (12)

유니티3D 2017의 UI Sprite Atlas 와 아쉬운 UI 기능들
유니티3D 2017의 UI Sprite Atlas 와 아쉬운 UI 기능들유니티3D 2017의 UI Sprite Atlas 와 아쉬운 UI 기능들
유니티3D 2017의 UI Sprite Atlas 와 아쉬운 UI 기능들
 
사용성의 게임 Ux #1
사용성의 게임 Ux #1사용성의 게임 Ux #1
사용성의 게임 Ux #1
 
The스프라이트
The스프라이트The스프라이트
The스프라이트
 
유니티3D 5의 Ugui #2
유니티3D 5의 Ugui #2유니티3D 5의 Ugui #2
유니티3D 5의 Ugui #2
 
Unity3D 5 의 ugui #1
Unity3D 5 의 ugui #1Unity3D 5 의 ugui #1
Unity3D 5 의 ugui #1
 
서른즈음에
서른즈음에서른즈음에
서른즈음에
 
151003 원화하던 쪼랩의 UI 전직기
151003 원화하던 쪼랩의 UI 전직기151003 원화하던 쪼랩의 UI 전직기
151003 원화하던 쪼랩의 UI 전직기
 
손가락이 제멋대로 UX하고 움직이는 UI #2
손가락이 제멋대로 UX하고 움직이는 UI #2손가락이 제멋대로 UX하고 움직이는 UI #2
손가락이 제멋대로 UX하고 움직이는 UI #2
 
손가락이 제멋대로 UX 하고 움직이는 UI
손가락이 제멋대로 UX 하고 움직이는 UI손가락이 제멋대로 UX 하고 움직이는 UI
손가락이 제멋대로 UX 하고 움직이는 UI
 
다함께 자전거
다함께 자전거다함께 자전거
다함께 자전거
 
140726컨셉론 소형
140726컨셉론 소형140726컨셉론 소형
140726컨셉론 소형
 
Spine과 함께하는 뼈대세우기
Spine과 함께하는 뼈대세우기Spine과 함께하는 뼈대세우기
Spine과 함께하는 뼈대세우기
 

UI드자이너의 짧은 언리얼 UMG 사용기

  • 1. UI드자이너의 짧은 언리얼 UMG 사용기 2019.06.29 데브루키 조홍기
  • 3. UMG 가 무요? •Unreal Motion Graphics UI Designer •언리얼 엔진에 탑재된 UI위젯 시스템 •유니티의 Canvas UI컴포넌트와 대칭 •사용방법은 유니티와 다름
  • 4. UMG 특 1 •계층구조에 다른WBP 불러오는 경우 많음 •UI드로우 관리 꼬임 •하지만 요즘 폰 성능 좋잖아?? 하하하
  • 5. UMG 특 1 • 계층에서 다른 WBP를 불러 쓰는 경우가 많음(사용자 생성)
  • 6. UMG 특 1 • 다중 WBP배치 가능, Batching 효율 관리 힘듬 • 인스턴스 구조와 내부 레이어 계획 필요 • WBP중 해상도대응 할 레이어 계획 필요 한마디로 관리가 지랄맞다
  • 7. UMG 특 1 관리 못해도 유니티보다 플레이 체감 빠름 ?????? 관리하면 더 빠르기 핵가능
  • 8. UMG 특 2 • WBP내부 패널로 임의 사이즈 조절 가능 • (뷰 상단 커스텀 사이즈도 가능)
  • 9. UMG 특 2 •WBP 인스턴스 많아 사이즈 변동 잦음 •사이즈 커스텀 통일 필요 •기능 사용적 정의 필요
  • 10. UMG 특 2 초반에 틀 잡고 가야하는 부분 하지만 이런거 틀잡고 가는 경우를 본적이 없다 출시 코앞 되서 UI에 드로우가 높네 메모리가 많네.. 하게됨 (대충 불만어린 짤)
  • 11. UMG 특 3 • 위젯내 애니메이션이 손상돼도 컴파일은 가능 WBP 컴파일 시 애니손상에 상관 없음 장점 : 애니수정요소 자유로움 단점 : 손상발견 어려움
  • 12. UMG 특 3 저장시 간략히 팝업알림 하면 매우 좋을 듯 명색이 모션 그래픽 툴인데 모션 그래픽이 에러 난걸 무시하는 상남자 햐-
  • 13. UMG 특 4 • 자주 사용하는 UI요소의 인스턴스용 WBP
  • 14. UMG 특 4 • WBP에 사용자생성 해도 일부설정 변경 가능 •텍스트 스타일 •쓰이는 이미지 •박스컨트롤 •크기 •등등등
  • 15. UMG 특 4 •장점이 많은 사용 방식 (권장) •프로그램팀 기능 개발 필요 •잦은 WBP 인스턴스화 가능 •개별 페이지의 드로우콜 관리에 도움 됨
  • 16. UMG 특 5 •유사WBP 드로우 구조화 필요 •언리얼 테이블 이용이 괜찮음 •기획, 프로그램, UI 사전조율 필요
  • 17. UMG 특 5 •유사WBP 드로우 구조화 필요 • 넣는 데이터 틀이 같다 • 넣는 이미지 틀이 같다 • 구조 돌려쓰기 가능하다
  • 18. UMG 특 5 •라이브 이벤트 페이지에 적합 • 생산성 증대 적은 디자인적 공수로 서로다른 표현 가능 단점은 지나친 양산이벤트화 가능
  • 19. UMG 특 마무리 1. 잦은 불러쓰기 구성이다 2. 드로우 배칭이 어려울 수 있다 (관리필요) 3. 인스턴스화를 잘 써야 한다 4. 커스텀 위젯이 필요할 수 있다
  • 20. UMG 특 마무리 관리 못해도 유니티보다 플레이 체감 빠름 관리하면 확실히 빠를 것 이다 근데 사용이 친절하진 않다
  • 21. UMG 특 마무리 : 개인생각 모바일에서 UI 드로우콜 / 메모리 / UI이펙트 이슈는 엄청난 회색지대 이다 UI디자이너 : 그 기능을 왜 우리가 알아야 함?? 클라이언트 : UI 기능 그거 뭐 내가 알아서 뭐함?? 테크니컬아트 : 3D이슈도 바쁜데 UI에 신경쓸새 어딨음??
  • 22. UMG 특 마무리 : 개인생각 기술기반 사용으로 아낀 성능과 자원은 결국 게임아트가 좀더 멋지고 다양하게 표현되는 데에 쓰인다. 게임은 원래 쓸데없이 멋있는걸 보는 맛 이니까