디시인사이드 갤러리

갤러리 이슈박스, 최근방문 갤러리

갤러리 본문 영역

퍼즐 플랫포머 게임 제작 후기#5_1 PlayX4전시 후기+튜토리얼(1)

BIB갤로그로 이동합니다. 2024.05.30 10:10:02
조회 5400 추천 14 댓글 13

- 관련게시물 : 퍼즐 플랫포머 게임 제작 후기#4_1Pa!nt 게임 규칙

- 관련게시물 : 퍼즐 플랫포머 게임 제작 후기의 "Pa!nt"도 PlayX4 참가합니다!


PlayX4에 대한 간단한 후기

원래는 이 글을 지난 금요일에 올려 화, 금연재방식을 유지하려 했지만, 내 체력으로는 도저히 날짜를 지킬 수 없었다. 사실 이번 PlayX4를 통해서 우리는 정말 많은 요소들이 확인되었고, 고쳐야 할 방향성, 부족한 부분들을 알 수 있었어서, 개발적으로 정말 큰 전시회였다.

viewimage.php?id=2abcdd23dad63db0&no=24b0d769e1d32ca73ce980fa11d028318bcc964a2550adfe9a320d1575e6db96cb46d886d3b36367156d018ab54d6ca32a82f391ad53ee5ca6d8b07b0af6c065938aa1



특히, 우리가 준비했던 색약, 색맹 이용자를 위한 모드가 얼마나 많이 어설프고 부족한지 자세한 피드백을 들을 수 있었고, (다시 한번 부스에 찾아와 주시고, 피드백을 주셔서 정말 감사합니다.) 우리 게임의 튜토리얼과 초반흐름의 부자연스러운 구간에 대한 확인을 할 수 있었고, 물리엔진 개선을 통한 조작감 개선이 유효했다는 것을 확인할 수 있어 너무 다행이었다.

이번 글의 주제는 그 내용들 중 튜토리얼에 대한 부분이다. 이 부분은 앞선 레벨디자인 부분과 가장 밀접한 주제이지 않을까 싶다.

현재 튜토리얼은 Steam, Stove모두 동일하며, 1년 정도 전에 개발이 중단된 모바일 버전은 이전의 모습을 간직하고 있다. 이번 PlayX4에서 사용되었던 튜토리얼은 Steam, Stove에 올라간 버전과 동일한 튜토리얼이었는데, 이번 행사에서 옆에 계셨던 분께서 아끼지 않고 많은 피드백을 해주셔서 튜토리얼을 비롯한 게임의 주요한 흐름을 개선할 방향이 정해지게 되었다. (이 글을 읽게 되실지는 모르겠지만, 현장에서도 말씀드렸었지만, 정말 감사드립니다. 덕분에 더 나은 게임을 만들 수 있을 것 같습니다.)

그래서, 새로운 튜토리얼을 다시 만들게 된 기념으로, 지금까지의 우리 게임의 튜토리얼의 변천사와 앞으로 유의하여 개발해 나가려는 방향성등을 정리해 볼까 한다.

(혹시 지금의 튜토리얼이 궁금한 사람들은 아래의 링크에서 데모를 플레이해봐도 좋을 것 같다.)

https://store.steampowered.com/app/2516270/Pant/

튜토리얼에 대해서

내가 이전에 보았던 어느 글에서는 가장 좋은 튜토리얼은 튜토리얼이 없는 튜토리얼이었다. 설명을 붙여보자면, 튜토리얼임을 시스템적으로 나타내기보다는, 자연스럽게 나타내고, 이용자가 자연스럽게 받아들이도록 만든다는 것이다. 나는, 이전에 이 문장을 그대로 실천하려 했었고, 5개 정도의 스테이지에 나누어서 규칙을 하나씩 체험하고, 시행착오를 겪으며 이해할 수 있도록 만들려고 했었다.

단순히 스테이지로 구성된 튜토리얼

viewimage.php?id=2abcdd23dad63db0&no=24b0d769e1d32ca73ce980fa11d028318bcc964a2550adfe9a320d1575e6db96cb46d886d3b36367156d018ab54d6ca32a82f391ad53ee50fbdcbd2d59fec0651c9505



(좌측 상단부터 좌측순서대로 1,2,3 우측하단부터 4,5 순서이다)

각 스테이지는 각각의 내용을 전달하고자 했었다. 그러나, 실제로 플레이해 보았을 때, 이용자들은 핸드폰을 잡는 방법에서부터 많이 낯설어했으며, 제대로 된 "설명"이 없는 튜토리얼에서 이용자들은 규칙을 "인지"할 수 없었고, 게임의 버그나, 게임의 이상함으로써 이용자들에게 받아들여졌다.

이 단계에서 우리가 알 수 있었던 부분은, 우리 수준에서는 이용자가 시행착오를 통해서 불편함을 겪었을 때, 이것이 규칙임을 설명하기 위한 "설명"을 반드시 할 필요가 있다는 점이었다.

글을 통한 설명이 추가된 튜토리얼

이후에 우리가 한 조치는 "설명"을 추가하는 것이었다. 이때, 이용자들이 글을 안 읽는 상황을 막기 위해서, 글을 띄우고 화면을 터치하기 전까지는 움직임을 잠갔었다.

이 방식도 좋은 결과를 거두지 못했었는데,

1. 이용자는 화면을 터치하고 있으며, 튜토리얼에서는 특히 "스킵"하고 싶어 하며, 빠르게 뒤로 가고 싶어 대기화면이나, 로딩 화면에서 잦은 터치가 발생했다. 이 터치들은 게임 입장 시 나오는 글들을 빠르게 껐으며, 이전과 동일한 문제를 일으켰다.(물론 이전과는 다르게 차분히 글을 모두 정독하는 이용자들이 있었으니, 이전보다는 확실히 나아진 것은 맞다.)

2. 게임의 흐름을 끊는 안내는 이용자의 피로감을 높였다. 내가 보았던 이용자들은 가능한 끊김 없이 게임을 이어서 많이 하고 싶어 했는데, 이러한 특성상 강제로 안내를 하는 튜토리얼은 많은 피로감을 만들었다.

(단적으로 나도, 게임을 할 때 튜토리얼의 모든 글을 빠르게 스킵하며, 안 읽고 하는 사람이니, 내가 할 땐 몰랐지만, 제작자로서 겪어보니 신기한 부분이었다.)

이용자들은 빨리 재미있어지기를 바란다.

사실 너무나 당연한 말이다. 나도 게임을 할 때 초반 컷 신은 흥미로운 내용이 아니면 항상 바로 스킵하며, 스킵 불가능한 게임에는 엄청나게 불평을 하니 말이다. 다만 이러한 당연한 특징은 정작 직접 게임을 만들 때는 인지하지 못했다. 이러한 이용자의 특성은 "조금이라도 우리 게임을 많이 즐겨줬으면 좋겠다"라는 희망사항에서 스테이지들의 잠금을 걸지 않았던 상황과, 스테이지 형식의 튜토리얼이 합쳐져 다양한 문제를 일으켰었다.

1. 이용자가 초반에 재미없다고 느낀 경우

당시, 스테이지 형식으로 6개의 스테이지를 가야지 튜토리얼이 끝나고 재미있어지던 구조의 게임을 플레이하던 많은 사람은 4번째 스테이지쯤에서 너무 쉽다며, 게임을 꺼버렸었다.(이 부분은 사실 물리엔진의 속도가 너무 느려서 이용자가 각 스테이지를 클리어하는데 걸리는 소요시간과 스트레스가 컸기에 참을 수 있는 스테이지가 짧았던 것도 있는 것 같다. 이 부분은 지금에 와서는 튜토리얼의 개선뿐만 아니라 물리엔진의 개선이 더해져서 보다 많이 나아진 것 같다.)

2. 이용자가 재미를 찾아 나서는 경우

스테이지들의 잠금을 없에두었던 결과 이용자들은 튜토리얼 도중에 이탈해서 바로 최고 난도로 직행했었다. 그 결과 많은 유저는 가장 뒤의 스테이지에 도전했고, 규칙과 새로운 장치들에 적응하지 못해 많이들 어려워했었다.(이를 막겠다고, 각 챕터별 1 스테이지만 열어두기도 했지만, 이번에는 후반 챕터의 기믹을 설명하는 1 스테이지만 하고, 후반 챕터가 너무 쉽다는 피드백을 받았다.(눈앞에서 말한 대로 플레이하고, 피드백해 주셨었다))

하나의 큰 스테이지로 제작

앞선 이미지들을 보면 알겠지만, 앞선 튜토리얼들은 모바일버전에서 개발되던 당시에 제작되었던 튜토리얼이다. 이후 우리는 몇 가지 이유에서 PC로 개발을 이어가게 되었는데, 이때 정말 많은 시스템이 대체되었다.

그 과정에서 바뀐 것 중 하나가 튜토리얼이었는데, "LIMBO"를 하고 싶었던 내가 조금은 무리를 부려서 만든 하나의 스테이지에서 서사를 부여하고 동기를 부여하는 방식의 튜토리얼이었다. 이 튜토리얼은 6개의 나누어진 스테이지를 하나의 스테이지로 이어놓은 것이었다. 여기서 추가적으로 내 23년을 모두 쏟아부었던 "스토리"에 대한 욕심 때문에 특히 이런 형식을 취했었다.

이때 내 생각은 "PC/Console"게임이라면 그에 상응하는 볼륨과 콘텐츠여야 한다라는 생각에서 스토리를넣으려 했었지만, 이거는 큰 착각이었다. Pa!nt가 이미 퍼즐게임인걸 모르고 한 말이었다.

아무튼, 이렇게 제작된 튜토리얼은 다음과 같았다.

흘러가는 글의 배치

여기서, 캐릭터가 특정 영역에 닿을 때마다, 배경과 화면 하단에 텍스트가 등장하도록 제작을 했었다.

이 방식은, 글을 안 읽는 이용자와 글을 읽는 이용자 모두 읽을 수 있도록 하게 하기 위해서 제작한 방식이었다. 배경에 글을 배치하는 방식이 좋았던 점은, 이용자가 실제로 해당행동을 해야 하는 위치에 설명을 배치하여 보다 직관적으로 전달할 수 있다는 점이었다.


오늘도 저는 분량 조절에 실패하여, 이어지는 5_2 글에서 PC버전에서 겪은 시행착오와 PlayX4에서 얻은 피드백을 다룹니다.
다음글 보기



퍼즐 플랫포머 게임 제작 후기#5_2 튜토리얼(2)



죄송합니다.. 오늘도 글 분량 조절에 실패하여 글을 나눠서 올립니다.ㅠㅠ 본 내용은 앞선 글에서 이어집니다.
앞선글의 링크


플레이어의 흐름, 예외를 차단하고 강제하는 게임 흐름

우리 게임에서 튜토리얼을 짤 때 가장 힘들었던 부분은 퍼즐 게임의 성격 상, 이용자가 실수하였을 때 실수를 돌이키는 "되돌리기 기능"에 대한 튜토리얼이 가장 어려웠다.

이 부분을 만들 때, 내가 가장 고심했던 부분은 "퍼즐게임스러운 되돌리기"였다. 즉, 플레이어가 머리를 썼으면 실수하지 않고, 되돌릴 필요가 없었다는 "예상"을 부여하면서 동시에 되돌려야 하는 상황이 되도록 만드는 것이었다. 이 부분은 앞선 레벨디자인 글에서 나왔던 이용자들의 관성들을 활용해서 실수를 할 수 있도록 유도할 수 있었다.

내가 만든 "깰 수 있었을 것 같지만 모두가 실수하는 레벨"은 실제로 알면 바로 지나갈 수 있는 "깰 수 있는 스테이지"였으며, 10명 중 9명은 실수를 하는 "거의" 모두가 실수하는 레벨을 만드는 데 성공했다.

그러나, 세상은 90%를 허락할 정도로 쉽진 않았다. 일반적인 스테이지라면 상관이 없었겠지만, 튜토리얼은 플레이어가 플레이하는 과정에서 반드시 필요한 것들을 이해시키고 안내하는 곳이다. 단 1명이라도 안내받지 못하는 일은 생겨선 안 됐다.

그 결과 우리는 퍼즐로선 해선 안 되는 "깰 수 없는 스테이지"를 제작해서 튜토리얼에 넣고, 플레이어가 선택을 되돌리는 순간, "깰 수 있는 스테이지"로 바뀌도록 제작했다.

(좌: 되돌리기 전으로 반드시 노란색이 되어야 함, 우: 되돌린 후, 초록색인 상태로 이어서 갈 수 있는 발판이 생김)

이 부분은 아직까지도 미련이 남아 고민 중이긴 하지만, 확실한 것은, 이용자가 "튜토리얼"을 모두 끝까지 플레이했음에도 다른 사람과 경험한 내용이 달라지면, 이후에 이것은 큰 문제가 된다는 것을 다양한 행사를 통해서 알게 되었다. 특히 그것이 게임의 주요한 기능이라면 더욱이 말이다.

(나중에 부족한 경험을 메꿀 수 있는 친절한 가이드가 있다면 다를 수 있을 것 같아, 나중에는 "깰 수 있었을 것 같지만 모두가 실수하는 레벨"에 다시 한 번 정말로 도전해 볼 것 같다.)

플레이어의 흐름을 적절히 유도하는 직관적인 안내

해당 구간은 우리 게임 내에서도 가장 어려운 움직임인, 수직으로 위에 있는 플랫폼에 올라가는 방법이다.

이전에는 위에서 처럼 보이는 화살표가 없었다. 그렇다 보니, 이용자들이 올라갈 수 있음을 알기 힘들었다. 이로 인해서 많은 이용자들이 어려움을 겪었는데 이때 내가 의도한 플레이는 "단 1가지의 정답밖에 없다면 플레이어는 그 정답을 시도할 것이다"였는데, 실제 반응은 "1가지 정답을 모르는 플레이어는 게임을 꺼라"라는 뜻이 되어있었다.

이후, 이 부분은 화살표를 사용해 표시했고, 이전대비 많은 이용자가 순식간에 의미를 이해하고 플레이할 수 있게 되었다.(화살표가 없었을 때는 10명 중 3명 정도만 정답을 알았으며, 넣은 후에는 7명 정도로 늘었으나, 튜토리얼이라는 점에서 이것은 불합격이다.)

이 부분에서 내가 했던 실수는 휘어있는 화살표를 예쁘게 그릴 자신이 없었고, 아트를 괴롭히고 싶지 않단 이유에서 하나의 화살표를 두 번 배치했는데 이것이 많은 혼란을 만들었다. 실제로 이용자들 중에서는 좌측 상단에 있는 녹색 블록에 올라갈 수 있다는 오해를 일으켰었다. (이 부분은 추후에 애니메이션으로 대체할 것으로 계획 중이다.)

반복적인 안내

내가 지금 생각하고 있는 올바른 튜토리얼은 누구든 100% 따라올 수 있어야 한다는 점이다. 이를 위해서는 단순히 한번 보여주고 끝내면 안 된다는 점 또한 무척 중요한 것 같다. 나는 평소에 성격이 급해서 한 번의 설명조차 제대로 읽지 않지만, 그 탓에 일부 게임에서 방어기능이 있는지도 모른다던가, 스킬이 있는지도 모른 체로 게임 중반까지 가는 경우가 꽤나 많다. 이처럼 플레이어 중에는 한번 정도 튜토리얼에서 버튼을 눌르고 시키는 대로 플레이를 해줄 수는 있지만, 플레이어는 아직 그것에 익숙해지지 않았을 수 있다.(아니면 나처럼 보고도 까먹을 수도 있다.)



출처: 인디 게임 개발 갤러리 [원본 보기]

추천 비추천

14

고정닉 5

5

댓글 영역

전체 댓글 0
등록순정렬 기준선택
본문 보기

하단 갤러리 리스트 영역

왼쪽 컨텐츠 영역

갤러리 리스트 영역

갤러리 리스트
번호 제목 글쓴이 작성일 조회 추천
설문 가족과 완벽하게 손절해야 할 것 같은 스타는? 운영자 24/06/24 - -
238606
썸네일
[중갤] 플스 2에 VGA 박기
[306]
Urushi갤로그로 이동합니다. 06.11 36259 439
238604
썸네일
[디갤] 교토역 주변에서 산책하면서 사진 찍기
[45]
유동교토갤로그로 이동합니다. 06.11 12857 31
238603
썸네일
[야갤] 강형욱부부 결국 전직원에게 고소당함 ㄹㅇ...JPG
[1036]
슈화(착한대만인)갤로그로 이동합니다. 06.11 55778 712
238600
썸네일
[치갤] 한국 유튜버 맞히기 대참사...jpg
[1089/1]
ㅇㅇ갤로그로 이동합니다. 06.11 64918 720
238598
썸네일
[싱갤] 싱글벙글 딸과 잘 놀아줘야하는 이유.jpg
[369]
Secretpie갤로그로 이동합니다. 06.11 60930 602
238597
썸네일
[이갤] 츠키가 한국에서 버스 탈 때 앞자리만 앉는 이유.jpg
[347]
ㅇㅇ갤로그로 이동합니다. 06.11 38337 357
238595
썸네일
[야갤] 돈 밀리고 있다는 군대 근황..jpg
[890]
ㅇㅇ(110.8) 06.11 61851 702
238594
썸네일
[한화] 서울이 고향인 조인성이 한화팬이 된 이유
[99]
칰갤러(211.234) 06.11 18227 102
238593
썸네일
[미갤] 애플 혐오하는 일론 머스크 근황...jpg
[256]
ㅇㅇ갤로그로 이동합니다. 06.11 39559 188
238591
썸네일
[싱갤] 10년째 우기고 있는 안정환
[207]
ㅇㅇ(59.13) 06.11 35687 90
238590
썸네일
[걸갤] 블라 하이브 직원글 이건 조사해봐야할듯
[158]
걸갤러(117.123) 06.11 29601 152
238588
썸네일
[대갤] 韓日 공동 여론조사, 양국 모두 바이든 당선 희망 60% 이상
[264]
난징대파티갤로그로 이동합니다. 06.11 21194 258
238587
썸네일
[싱갤] 오싹오싹 7세 여아 성폭행범이 했던 말.jpg
[678]
ㅇㅇ(182.226) 06.11 56177 626
238584
썸네일
[일갤] 여행뽕차서 보정하고 대리만족한 사진들
[41]
ㅇㅌㅊ갤로그로 이동합니다. 06.11 9982 16
238582
썸네일
[야갤] 남친이 무식한건가요 제가 기준이 엄격한가요
[763]
야갤러(194.99) 06.11 45092 193
238581
썸네일
[코갤] 엑트지오대표 히딩크닮은 관상이라 사기꾼아니라는데 이게 기사제목맞음?;
[293]
부산노도(175.198) 06.11 17128 116
238579
썸네일
[싱갤] 일본일본 시골촌
[66]
기시다_후미오갤로그로 이동합니다. 06.11 26833 83
238577
썸네일
[번갤] 300만원 번개페이 시작의 서막
[227]
번붕이(106.101) 06.11 35794 196
238575
썸네일
[이갤] 페루 절벽호텔에 간 일본인 유튜버..jpg
[177]
ㅇㅇ갤로그로 이동합니다. 06.11 31592 140
238574
썸네일
[싱갤] 싱글벙글 개썰매 개들한테 미안해하지 않아도 되는 이유
[282]
뽁찡갤로그로 이동합니다. 06.11 32145 263
238573
썸네일
[새갤] 이재명 "대북전단은 위법...행정조치 검토해야"
[1159]
포만한갤로그로 이동합니다. 06.11 22467 471
238571
썸네일
[교갤] DJ예송 근황
[451]
ㅇㅇ갤로그로 이동합니다. 06.11 42887 187
238570
썸네일
[전갤] 회사에서 담배 피운 아빠, 애들 옆에만 있어도..'충격' 결과
[396]
몽쉘통통갤로그로 이동합니다. 06.11 31716 108
238567
썸네일
[오갤] 벤자리 범가자미 후기(씹스압) - 1
[23]
금태충갤로그로 이동합니다. 06.11 9047 28
238566
썸네일
[싱갤] 최근 내전 수준이라는 프랑스 근황
[636]
ㅇㅇ갤로그로 이동합니다. 06.11 41641 357
238565
썸네일
[새갤] [채널A] 친팔레스타인 시위대 “가자지구 해방하라”
[159]
정치마갤용계정갤로그로 이동합니다. 06.11 11652 54
238563
썸네일
[이갤] 일본의 고대 문화는 대부분 카피한것...jpg
[1051]
설윤아기갤로그로 이동합니다. 06.11 26925 164
238562
썸네일
[놀갤] (장문) 제2롯데월드의 역사
[42]
흐뉴갤로그로 이동합니다. 06.11 16426 50
238561
썸네일
[싱갤] 말라위 부통령 사망
[219]
ㅇㅇ갤로그로 이동합니다. 06.11 24598 99
238559
썸네일
[중갤] 회사에 40대 꼰대새기 또 시작이네.blind
[1421]
중갤러(146.70) 06.11 44231 228
238558
썸네일
[이갤] 곽튜브보다 먹는 양이 많다는 김도훈...jpg
[221]
설윤아기갤로그로 이동합니다. 06.11 29963 73
238557
썸네일
[야갤] 손톱에 흰 점은 왜 생기는 걸까?.jpg
[212]
ㅇㅇ갤로그로 이동합니다. 06.11 29381 67
238555
썸네일
[이갤] 장 건강에 도움이 되는 방법
[300]
당돌갤로그로 이동합니다. 06.11 26821 119
238553
썸네일
[로갤] 일본 로스트미디어 빙산 5층을 간단하게 알아보자
[58]
ㅇㅇ갤로그로 이동합니다. 06.11 12396 36
238550
썸네일
[싱갤] 어질어질 일본에서 알중 환자 많이 만든 술.jpg
[603]
멍청벼농사갤로그로 이동합니다. 06.11 39822 336
238549
썸네일
[이갤] 요즘 일본에서 한류 때문에 새롭게 열풍이라는것.jpg
[245]
ㅇㅇ갤로그로 이동합니다. 06.11 33148 147
238547
썸네일
[카연] 담배피러 옥상으로 올라온 남자가 즉으려는 여자를 설득하는 만화
[181]
별란갤로그로 이동합니다. 06.11 19487 107
238546
썸네일
[야갤] “엄마가 때려” 교감 폭행한 초3, 부모와 분리되나…‘긴급임시조치’ 요청
[205]
야갤러(185.89) 06.11 16966 48
238545
썸네일
[싱갤] 군첩군첩 전 세계의 유명한 최신형 전차들에 대해.araboja
[216]
10식갤로그로 이동합니다. 06.11 19984 123
238543
썸네일
[이갤] 여자들 미자때보다 20~22살 시기가 더 위험한듯...jpg
[912]
설윤아기갤로그로 이동합니다. 06.11 51033 206
238542
썸네일
[육갤] 여군이 부대에서 환자를 없애는 법
[389]
육갤러(185.89) 06.11 33896 575
238539
썸네일
[야갤] 친구가 알바 하루 대신 해주면 돈을 줘애돼??..jpg
[651]
야갤러(45.12) 06.11 35188 332
238538
썸네일
[해갤] 전세계적으로 유행하는 J-POP 스토리 라인
[191]
해갤러(211.234) 06.11 28544 103
238537
썸네일
[싱갤] 싱글벙글 컨닝하던 의대생들 근황
[323]
ㅇㅇ갤로그로 이동합니다. 06.11 45526 320
238535
썸네일
[이갤] 요즘 신축 오피스텔에서 유행하는 화장실 구조.jpg
[353]
ㅇㅇ갤로그로 이동합니다. 06.11 39798 149
238534
썸네일
[기갤] 딸이 남친이랑 단둘이 여행간다고 하면?
[214]
긷갤러(185.114) 06.11 29440 160
238533
썸네일
[모갤] ktx 중간정차역이 증가하는 이유를 araboza
[227]
ㅇㅇ(219.240) 06.11 22689 56
238531
썸네일
[야갤] 지하철 계단에 숨겨진 비밀...jpg
[177]
ㅇㅇ갤로그로 이동합니다. 06.11 33203 218
238530
썸네일
[싱갤] 싱글벙글 애플의 혁신 계산기 어플 도입
[440]
종이멘탈갤로그로 이동합니다. 06.11 28030 229
238529
썸네일
[코갤] 여자가 푸쉬업 1번 성공시 1만원 증정 이벤트 . jpg
[817]
GoldenTiger갤로그로 이동합니다. 06.11 35420 603
갤러리 내부 검색
제목+내용게시물 정렬 옵션

오른쪽 컨텐츠 영역

실시간 베스트

1/8

뉴스

디시미디어

디시이슈

1/2