게임 UX 인사이트 (22) 썸네일형 리스트형 한정된 공간을 활용하는 법, 검색 UI 디자인 - 레전드 오브 룬테라 의 카드 수집품 메뉴는 필터와 검색 기능을 제공하여, 수많은 카드 목록 속에서 사용자가 원하는 카드의 정보를 빠르게 탐색하도록 돕고 있습니다. 여기에서 눈여겨볼 점은 검색어를 입력하는 검색 창(텍스트 필드)을 바깥으로 꺼내놓지 않고 숨겨둔 것입니다. 한정된 화면 공간에서 제공할 기능과 정보는 많습니다. 모든 정보를 한 번에 보여준다면 사용자는 정보들을 파악하고 그 안에서 필요한 것을 찾는데 더 많은 시간과 인지 노력을 쏟게 됩니다. 때문에 사용자의 사용 패턴을 고려하여 정보들의 우선순위를 세우고 중요도에 따라 제공하여, 사용자의 인지 부하를 줄여야 합니다. 는 카드 수집 메뉴에서 검색 창을 숨겨놓았습니다. 사용자가 검색 기능을 사용하고자 할 때, 돋보기 버튼을 누르면 검색어를 입력할 수 있는 텍스트 필드.. 자동 버튼 UI에서 'AUTO'가 사라진 이유 - 디스라이트, AFK2: Journey, 제2의 나라 많은 게임에서 자동 버튼은 'AUTO'라는 글자가 자리를 크게 차지해왔습니다. 글자는 의미 전달에 있어서 이미지보다 직관적입니다. 특정 의미를 가장 정확하게, 오류 없이 전달할 수 있지요. 그럼에도 불구하고 최근 대형 게임사가 선보이는 신작 게임들에선 자동 버튼에서 'AUTO' 글자가 점차 사라지고 있습니다. 그 이유는 무엇일까요? 글자를 대체하는 이미지 모바일은 한 손에 들어오는 기기의 특성상 화면의 크기가 작고, 화면 속 공간은 한정적입니다. 모든 정보를 글자로 전달하기에는 무리가 있지요. 때문에 글자를 최대한 줄이고 이미지로 의미 전달을 대체합니다. 노출하는 정보량이 많은 게임 ui에서 특히나 아이콘 버튼을 선호하는 이유입니다. 다국어 제공의 부담 게임 속 언어를 번역하여 제공하는 것은 사용자 친화.. 게임 속 텍스트 필드 UI 디자인 사례 - 원신, 레전드 오브 룬테라, 쿠키런킹덤 사용자가 글자를 입력하는 박스 모양의 공간을 '텍스트 필드'라고 합니다. 게임에서 닉네임을 만들 때 흔히 마주치지요. 게임 속 이름은 무한의 길이를 가질 수 없기 때문에, 최대 글자 수 제한을 갖게 됩니다. 또한 특수문자와 비속어 등은 사용할 수 없으며, 사용자가 입력한 이름이 이미 기존에 사용 중이던 중복 이름인 경우도 있습니다. 이러한 까다로운 조건들은 사용자에게 '이름 짓기'가 어렵고, 피곤한 일로 느껴지게 할 수 있습니다. '이름 짓기'는 게임의 초반 부분, 즉 사용자가 게임에 완전한 애착을 느끼기 전에 만나는 경우가 많습니다. 이곳에서 피로도를 느낀다면, 게임의 재미를 느끼고 게임에 완전히 정착하기도 전에 그들은 떠날 수도 있습니다. 이를 방지하기 위해서는 사용자가 이름 짓는 단계에서의 고민을 .. 모바일 게임 속 배지의 디자인 사례 - 브롤스타즈, 쿠키런 킹덤, 탕탕특공대 버튼의 오른쪽 상단에 위치하는 빨간색 점을 배지(Badge)라고 합니다. 배지는 사용자에게 새로운 정보가 있음을 알려줍니다. 정보의 수량을 나타내는 숫자를 함께 노출하거나, 단순한 점만으로 표현하기도 합니다. 이 기본적인 문법에서 나아가 더욱 세분화한 배지로 세밀한 정보를 전달하는 게임이 있습니다. 브롤스타즈, 쿠키런 킹덤, 탕탕특공대의 사례를 통해 다양한 배지 디자인을 알아보겠습니다. 브롤스타즈 의 배지는 빨간색과 초록색, 두 가지 색으로 구분하여 사용합니다. 이는 전작 에서 사용했던 문법과 유사합니다. 1. 초록 배지는 중요도가 낮은 정보에 사용하고 있습니다. 업그레이드가 가능한 브롤러의 수를 나타내거나, 뉴스 혹은 친구 요청과 같이 즉시 확인하지 않아도 게임 플레이에 무방한 정보에 사용합니다. 빨간.. 닫기 버튼을 없애면 사용자 경험에 어떤 영향을 줄까? - 디스라이트 UX 분석 기대를 모으고 있는 릴리스 게임즈의 신작 게임 디스라이트(Dislyte)에는, 다른 게임에는 당연하게 있지만 디스라이트에선 찾기 힘든 것이 있습니다. 바로 'X' 모양의 닫기 버튼입니다. 이 게임에는 다양한 형태의 팝업이 등장하지만, 그 속에서 닫기 버튼을 찾기는 어렵습니다. 사용자가 화면을 닫고자 할 때 누르는 'X' 모양의 닫기 버튼은, 게임을 비롯한 각종 OS와 소프트웨어에서 보편적으로 사용하고 있습니다. 릴리스 게임즈의 전작인 AFK 아레나에서 또한, 쉽게 닫기 버튼을 찾을 수 있었어요. 그런데 디스라이트 개발진은 왜 팝업에서 닫기 버튼을 없앴을까요? 기존의 익숙한 사용자 경험을 따르지 않고 다른 시도를 한 이유는 무엇일까요? 팝업에서 닫기 버튼을 없앰으로써 얻을 수 있는 효과에 대해 알아보겠습니.. 사용성을 높이는 모바일 게임 UI 설계하기 - 테일드 데몬 슬레이어 회사 기술 블로그에 글을 썼습니다.😃 '모바일 게임에서 사용성을 높이려면 어떻게 화면을 설계해야 할까?'에 대하여 실제 개발 사례와 함께 공유합니다. 원문은 아래 링크에서 확인 부탁드려요! 사용성 UP! 모바일 게임 UI 설계하기 - 테일드 데몬 슬레이어 는 모바일 사용성을 극대화하여 설계했습니다. ‘하단 중심의 디자인이 왜 중요한지’에 대하여 알아보고, 게임 속 실제 적용 사례를 공유합니다. medium.com 긴 글 보시느라 고생하셨습니다. 요약 들어갑니다. 그래서 어떻게 화면을 디자인해야 한다구요? 상호 작용하는 버튼, 스크롤과 같은 요소는 화면 아래쪽에, 눈으로만 확인하는 정보는 위 쪽에 배치합니다. 손으로 상호 작용하는 동안 확인해야 할 정보가 손에 가려지지 않도록 해주세요. 화면 속에서 사용자.. 디스라이트 (Dislyte) - 반복 작업을 도와주는 게임 UX 디자인 사례 게임을 플레이하며 유저들은 아이템과 경험치 파밍을 위해 매일 똑같은 던전을 돌거나 특정 목적에 도달하기 위해 같은 행위를 반복 수행한다. 이 단순 반복 행위에서 지루함을 겪기도 하고, 투자하는 시간과 비용을 저울질하다가 어느 순간 게임 플레이 자체에 회의감을 느낄 수도 있다. 디스라이트 (Dislyte)는 유저가 반복해서 수행해야 하는 작업들을 도와주는 편의 시스템을 다양하게 제공하여, 이러한 부분을 크게 해소하였다. 반복 자동 전투 시스템 이미 클리어 한 메인 스토리와 던전은 한 번에 최대 10회까지 반복해서 자동으로 전투를 진행할 수 있다. 경험치나 아이템의 반복 파밍 시 편리하다. 반복 전투는 설정에서 세부 조건을 지정할 수 있다. 전투는 스킵하지 않고 과정을 전부 보여준다. (기 클리어 맵이라도 .. 시즌 패스 UX 디자인 - 보상의 위치에 숨은 비밀 시즌 패스 시스템은 모바일 게임에서 필수가 된 핵심 BM 요소이다. 유저에게 게임의 진행에 따라 적절한 보상을 제공함으로써 동기를 부여하고, 성공적으로 게임에 안착할 수 있도록 돕는 역할을 한다. 유저는 기본으로 주는 무료 보상에 만족할 수도 있고, 원한다면 시즌 패스 결제를 통해 더 좋거나 많은 유료 보상을 얻어 게임의 진행에 박차를 가할 수 있다. 유료 패스 보상의 목록은 사용자가 패스 구입을 고려하게 만드는 광고판이다. 디자이너는 이 광고판을 활용해 패스 상품의 보상들이 더 좋아 보이도록, 유저가 이 상품을 가지고 싶다는 생각을 갖도록 이끌어내야 할 것이다. 브롤스타즈의 사례를 통해 패스 유료 상품의 보상을 더 어필할 수 있는 방법 중 한 가지를 알아보자. 브롤스타즈의 시즌 패스 디자인에는 위의 두.. 결제로 이끄는 게임 상점 UX 디자인 - Cover Fire 어떻게 하면 사용자에게 상품을 더욱 어필하고, 더 많은 결제를 이끌어낼가에 대한 주제는 모든 게임 산업의 고민이며 게임 개발자들의 핵심 임무 중 하나이다. 커버 파이어(Cover Fire)의 사례를 통해 결제 과정에서의 중도 이탈을 최소화하고, 전하고자 하는 상품의 매력을 더욱 어필하는 방법이 담긴 상점 UX 디자인 사례 몇 가지를 살펴보자. 1 구매 확인 팝업에서 닫기 버튼을 아예 없앴다. 정확하게 말하면, 팝업 뒤의 검은 여백을 터치해야 비로소 팝업이 닫힌다. 화면에서 이탈하는 버튼 역할을 하는 곳이 유저의 행동을 유발하는 힘, 즉 어포던스를 갖지 않은 셈이다! 때문에 화면의 모든 것이 상품의 구성 전달과 구매 버튼에 집중되어 있다. 이로 인해 사용자는 온전히 상품의 매력을 탐색하고 구매하는 과정에 .. 꿈의 마을(Town ship) 상점 UX 분석 - 왜 재화 정보를 아래로 내렸을까? 우리가 모바일 게임을 할 때면, 코인과 보석 등의 재화 정보가 화면 상단에 있는 것을 많이 보았고, 또한 이것에 익숙하다. 이렇게 재화 정보를 상단에 배치하는 이유는, 모바일 Landscape 화면에서 상단은 눈으로 확인하는 정보의 영역이기 때문이다. 화면 상단을 제외한 양 옆과 하단에는 주요 액션 버튼들이 위치한다. 꿈의 마을(Town ship) 역시 메인 인게임 화면에서 재화 정보를 우상단에 배치하고 있다. 그런데 상점 메뉴에 들어가면, 이 재화 정보가 상단에서 하단으로 내려가 옮겨져 있다. 개발자는 왜 재화 정보를 익숙한 상단에 두지 않고 아래로 내렸을까? 1 첫 번째 목적은, 온갖 정보와 버튼이 모인 메인 인게임 화면과 달리, 상점에서 중요도가 높은 기능은 상품의 확인과 구입이기 때문이다. 메뉴를.. 이전 1 2 3 다음
