디시인사이드 갤러리

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

갤러리 본문 영역

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

BIB갤로그로 이동합니다. 2024.05.30 10:10:02
조회 5392 추천 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 - -
223773
썸네일
[미갤] 찜질방 요금이 10만원이나 나온 이유.JPG
[329]
ㅇㅇ갤로그로 이동합니다. 04.16 33105 522
223771
썸네일
[새갤] 한때 보수 정당 우세 지역 소리듣던 충청도의 변화.jpg
[502]
코하레갤로그로 이동합니다. 04.16 20957 232
223769
썸네일
[디갤] 비틱질 하지 말고 사진 봐줘라
[47]
「아이묭」갤로그로 이동합니다. 04.16 9707 22
223768
썸네일
[싱갤] 오싹오싹 국군수도병원에서 벌어진 목숨을건 휠체어 레이스
[95]
티타늄맨갤로그로 이동합니다. 04.16 36859 214
223767
썸네일
[U갤] 페레이라가 ufc에 온 이유…jpg
[163]
ㅇㅇ(223.39) 04.16 18738 293
223765
썸네일
[이갤] 손님 얼굴 발로 밟는 직원
[253]
슈붕이(89.40) 04.16 30933 164
223764
썸네일
[싱갤] 싱글벙글 배트남 졸업식 뒷풀이..gif
[536]
ㅇㅇ(61.82) 04.16 42230 308
223763
썸네일
[배갤] ㅈ소노비의 방콕휴식(4) - 추억의 카오산은 ㅠ
[14]
ㅇㅇㅇ갤로그로 이동합니다. 04.16 5813 16
223761
썸네일
[기갤] 정호연이 해외광고 촬영할 때 신기했다는 시스템.jpg
[179]
ㅇㅇ(139.28) 04.16 20753 122
223760
썸네일
[냥갤] 닥터그린벨 공지 떴네요??
[50]
ㅇㅇ(106.101) 04.16 10740 93
223759
썸네일
[싱갤] 싱글벙글 버스 인생 12년
[253]
따아아아악갤로그로 이동합니다. 04.16 20525 200
223757
썸네일
[판갤] 냉혹한 법인차...연두색 번호판 부착...근황의 세계.jpg
[493]
인터네코갤로그로 이동합니다. 04.16 24008 331
223756
썸네일
[카연] 결정된 인류의 죄악감에 대해
[79]
셋하나둘은둘셋하나갤로그로 이동합니다. 04.16 14848 108
223755
썸네일
[군갤] 연방정부 찐빠로 G7긴급회의내용 짱깨한테 다털렷겟농ㅋㅋㅋㅋㅋㅋ
[68]
제4제국국밥부장관갤로그로 이동합니다. 04.16 15823 118
223753
썸네일
[싱갤] 싱글벙글 대만 피자헛 신메뉴
[263]
니지카엘갤로그로 이동합니다. 04.16 32462 153
223752
썸네일
[주갤] [유쾌] 백인 여성의 한국 남자 꼬추 평가
[1015]
ㅇㅇ갤로그로 이동합니다. 04.16 45966 418
223751
썸네일
[싱갤] 싱글벙글 조선족이라고 말했던 탈북자아재
[361]
ㅇㅇ갤로그로 이동합니다. 04.16 21831 265
223746
썸네일
[미갤] 백종원과 직원들 워라밸 갈등.jpg
[287]
ㅇㅇ갤로그로 이동합니다. 04.16 31243 144
223745
썸네일
[싱갤] 사기사기 중고 판매 사기꾼이랑 놀았음
[150]
닉네임추천갤로그로 이동합니다. 04.16 35192 277
223744
썸네일
[A갤] 해피일본뉴스 110
[126]
더Informer갤로그로 이동합니다. 04.16 9553 82
223741
썸네일
[리갤] 티원 MSI 호재 떴다 ㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ
[390]
롤갤러(114.203) 04.16 44895 828
223740
썸네일
[싱갤] 좋게 말하면 못알아 듣는 형
[134]
ㅇㅇ(211.105) 04.16 25303 70
223738
썸네일
[야갤] 또 자살당했네 ㄷ ㄷ
[522]
야갤러(222.103) 04.16 50399 681
223737
썸네일
[부갤] 이대남은 이제 필요없다는 한국다큐,jpg
[822]
테클란갤로그로 이동합니다. 04.16 35860 425
223736
썸네일
[미갤] 조류학자가 말하는 참새.jpg
[245]
ㅇㅇ갤로그로 이동합니다. 04.16 24722 210
223734
썸네일
[싱갤] 싱글벙글 5월 20일부터 병원 방문시 신분증 지참 필수
[229]
니지카엘갤로그로 이동합니다. 04.16 17466 137
223733
썸네일
[디갤] 태안 세계 꽃 축제 사진
[25]
콜록갤로그로 이동합니다. 04.16 6877 15
223732
썸네일
[이갤] 호주 시드니서 또 흉기난동…교회서 주교 등 4명 다쳐
[83]
ㅇㅇ갤로그로 이동합니다. 04.16 9843 42
223730
썸네일
[싱갤] 싱글벙글 서울시 vs 성인 AV 페스티벌 현 상황
[796]
ㅇㅇ갤로그로 이동합니다. 04.16 51659 865
223728
썸네일
[중갤] [속보] 日외교청서 "독도는 일본 땅…징용 판결 수용 못해"
[685]
ㅇㅇ(223.62) 04.16 15741 151
223726
썸네일
[부갤] 이렇게 싼 데도 대부분 빈 채로 방치… 50억 아파트와 1억아파트 부산
[337]
테클란갤로그로 이동합니다. 04.16 28072 267
223725
썸네일
[야갤] 윤두창 역대급 발언떳따 ㅋㅋㅋㅋㅋ
[1066]
ㅇㅇ(112.163) 04.16 34471 468
223724
썸네일
[싱갤] 싱글벙글 손님저격 김밥집 최신근황
[428]
ㅇㅇ(115.41) 04.16 43853 325
223722
썸네일
[국갤] 이재명 선거법 1심 선고 일정 (꼼수 예상)
[136]
찢죄명(114.207) 04.16 13414 224
223721
썸네일
[키갤] 킹짱후 리드오프 7경기 연속 안타.webp
[65]
김혜성갤로그로 이동합니다. 04.16 9430 122
223720
썸네일
[싱갤] 싱글벙글 네이버 치지직 근황.JPG
[512]
ㅇㅇ(211.35) 04.16 59447 483
223718
썸네일
[조갤] 문재인 대통령에게 두번 고개 숙여 인사 한 조국.jpgif
[330]
조붕이(124.58) 04.16 20588 109
223717
썸네일
[싱갤] 싱글벙글 삼성, 미국으로 부터 64억 달러 보조금 확정 JPG
[306]
ㅇㅇ(1.234) 04.16 22440 154
223716
썸네일
[기음] 버거킹 와퍼 - 뉴와퍼 비교후기.jpg
[320]
dd(182.213) 04.16 36002 320
223713
썸네일
[코갤] 오늘자 전인구 경제 연구소 썸네일.jpg (feat 금투세)
[222]
금투세폐지(49.167) 04.16 15188 281
223710
썸네일
[이갤] “사형 1~2시간 전 통보라니…너무합니다” 소송 제기한 日사형수
[343]
ㅇㅇ갤로그로 이동합니다. 04.16 34988 159
223709
썸네일
[야갤] ㅓㅜㅑ 르세라핌..야첼라..공중파뉴스 입갤..쌈무..딥빡..jpg
[709]
티롱씨4갤로그로 이동합니다. 04.16 42113 478
223707
썸네일
[프갤] CM PUNK IS ALL ELITE 스토리 4편
[28]
ㅇㅇ(121.161) 04.16 6701 65
223705
썸네일
[닌갤] '닌텐도 온라인 스토어랑', 'e숍' 잘보고 구매해라...
[101]
ㅇㅇ(115.88) 04.16 22213 158
223703
썸네일
[싱갤] 싱글벙글 특이하게 생긴 동물들
[89]
따아아아악갤로그로 이동합니다. 04.16 20139 117
223701
썸네일
[카연] 마약과일 카페에 어서오세요!
[46]
란꼬갤로그로 이동합니다. 04.16 13589 84
223699
썸네일
[지갤] 퍼섭 전 안개신 레이드 시스템/스토리 맛보기
[129]
월초보갤로그로 이동합니다. 04.16 18222 91
223697
썸네일
[필갤] 흑백필름
[23]
PARADOX갤로그로 이동합니다. 04.16 5457 15
223693
썸네일
[싱갤] 싱글벙글 쿼카 사진이 앞모습만 주로 있는 이유.jpg
[130]
유미고양이갤로그로 이동합니다. 04.16 31154 196
223691
썸네일
[이갤] 식이요법으로 20kg 감량한 누나
[461]
당돌갤로그로 이동합니다. 04.16 38329 67
갤러리 내부 검색
제목+내용게시물 정렬 옵션

오른쪽 컨텐츠 영역

실시간 베스트

1/8

뉴스

디시미디어

디시이슈

1/2