Game QA 진행요령

Game QA ?

QA : 품질 보증을 뜻하는 Quality Assurance의 약어

게임 QA : 게임(클라이언트)의 품질보증을 뜻하는 언어

통상 만들어진 게임의 기능이 잘 돌아가는지, 예외처리에 대한 버그발생은 없는지 등에 관한 레포팅을 작성하는 작업

 

게임에서는 탐구적QA와 기술적 QA로 나뉨

 

탐구적 QA?

  1.  예상되는 유저의 행동을 미리 실행해 보는 QA
  2.  예상해보지 못하도록 돌발행동을 실행해 보는 QA

★  이런 저런 행동을 하거나 클라이언트를 탐험하며 만들어진 클라이언트를 고찰하는 QA

 

기술적 QA TC(test case) List

  1. 만들어진 클라이언트가 계획대로 개발되었는지 확인하는 QA

★ 정상적인 실행에 맞춰 해당 기능이 정상적으로 개발되었는지 확인하는 QA

해당 클라이언트의 TC(test case)를 만들어 작성하는 편이 빠짐없이 체크해 볼 수 있는 좋은 예

 

 

※ QA는 품질보증인 만큼 사용자의 환경도 고려하며 진행하면 더욱 버그나 예외처리에 관한 부분을 확실히 집어낼 수 있습니다.

웹용으로 개발한다면 웹을 구동시킬 수 있는 브라우저의 종류를 고려한다거나 모바일용으로 개발한다면 스마트폰제조사or 스마트폰 종류 or 패드지원 등을 고려한다거나 하는 사용환경을 고려한다면 보다 확실한 QA가 될것입니다.

famobi.com에 올릴 게임 제작할 때 필요한 사항

famobi.com에 올릴 HTML5 게임을 제작할 때 확인 해야할것들 정리.

1. 로딩
– 퍼센테이지와 함께 애니메이션으로 로딩을 구현해야함.
– splash 스크린을 넣지 말아야함.
– 외부경로의 스트립트나 폰트를 넣지 말아야함.
– 게임의 로딩 용량이 5MB 넘어가면 필요한 것만 우선 로딩하고 필요한거 있을때 로딩해야함.

2. 에셋
– 스프라이트를 사용한 메인 그래픽.

3. 배경
– 게임디자인과 매치되는 배경색을 사용해야함.

4. 텍스트, 로컬라이징
(권장)게임은 어떤 텍스트도 사용하지 않고, 아이콘만 사용. ( 타이틀이나 로고, 장르는 나타내는 텍스트는 써도 됨. )
– 만약에 게임에 텍스트가 들어간다면, 모든 문자는 반드시 via 폰트나 스프라이트/비트맵 폰트들을 사용해야함.
– 지원하는 언어들. ( DE, EN, TR, PL, RU, NL, ES, PT, FR )
– 이미지 텍스트 ( 좋지 않은 방법임. )는 개발자에 의해 로컬라이징 되어야함.
– 언어 변경 버튼을 사용하지 말아햐함. ( famobi 자체 API로 변경함 )

5. UI
– 왼쪽 위 코너에 버튼이나 구성요소를 배치하지 말아야함 ( famobi UI가 배치됨)
– 가로모드 UI는 iOS에서 브라우저바를 방해하지 말아야함.
– 플레이 버튼은 반드시 스타트씬에서 가장 커야함.
– 만약에 게임에 사운드가 있다면, 스타트씬에서 음소거버튼을 만들어야함.
– famobi 독점 게임들은 credits 정보를 넣지 말아야함.
– 인게임에서 메인메뉴 버튼을 사용할수 있어야함.
– 컨티뉴버튼들은 항상 오른쪽 사이드에 위치 해야함.

6. 오리엔테이션
(권장)게임은 가로 & 세로에서 플레이 할수있어야함.
(권장)오리엔테이션에 맞게 반응형 UI를 사용.
– 게임은 블랙바없이 스크린을 채워줘야 함.
– 디바이스 회전 이미지를사용하지 말아야함.
– 전체화면 버튼을 사용하지 말아야함.

7. 파일 용량
(권장)게임은 2MB 보다 작아야함. ( 10MB보다 크면 매우 안좋음 )
– 에셋들은 반드시 최적화 되어야함. ( 압축. 2의 배수, 중복제거, 큰배경그래픽은 타일형식으로 )
– 사운들은 반드시 최적화 되어야함. ( 품질보다 크기를 줄여라 )

8. iFrame
– Famobi iframe 에서 게임이 작동해야함.
– 테스트 링크 : http : // play.famobi.com/embed-game/?url=https://example.org/game.html
– example.org/game.html 대신 게임 URL 배치

9. 사운드
(권장) BGM과 효과음 버튼을 구분해야함.
– 음소거 버튼은 모든 디바이스에서 작동 해야함.
– 게임은 포커즈를 잃었을때 음소거 되어야함.
– 게임은 다시 포커즈를 찾았을때 음소거가 해제되어야함.
– 게임은 BGM이나 효과음 없이 실행할수 있어야함.

10. 튜토리얼
(권장)텍스트가 없이 애니메이션으로 표현해야함.

11. 기타
– 게임 파일은 난독화나 최소화 하지 말고 전달해야함.
– 하드코딩된 나가는 외부링크가 없어야함.
– 디버그 아웃풋이 없어야함
– game contains natural breaks
– 포커즈를 잃으면 게임은 정지되어야함
– index file adjustments
– 이중입력 문제가 없어야함. ( 마우스입력과 터치입력을 동시에 사용하는 경우 두개다 입력이 될수 있음 )
– 탭-고정 문제가 없어야함.
– 홍보용으로 티저이미지(500*500px) 와 해더이미지(2400*1350px) .png를 만들어야함.

원문 사이트 : https://sites.google.com/a/famobi.com/api-docs/home

테스트용 HTML5 게임 사이트 오픈

저번에 소개했던 Famobi.com 에서 테스트 삼아 publishing site 오픈.

Site 요약 – Kizplay

http://kizplay.portals.famobi.com/

  1. Famobi.com 이 보유하고 있는 게임들을 퍼블리싱 할 수 있는 사이트 오픈
  2. famobi 에서 제공하는 portal site 서비스를 이용 (비용 없음)
  3. famobi 에서 제공하는 CMS 및 셋팅 이용 – 사이트통계, 수익, 사이트디자인(제한적), SEO 적용 가능
  4. 게임을 하나하나 선택해서 노출시킬 수 있고, 표시 순서도 커스터마이징 가능 (엄청난 노가다-_-)2017-07-03 17;20;28
  • Follow up
    • 카테고리 명칭, 분류 등에 대해서 게임사업부 지인과 함께 논의하여 수정할 예정
    • SEO (검색엔진최적화) 에 대해 공부하고 적용할 예정
    • 사이트 기본 디자인 작업 진행 필요
    • 도메인 연결 (선택)
  • 그 외

— 제공되는 게임의 수가 464개로 각 게임에 대한 분류와 특성 파악이 필요해 보임 (모든 게임을 넣을 필요가 있을까)

— 퍼즐에 특화된 사이트로 구성해도 괜찮을 듯

h1 프로젝트 – HTML5 게임개발 후기

웹뷰만 띄울 수 있으면 어느 환경에서나 플레이 가능한 강점을 가진 html5 게임을 개발하게 되었다. html5 게임은 이미 많이 대중화된 상태라 제작 관련 툴이나 엔진을 찾는데는 어렵지 않았다.

   – 참고 사이트 : https://html5gameengine.com/ – html5 게임 엔진 인기 순위.

 위 사이트에서 4위에 랭크 되어있는 Phaser라는 게임개발 프레임워크를 사용하기로 했다. Phaser는 자체만으로 엔진이라고 할 수는 없지만 렌더링, 사운드, 물리 등  게임에 필요한 거의 모든 기능들을 편리하게 제공 해주는 2D 게임 프레임워크이다.  Phaser가 제공하는 많은 예제와 커뮤니티 자료도 원할한 개발을 하는데 많은 도움을 주었다.

   – 참고 사이트 : https://phaser.io/  – Phaser 공식 홈페이지

 

기획된 게임은  두명의 플레이어가 게임오버 될 때 까지 포탄을 쏴 적유닛을 물리치는 간단한 방식의 멀티플레이 슈팅 게임이었다.

1.PNG

 

멀티플레이 인것만 제외하면 간단한 게임이어서 기본게임틀 제작까지는 시간이 오래 걸리지 않았다.  그에 맞는 빠른 멀티플레이 테스트를 위해 Node.js 와 websocket 을 이용한 임시 에코서버를 제작해 테스트를 진행 하였다. 서버와 클라이언트 모두 자바스크립트로 작성 할 수 있어서 개발속도는 더 빨랐다.

   – 참고 사이트 : http://www.html5gamedevs.com/topic/6256-simple-phaser-websocket-guide/    –  phaser 와 websocket 을 이용한 서버관련 커뮤니티글

 

게임 특성상 여러 스테이지가 필요했는데, 적은 양의 리소스로 많은 양의 스테이지를 제작하기 위해 간단한 맵툴제작과 지형을 조립가능하게 화 프리팹화 시켰다.

2.png

 

지형 프리팹화 과정에서 다양한 모양의 지형에 대처하기 위해 포탄과 지형의 충돌체크는 픽셀충돌 방식을 사용하였다. 픽셀충돌은 Phaser에서 지원해주는 충돌체크 방식이 아니다보니 테스트 해보던중 한가지 중대한 버그가 발생하였다. 싱글 플레이시에는 문제 없으나 모바일기기로 멀티플레이 테스트시 가끔 포탄발사 시뮬레이션 결과가 서로 다르게 나오는 것이었다.  원인을 파악해보니 모바일 디바이스별로 구형은 지형을 화면에 그린 픽셀들의 결과가 신형 디바이스와 미세하지만 약간 차이가 있다는 것은 발견했다. 이를 해결하기 위해 프리팹화 된 지형 별로 검은색과 흰색으로 이루어진 픽셀충돌 전용 리소스를  만들어 사용하였다.

3.PNG

 

웹뷰 환경에서 게임을 실행하는 탓에 게임은 돌아가나 성능에 관한 문제도  많았다. 같은 디바이스에서도 사용한 브라우저 별로 성능과 지원가능한 html5 기능은  많은 차이가 있었다.

–  참고 사이트 : http://html5test.com/results/mobile.html  –  브라이저 별로 사용가능한 html5 기능을 알려주는 사이트

초기 개발에서는 1920 * 1080 의 고해상도 이미지 리소스를 사용했는데 구형 디바이스에서는 말할것도없고, 신형 디바이스에서도 플레이 시간이 길어지면 발열과 잔렉이 심해졌다. 게임 로직의 부하 문제이기 보다는 렌더링 성능의 문제로 보고 게임 해상도를  960 * 540 으로 바꾸면서 모든 리소스들을  절반 크기로 줄였다. 큰 모니터 화면으로 보면  약간의 디테일 차이가 있었지만 작은 모바일 화면으로 보면 고해상도 이미지를 쓸때와 큰 차이가 없었다. 그 결과 성능은 많이 개선 되었다. 구형 디바이스에서 장시간 플레이했을시 발열의 문제는 남아있었지만 잔렉과 발열도 많이  줄어 들었다.

 

브라우저가 캐시를 남기는것도 문제가 많았다. 새로 게임을 업데이트 했어도 캐시가 남아있는 문제 때문에 업데이트 된 게임이 제대로 불러와지지 않았다. 개발  단계에서는  크롬 시크릿탭을 사용하거나 저장된 캐시를 삭제해서 게임을 업데이트 했지만 임시방편이었다.  cache.manifest파일을 작성해서 캐시될 파일과 네크워크에서 매번 가져올 파일을 설정할수 있었다.