brunch

You can make anything
by writing

C.S.Lewis

by 리플러스 Mar 12. 2019

게임 UI 스터디 : 워해머40k - 던 오브워 2

UI 디자이너가 바라보는 게임 UI 이야기



스타크래프트보다 오래된 고전 전략시뮬레이션의 명작. 워해머 40k 시리즈. 그러나 UI와 편집 디자인은 끔찍한 작품. 워해머 40k - Dawn of war 2 (dow 2) 카오스 라이징 의 게임 UI와 게임 시스템, 컨텐츠별 연출이나, 그 내용을 부분을 분석한 글





소개 영상

https://www.youtube.com/watch?v=FSAXbd-vhDE

끊임없이 전쟁을 벌이는 여러 종족들간의 우주전쟁. SF적 배경을 지녔지만, 판타지 소설을 읽는 것 같은 이야기 흐름의 전략 시뮬레이션. 세계관을 모두 이해하려고하면 복잡하니, 그냥 SF 판타지 오페라 ~ 같은 거라고 생각하면 될 것 같다.







dow2 메인 캠페인 이후, 신규로 나온 확장팩이 카오스 라이징.인데. 말 그대로 카오스.라는 혼돈의 종족이 등장하기 위한 이야기라고 보면 될듯. 







시작화면


중심부에 모아둔 애매한 UI 배치와, 기괴할 정도로 흩뿌려진 버튼들이 인상적이다. 심지어 멀티플레이어는 펼쳐지는 형식이었다. 초록색 버튼이 기본색상에 노란색 하이라이트... 심지어 하이라이트된 텍스트가 노란색이다. 





싱글 미션 선택시 - 미션팩을 선택해야하는데... 배경화면 변화없이 버튼만 등장한다. 게다가 기존의 메뉴가 갑자기 사라져버린다. 왜 백버튼이 좌측 하단에 생기는지도 미지수. 









캠페인 프로필 선택


위계질서가 정말 엉망인 편집디자인. 들쭉날쭉한 라인도 거슬리는데. 프로필을 선택하면 더욱더 들쭉날쭉함이 심해진다. 심지어 개별 정보에 써있는 내용은 - 미션 진행 위치를 표기하는게 아니라. 캐릭터의 레벨을 중심으로 표기하기 때문에. 내가 어디쯤에서 게임을 끝냈었는지가 확인이 안된다. 






캠페인 프로필 삭제 / 신규 캠페인 진행


총 네가지 난이도를 제공하는데, 2~3단계까지는 할만하다. 4단계는 거의 사기적인 열세를 극복해야하는 수준이다.









싱글미션 로비 / 영역 호버시 정보팝업


 지도 상에 있는 아이콘에 마우스를 가져다대면 추가 팝업이 등장하고. 클릭시 개별 브리핑 팝업으로 연결되는 방식. 








개별 미션 브리핑


해당 행성 / 환경 정보 / 미션 정보 / 미션 보상 등을 표기해준다.  이렇게 복잡한 화면이었을거면 차라리 전체화면으로 전환해서 다른 페이지에 보여주는게 낫지않았을까싶다. 








팝업형 지역이동


도저히 저렇게 배치를 해둔 이유를 알 수 없는 레이아웃 중 하나. 편집디자이너의 실력개선이 시급해보인다.








캐릭터 장비창


좌측은 아이템 목록 / 우측은 캐릭터 장비창과 상태. 하단은 스킬트리 표기다. 4:3 비율 지원을 위해 좌측 정렬을 해두었으나. 우측의 화면이 너무 텅 비어보인다는걸 알 수 있다.게다가 위계상으로 좌측 상단의 장비창 메뉴가 - 우측의 캐릭터 목록과 연동되어있다는건. 정말 말도안되는 설계다.








아이템 정보 툴팁


배경도 색상이 많은데, 내부에도 색이 너무 다양해서 전혀 대비가 되지 않는다.








파티 선택


캐릭터들을 끌어다가 우측에 집어넣는 형태인데. 굳이 이런 UI를 썼어야하는 이유가 무엇이었을까... dow3에서도 그렇고. 끌어다 넣는  UI 참 좋아하는듯. 







캠페인 랭크


현재까지 진행해온 게임 내용에 대한 평가표기인데. 사실 '저 화면이 있는줄도 모르는' 사람이 더 많다. 위계상으로 버튼처럼 보이지도않는 곳에 위치되어있기 때문에. 눈여겨보지않으면 그냥 넘어가게되는 화면. 







인덱스 (정보 사전)


게임에 연관된 내용들을 정리해두긴 했는데. 시각적으로 정리된게 거의 없다시피해서 아무도 안읽는 화면. 차라리 게임 속에서 직접 배우는게 더 낫다. 







미션 메뉴 


인게임 - 미션 내에서는 세이브가 불가능하고, 브리핑 화면에서만 세이브가 가능한 기적의 구조. 왜 이렇게 불편하게 게임을 만들어놨는지 잘 이해가 안간다.







미션 로딩창 : 미션목표 / 툴팁


개별 미션마다 전략적으로 파악 / 해결해야하는 내용들이 달라진다. 그래서 해당 내용들을 표기해두는 화면이기도하다. 초심자들에게는 생각보다 너무 알아야할게 많아서, 복잡하다고 느껴질만하다. 게다가 배경 자체가 밝은 톤인 경우는 많지 않으나, 우측 시안의 경우는 - 밝은 배경 때문에 하얀 텍스트가 제대로 보이질 않는다.






미션 로딩창 : 인물표기


개별 미션마다 여러 인물들에 대한 설명과, 이야기가 등장한다. 이런 부분들은 게임 몰입에 나름 도움을 주는 부분이어서 긍정적으로 평가할만 하다. 







인게임 화면 (캐릭터 확대)


THQ의 dow 시리즈나 coh 시리즈 모두 - 개별 캐릭터 모델링 수준이 매우 높은 편이다. 그래서 인게임 컷신을 찍을때나, 영상을 만들때도 이런 인게임 모델링을 그대로 이용하는 경우가 많다. 









보호미션 (좌측, 초록색 체력바) / 보스 미션 (우측, 붉은색 체력바)







보스전 연출


싱글 미션들은 대부분이 생산형 전략시뮬레이션이라기보다 - rpg형 미션이 많다. 그래서 아이템을 파밍하고, 보스를 파괴하거나, 특정 인물을 보호하는 등의 미션들이 많다. 이펙트도 화려하고 강한 적군을 떄려눕히는 재미가 있다. 


-


상세한 인게임 UI는 글 끝부분의 - 멀티플레이 쪽에서 다시 다루도록 하겠다.









미션 클리어시 1단계 팝업 : 미션명 / 보상 아이템 표기


팝업인데 무려 3단계 구조다. 첫 단계에서는 미션명과 아이템 보상을 보여준다.








미션 클리어시 2단계 팝업 : 미션 점수 평가 / 경험치 표기


전체 미션에 대한 - 적군 살상 / 생존률 / 클리어 속도를 점수로 표기해준다.저 황금 코인들은 미션 랭크와 연관된 내용이지만. 해당 메뉴가 어디에있는지도 모르는 사람이 많아서, - 사용자에게 다횣차 플레이나 / 개선을 하도록 자극제가 되어주지 못한다는게 아쉽다. 







미션 클리어시 3단계 팝업 : 파티원별 경험치 / 스탯 변경 / 개별 아이템 습득 목록


세가지 팝업의 내용들이 분명 다른 정보위계를 갖고있다는건 인정하는데. 굳이 이걸 팝업형태로 이렇게 좁게 보여줄 필요가 있었을까. 예를 들어서 첫 화면에서의 미션 클리어 / 아이템 목록은 이 화면과 합칠 수 있을 것 같다  









미션팩 모두 클리어시 - 랭크 표기 (상단 : 제국에 충성하는 엔딩 / 카오스에 물들어서 사형당하는 엔딩


게임 내에서 해결해야하는 문제들과 / 미션을 모두 클리어했을 때. 나름대로 랭크 표기를 해준다. 다만 이런 랭크시스템이 사용자에게 크게 영향을 주진 않는편. 분명  UI 요소들도 여럿 들어갔는데, 그렇게 기억에 남는 것들이 많지 않다. 








멀티 / 스커미시 게임 진행시 UI 화면


그나마 안정성이 높아보이지만. 지도화면 우측의 비어있는 공간은 여전히 문제가 있어보인다. 게다가 버튼 기본 스타일이 점선처럼 중간중간 끊겨있어서, 지저분한 느낌을 많이 받는듯. 






종족 및 영웅 선택 UI 화면


대부분의 컨텐츠들은 좌우 여백을 남기고 중심정렬을 해둔 상태인데. 유닛별 스케일이 달라서 화면이 많이 비어보이는걸 알 수 있다. 또한 UI 요소 배치를 굳이 저렇게 좌우로 둘 필요가 있었을까 싶은게. 종족선택을 상단으로 나누고. 하단 중심부로 UI를 두개로 쪼개어서 - 캐릭터 선택을 할 수 있게 했어도 좋았을 것 같다. 








멀티 및 스커미시  로딩창 (좌) / 일반 로딩창 (우)


중간중간 로딩이 많이 발생하는데. 게임 자체가 무거워서 그런지 - 데이터를 불러오고, 다시 설정하는 모양. 그래서 게임 종료시에 메인 메뉴로 돌아가는 데에도 로딩창이 등장한다.









시작화면 / 멀티플레이 - 인게임 화면 비례 비교


전체 게임 해상도를 변경하더라도 시작화면의 비례는 변경되지 않는데. 실제 인게임 비례는 변경되는, 이해할 수 없는 스케일링 방식. 







메인화면 UI 





좌측 상단 : 정보성 메시지






좌측 하단 : 미니맵 








상단 : 점령 포인트 상태값 


푸른색이 아군. 빨간색이 적군이다. 3개의 전략지점을 점령하면, 적군의 점수가 하락하는데. 상대의 점수가 0이 되면 이기는 방식. 전략지점을 많이 차지할수록, 포인트 감소 속도가 빨라진다. 







우측 상단 : 메뉴 버튼과 영웅 / 일반유닛 목록


상단의 커다란 아이콘이 영웅이고, 일반 유닛은 절반 정도의 크기로 표현된다.






우측 하단 : 기본 정보 패널 (미 선택시)


패널 상단에는 기본적으로 전략자원 / 전기자원 / 인구수 제한이 표기된다.









정보패널 : 유닛 / 건물 선택시


유닛 선택시에는 업그레이드 가능한 목록과, 캐릭터의 행동조건을 설정할 수 있다.

건물 선택시에는 최대 18칸 내에 - 테크트리 업그레이드 / 생산 가능한 목록들이 등장한다.









우측 하단 : 스킬 패널


전투에따라 쌓이는 수치를 기반으로 전략 스킬을 사용할 수 있게 되어있다.







개별  건물이나 유닛에서 - 유닛 , 건물, 생산, 업그레이드 관련 툴팁을 확인할 수 있다. 









승리 UI 



깃발모양 오브젝트가 형태가 불안정해서, 별로 좋아보이진 않는다. 게다가 이미지가 등장하는 방식이 - 단일 이미지를 애니메이팅없이 슬라이드하듯 그대로 등장시키는 바람에. 굉장히 어색하다. 





인게임 메뉴 / 게임 나가기 팝업 








인게임 옵션


메인 메뉴에서의 옵션에 비해 한정된 옵션만을 제공한다. 









통계화면


통계화면에서도 스케일링은 동작하지 않는다. 이로서 인게임 UI만 해상도에 영향을 받게 해뒀다는걸 알 수 있다.  통계 내에 색상이 여러가지가 쓰이는데. 사실 저 색상들이 무슨 의미가 있는지 명확하지 않아서. 내용을 확인하기가 어렵다.






인게임에서 등장하는 팝업은 스케일링이 먹히고, 그렇지 않은 화면들은 모두 스케일링 없이 강제 규격을 적용한다. 일관성이 정말 엉망이다.











옵션 메뉴


편집디자인은 고만고만하다. 4:3 비율을 위해 팝업모듈 형태로 좌우 여백을 둔 레이아웃이라던가. 버튼 스타일이 굉장히 위계질서가 부족해보인다던가 하는 문제는 - dow3 가 나와서도 별로 해결이 되질 않았다. 전반적으로 dow시리즈는 UI 디자인 부분에서, 배치와 레이아웃 부분에서 신경을 안쓰는것같다. 


-


심지어 하이라이트 색상이 시작화면의 노란색이 아니라, 다시 기본색상으로 바뀐듯. 일관성이 엉망이다.







해상도를 변경하더라도 UI 스케일링은 불가능하다. 그러나 팝업창을 확인해보니 - 화면 대비 크기에 스케일을 맞춰둔듯 하다.  40인치 이상 화면에서는 다른 버튼들에 비해 - 팝업창 크기가 매우 작게 보이는걸 알 수 있다.









크레딧 화면


4:3 화면을 위해 좌측 정렬을 했다는건 알겠는데. 우측의 여백이 너무 심하게 남았다.






게임 히스토리


기존에 진행한 게임들의 기록을 리플레이 형식으로 확인할 수 있다. 









유닛 페인터



멀티플레이에서 사용되는 유닛들의 색상 팔레트를 설정할 수 있다. dow 시리즈의 전통같은 것인데. dow 3에서도 거의 동일한 방식을 제공하고있다.








dow3와의 비교사례


그나마 dow2에서는 유닛의 영역과 팔레트 영역이 서로 겹치지는 않았는데. dow3에서는 그나마도 유닛과 팔레트 영역이 겹쳐서. 색상 선택이 매우 어려워졌다. (도저히 개선이 되질 않는 레이아웃)







총평


-  전반적인 UI 디자인의 레이아웃이 개판이다. 전체화면을 사용하는게 훨씬 나았을만한 규격들이 많이 보인다

-  4:3 비율을 위해서 좌측 정렬을 한 경우 - 엉망으로 보이는 UI들이 많이 발생한다. 차라리 중앙 정렬을 하지그랬니.

-  화면이 많은데 비해, 기본적인 UI 스타일링이 깔끔하지가 못한데다, 버튼들의 배치나 실루엣이 들쭉날쭉하다.

-  색상이 전반적으로 너무 다양하게 사용되었고. 정보 위계나 중요도가 한눈에 파악되질 않는다. 메뉴구조도 조악하다.

-  게임으로서야 재미가 있는데, 배워야하는 정보가 너무 많아서, 확인도 힘들고, 걸러서 보는게 매우 힘들지경.

-  UI 화면은 정말 많다. 그래서 dow 3에 들어와서 화면을 대폭 줄이고, UI에 들어가는 규격들을 단순화한것으로 추정된다.

-  전략시뮬레이션을 좋아하는 사람들이라면, 충분히 인기있을만한 게임이지만. 전반적으로 매니악하다는 느낌이 강하다.

-  워해머 팬들이나, 세계관 덕후들에게야 - 워해머 시리즈. 특히 dow 시리즈는 매우 추천하겠지만. 일반적인 게이머에겐 글쎄...

- 워낙 끔찍한 편집디자인이 눈에띠는 게임이었지만. dow3 에 와서는 크게 개선된 부분들이 많다.





dow 3에 대한 내용은 이곳에서 확인하시라

https://brunch.co.kr/@clay1987/126






이 내용은 UI 디자인 연구소 - 단톡방에 올려진 자료를 정리하여 만들어진 컨텐츠입니다.

저희 단톡방은 잡담이 불가능한 방입니다. 단톡방에 들어오시려는 분은 - 이용안내문을 꼭 확인해주세요!





단톡방 이용안내

https://brunch.co.kr/@clay1987/113


작가의 이전글 Node.js와 비동기 데이터 처리방식
브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari