제작 계기

방학동안 아두이노로 놀다가 만들만한거 없나 찾는 와중에 오락실에서 유비트를 발견했습니다.

유비트 기계는 이렇게 생겼는데, 웬만큼 큰 오락실이라면 몇대씩은 있어서 오락실 가본 분들이라면 알 듯..

실제 유비트 게임

이건 CORBY.QS라는 국내 플레이어의 실제 유비트 플레이 영상입니다.
게임 플레이 방법이 단순하게도 네모난 투명 버튼이 16개를 타이밍 맞춰 누르는게 다입니다.
이정도 심플함이면 누군가 한번쯤은 만들어보지 않았을까 하는 마음에 유튜브를 뒤지니..

한 일본인의 유비트 머신

2011년도에 한 일본인이 유비트 컨트롤러를 만들고 제작과정까지 유튜브 영상으로 올려둔걸 발견했습니다.
마이크로 스위치이랑 NAND 칩이랑 이것저것 납땜해서 만드는데
PC와 연결해서 Youbeat라는 윈도우 PC용 싸제 유비트 시뮬레이터를 구동시켜 플레이까지 합니다.
이걸 보고 저도 만들어보고 싶은 생각이 들었습니다.

윈도우에서 구동하는 유비트 시뮬레이터 Youbeat

근데 이 Youbeat는 실제 유비트 머신과는 거리감이 꽤 있습니다.
유비트 최초버전을 기반으로한 UI 구성에, 프로그램 지원은 끊겼고, 곡 추가도 핵 노가다로 보입니다. 원래는 컨트롤러만 만들어보려 했는데 그냥 게임도 새로 만들기로 했습니다.

제작 준비

개발 환경 준비

PC는 윈도우 컴퓨터 안쓰고 라즈베리파이3를 쓰기로 했습니다.
영상을 보시면 라즈베리파이3에서 PSP 에뮬을 돌리는데 에뮬레이터임에도 괜찮은 성능을 보여줍니다.
유비트를 가볍게 제작하면 라즈베리파이에서 충분히 돌아갈 것이라 생각하고 라즈베리파이3를 5만원 정도에 구입했습니다.
스피커도 필요하니, 만원 좀 넘는 싸구려 앰프를 사서 안 쓰던 스피커와 연결했습니다.

그리고 친구에게서 얻어온 20인치 모니터를 연결해서 셋팅했습니다.

다이소에서 5000원짜리 키보드와 마우스를 사고 작은 선반위에 모니터와 라즈베리파이를 셋팅하였습니다.
일단 소프트웨어적인 부분(게임)부터 제작하기로 했습니다. 일단 제목은 Raspberry Pi + Jubeat 해서 Rasbeat로 했습니다.

Rasbeat 로고

소프트웨어 개발 방법

저는 리눅스 개발을 해본적이 없었습니다. 처음엔 최적의 성능을 위해 OpenGL과 리눅스 개발 관련 서적을 사서 공부하며 개발할까 생각했지만, 생산성을 생각해서 AppGameKit이라는 게임 개발 툴킷을 찾았습니다. Basic 언어와 유사한 개조한 자체 언어를 사용하여 문법이 쉽고, 데모 소스코드를 몇번 보고, 데모 프로젝트를 돌려보기도 하니 성능도 꽤 괜찮게 뽑히는것 같아 이걸로 개발에 들어갔습니다.

곡의 노트 보표(채보라고 합니다)는 텍스트파일로부터 읽게 하였고, 그 구조는 웹 기반 유비트 시뮬레이터인 0xf.kr/jubit사이트의 방식에서 많이 따왔습니다.

채보 파일은 일본 웹사이트인 cosmos memo에서 다 얻어왔습니다. 실제 유비트 머신의 하드디스크에서 추출한 것이라 하는데, 매우 정확합니다.
실제 유비트에 있는 거의 모든 곡이 다 있습니다.

게임 소프트웨어 개발

첫번째 데모

그러고 첫번째 데모를 완성했습니다. 아직은 채보 파일 파싱해서 음악와 이미지만 띄워주는 수준입니다.

두번째 데모

그리고 두번째 데모에선, 유비트 Qubell과 Knit 버전의 UI 스타일과 유사하게 UI를 만들어 입혔고, Shutter 마커는 그대로 갖다 썼습니다.
여기에 실제 유비트와 동일한 점수 체계과, 콤보 기능을 넣었습니다. 노트 타이밍도 안정적이고 그럭저럭 괜찮습니다.
손바닥만한 5만원짜리 라즈베리파이로 돌아가는걸 보면 신기..

세번째 데모

개발을 더 진행해서 더 자세한 곡 정보를 표시하게 하였고, 실제 유비트에 존재하는 Music Bar를 구현했습니다. 상단화면 아래쪽에 나오는 일종의 곡 진행 바인데, 해당 구간에 노트가 어느정도 몰려있는지 표시가 됩니다. 그리고 플레이어가 해당 구간에서 얼마나 정확하게 버튼을 눌렀냐에 따라 색이 다릅니다. 이런 정보는 레코드 파일로 저장이 됩니다.

플레이 가능한 데모

이제 곡 리스트 화면과 설정 화면이 추가되었고, 실제 유비트와 유사한 UX를 구현하였습니다. 유비트의 홀드노트 기능도 추가했습니다. 리스트 화면에서는 난이도와 곡 선택을 실제 유비트와 동일하게 할 수 있고, 각 곡에 대한 저장된 최고기록과 플레이 일시를 확인할 수 있습니다. 설정화면에서는 마커 선택, 영상엔 안 나오지만 곡의 순서 정렬도 가능하고 자동플레이 여부 등을 설정할 수 있습니다. 화면의 격자(레이아웃) 크기 조정, 판정 타이밍 등의 고급 설정은 따로 설정화면을 만들어, 일반적인 플레이 상황에서의 설정과 분리하였습니다.
요약: 게임은 거의 다 완성.

키보드로 플레이해보면서 가능성을 확인하였고, 사진으로 남기진 않았지만 라즈베리파이 보드 위에 있는 GPIO핀으로 버튼 테스트도 해보았습니다. 제작이 가능하다고 판단한 이때부터는 하드웨어 설계도 시작했습니다.

하드웨어 제작

디스플레이 및 본체 케이스 준비

먼저 모니터를 부숴서 (분해가 아니라 부숨) 내부 부품을 디스플레이 패널 뒤에 다 붙였습니다.
좀 위험해보이긴 하는데 조심하면 괜찮을 거라 생각하고 모니터의 치수를 재어 케이스를 스케치업으로 그려 가구공방에 주문의뢰 했습니다.

이렇게 그려서 제작 의뢰했더니 견적 비용이 6만원대 정도 나왔습니다.

전원 및 내부 회로

케이스 완성품이 도착할때까지 나름의 설계를 하며 안에 집어넣을 DIY 멀티탭과 SSR 릴레이 모듈을 구입했습니다.

모니터와 라즈베리파이와 앰프가 발열이 참 심합니다.. 좁은 케이스에 갖혀있으면 과열될 위험이 있으므로 쿨링팬이 필요했습니다.
라즈베리파이가 가동되는 동안에만 쿨링팬과 앰프를 켜기 위해 릴레이 모듈을 단 DIY 멀티탭을 만들었습니다. 여기서 릴레이가 적용되는 것은 1구 뿐인데…

이런 분배회로를 따로 만들었기 때문입니다. 12V 팬 세개와 12V 앰프를 꽂을 수 있게 되어있습니다. 일종의 12V 멀티탭입니다.

다만 12V 팬은 수백볼트의 역기전력을 만들어, 다른 회로에 큰 손상을 입힐 수가 있기때문에 환류 다이오드 FR107을 달았습니다. 사실 이거 만들기 전엔 저도 잘 몰랐는데, 이거 몰라서 회로 고장내는 분들이 굉장히 많다고 합니다. 여름에 크게 유행했던 스마트폰 선풍기가 스마트폰을 고장내는 사례가 엄청 많았는데 그게 바로 몇백원 안하는 이 다이오드가 없어서입니다.

주문제작 케이스 확인 및 부품 배치

나무 케이스가 도착했습니다.레드파인 집성목이라고 합니다. 구상한대로 지금 있는 부품들을 올려둬봤습니다. 그리고 컨트롤러를 제작한 일본인은 마이크로 스위치로 스위치를 만들었지만, 마이크로스위치 적당한걸 찾아보니 너무 비쌉니다. 마이크로스위치는 클릭 소음도 심합니다. 저렴하고 조용한 오테뮤 기계식 키보드 스위치로 만들기로 했습니다.

그리고 16버튼 입력을 받기 위해 작은 PCB 기판과 케이블을 납땜했습니다. 케이블은 8가닥 전선과 MOLEX 커넥터와 점퍼 커넥터로만들었습니다. 선 꼬느라 조금 힘들었습니다. 8개의 핀으로 16개의 버튼입력을 받는데, 구글링해서 알아낸 방법입니다. 16개의 버튼을 4개의 행과 4개의 열로 나눠서 각 열을 돌며 전기신호가 이어지는 행을 찾아 16개의 버튼을 구분해서 입력받을 수 있습니다. 테스트해보니 라즈베리파이에서 잘 인식하였습니다. 하지만 이때는 몰랐지만 여기엔 큰 문제가 있어 나중에 크게 뒤집히게 됩니다. 그 전에..

원래 쓰던 모니터가 쇼트나서 두꺼비집이 내려가 정전이 됐습니다.. 모니터는 물론 사망했습니다. 그래서 중고나라에서 같은 패널을 쓰는 LG모니터로 업어왔습니다.. 이거 사느라 또 5만원이 날아갑니다. 얘는 대기업 것이라 그런지 내부적으로도 철제 쉴딩처리가 되어있어 이제 쇼트날일은 없을 듯 합니다.. 이번엔 혹시 모르니 필라멘트 테이프로 여러번 고정했습니다.

그리고 케이스의 구성을 다시 바꿔보았습니다. 각종 부품이 들어갈 자리를 각을 잘잽니다..

애초에 케이스 주문할때부터 철저하게 설계해서 구멍 뚫린 것을 주문했어야 했다는것을 뒤늦게 깨달으며 홀쏘와 조각칼을 구입하여 힘겹게 구멍을 냈습니다.

케이스 도장

사포로 거친부분을 모두 다듬고 광명 이케아에서 구입한 페인트와 붓으로 5시간 간격으로 4회 덧칠했습니다.(하루 종일) 그리고 건조시키고 1400방 사포로 다듬어 표면을 매끈하게 만든 뒤, 발판과 보호망을 달기 위한 구멍을 냈습니다. 검게 도색을 하니 집성목인게 티가 잘 안나서 좋습니다.

케이스 내부 조립

발판은 전에 구입한 컴퓨터 케이스에 포함되었던것인데 아주 적당합니다. 망은 PC용 팬필터인데, 적당해보여서 스피커와 쿨링팬 구멍을 덮기 위해 4개 구입했습니다.

앰프는 분해시키고 케이스 안쪽 벽에 고정시킬 수 있도록 집에 있던 과학상자 부속을 달았습니다. 스피커도 고정할 수 있도록 앵글을 달았습니다.

앰프를 고정하였고, 라즈베리파이와 쿨링팬을 달 수 있게 과학상자 부속을 달았습니다. 라즈베리파이를 비스듬하게 고정하여 60mm 쿨링팬으로 식힐 생각입니다. 스피커는 어떻게 고정할지 고민하다가 이역시 과학상자 부속으로 해결했습니다.

유지보수용으로 라즈베리파이의 USB 2.0단자와 RJ45 단자를 연장해서 윗쪽에 고정했습니다. 그리고 쿨링팬과 DC 어댑터들과 멀티탭, 12V 분배회로를 고정했습니다.

마지막으로 멀티탭 전선을 뒤로 빼서 파워 소켓을 납땜하여 달았습니다. 부품을 다 달아도 내부 공간이 여유가 좀 있을 줄 알았는데 생각보다 많이 협소해졌습니다. 그리고 전동드릴을 처음 사용해봤는데 이거 하면서 요령도 생기고 많이 능숙해졌습니다. 내부는 금방 끝났고 이제 중요한 조작부를 제작하기 시작합니다.

전면패널 아크릴판 CNC 가공 발주

아크릴 CNC가공은 CAD로 그려서 업체에 의뢰했습니다. 총 비용이 약 22만원입니다.. 입체적으로 가공된 버튼에서 가격을 많이 받네요. 집에 CNC 기계 하나 있으면 좋겠

기계식 스위치 개조

기계식 스위치는 적축으로 하려다가 키감이 너무 가벼워서 오테뮤 갈축으로 결정했습니다. 이걸 그냥 사용하면 크기가 너무 크기 때문에 다 분해해서 니퍼로 몇번씩 잘라줘야 했습니다. 거기다가 가는 랩핑와이어를 두개씩 납땜하였고, 누를때 소음을 줄이기 위해 레이저조각기로 절단선을 인쇄한 고무테이프를 일일이 잘라 붙여줬습니다. 버튼이 총 64개인데 이부분이 제일 힘들었던것같습니다..

기계식 스위치 및 전면패널 조립

아크릴 판에 PCB 서포트와, 버튼연결용기판, 플라스틱 오도시(가구 걸쇠?)를 달았습니다.
LCD 패널과 아크릴 판 사이에 먼지가 유입하는걸 방지하기 위해 아크릴의 구멍을 뒤쪽에서 모두 막고 모니터에는 내열 스펀지 테이프를 붙였습니다. 플라스틱 오도시는 나중에 조립할때 고정하기 위해 달았습니다.

그리고 또다시 노가다입니다. 64개의 버튼을 아크릴판에 붙이며 배선작업을 합니다. 버튼당 두개의 선이 있으니 총 128가닥인데, 정말 극한의 노가다입니다. 중간에 시험 조작도 해봅니다.. 근데 막상 조작을 해보니 8핀을 쓰는 방식으론 3개 이상의 동시입력이 제대로 안 됩니다.. 결국 18핀 쓰는 방식으로 다시 갈아 엎기로 했습니다.

정석대로 16개 버튼을 입력받도록 저항과 MOLEX 커넥터로 케이블과 기판을 다시 만들고 16개의 버튼을 다시 연결했습니다. 이제 아크릴판에 연결된 기판은 필요도 없는데 달려있게 됐습니다.

우여곡절끝에 조작 패널을 완성하였고 이제 케이스에 고정하기 위해 하부에 고정 브라켓을 과학상자 부속으로 만들어 붙였습니다. 조작 패널의 아랫 부분을 저곳에 걸치고 윗 부분은 아까 붙인 플라스틱 오도시를 이용해 고정합니다.

전면패널 도색

그리고 다시 분해해서 아크릴 판들을 마스킹 처리하고 뒷쪽면에만 무광 블랙으로 도색합니다. 이렇게하면 앞면을 봤을때 빛깔좋은 블랙 하이그로시가 됩니다. 착색 아크릴을 쓰는것보다 퀄리티 면에서 훨씬 좋습니다.

마무리 조립

버튼을 테스트해보니 버튼을 뗄때에도 소음이 꽤 나서 조금이라도 줄여보고자 절연테이프를 잘라서 붙여준후 모두 조립하고 시험작동을 완료했습니다.

완성

다 조립하고 나니 아주 볼만합니다. 먼지와 지문이 잘 묻긴 하지만 블랙 우드와 블랙 하이그로시 조합이 나름 고급스럽습니다.
저울로 재진 않았지만 무게는 대략 15kg정도는 되는듯..

구동 시험

구동시킨 사진입니다. 게임은 다 완성되었고, 곡은 제 취향 위주로 50곡 이상 넣어놨습니다.

최종 버전의 Concierge(종버튼) 화면입니다. 마커 선택을 할 수 있고, 커스텀해서 추가할 수도 있습니다. 기본은 셔터입니다. 그리고 곡의 정렬 설정이 가능하고 간단한 4가지의 토글식 옵션 버튼이 있습니다. 여기서 설정 버튼을 누르면 고급 설정으로 넘어갑니다.

고급 설정을 하는 화면이라 UI는 텍스트 기반으로 구성했습니다.

테마 변경이 가능하고 언어 선택, 볼륨 조절, 싱크 조절, UI 레이아웃 조절, 곡 목록 업데이트, 기록 삭제, 판정 범위 조절 등이 가능합니다. 테마는 커스텀할 수 있고, 텍스트파일을 편집해서 레이아웃을 바꿀 수도 있습니다. (앨범 커버 위치, 폰트 크기 등)

그리고 버튼에는 버전 과 IP 정보가 나오는데, FTP 서버가 기본으로 열려있어서 랜선을 꽂아 FTP 연결을 통한 테마, 마커, 곡을 추가할 수 있습니다.

자동 플레이 구동 영상

Sky High 자동 플레이 하는 영상입니다.
유비트 Knit가 자꾸 떠오르는 BGM은 무료 음원으로 교체..

직접 플레이 구동 영상 1

citrus 플레이하는 영상입니다.
별로 못하는 영상이라 답답할 수 있음..
막상 영상 찍고 나니 버튼에서 기계식 키보드 소리가 나는것처럼 보이는데,
아이폰으로 찍으니까 배경음악은 작아지고 키 소음이 증폭되어서 들리는것 같습니다..

직접 플레이 구동 영상 2

마지막 Russian Snowy Dance 플레이 영상입니다.

끝..

유비트 잘하는 사람이 해봐야 되는데 아쉽네요.