기본 콘텐츠로 건너뛰기

pico-8 finger dance

pocketC.H.I.P을 너무 사고 싶은데 가격도 오르고 배송도 압박이어서 안사려는 마음으로 pico-8을 질렀(?)다.
감사합니다. HumbleBundle.
새로운 장난감을 얻었으니 손가락을 단련하자.

부팅 후 처음 접하는 화면은
콘솔 상태.
HELP를 보자
load <filename>
save <filename>
run
resume
shutdown
reboot
install_demos
dir
cd <dirname>
mkdir <dirname>
cd ..
keyconfig
splore
명령어들이 나오는데
나머지는 뭐 뻔한 거니 설명이 필요없고 splore는 포럼(http://www.lexaloffle.com/bbs/?cat=7 - 근데 forum/community/bbs 뭐가 맞는거? 용어 통일이 안되있네)에 올라온 게임들을 살펴볼 수 있는 명령인데 s만치고 엔터쳐도 된다. 오호 꿀!
여기에 있는 게임만 다 해보는 것도 일이겠다. 엄청 많다.

ESC로 커맨드라인과 개발환경을 전환할 수 있다.
개발환경모드는 이런 식으로 구성.
오른쪽 상단은 순서대로 코드에디터-스프라이트에디터-맵에디터-SFX에디터-뮤직에디터이고 ALT+좌우화살표키로 이동가능하다.

코드에디터

하단왼쪽은 LINE 현재커서위치라인/전체라인수. 오른쪽은 토큰숫자인데 명령어 하나당 하나씩 증가하고 8192. 즉 8k까지 쓸 수 있다.
핑거댄스니까 단축키 위주로 정리
CMD(CTRL)+C,X,V (copy, cut, paste)
CMD(CTRL)+Z,Y (undo, redo)
CMD(CTRL)+F,G (find, next)
CMD(CTRL)+UP, DOWN (top, end)
CMD(CTRL)+LEFT, RIGHT (word 간 이동)
ALT+UP,DOWN (function간 이동)
CMD(CTRL)+D (줄 복사)
TAB, SHIFT+TAB (indent, un-indent)

특이한 점은 전부 소문자가 기준이다. 대문자는 glyph 이라고 이모티콘 같은 거랑 대응. CMD(CTRL)+K로 전환할 수도 있다.

스프라이트에디터

드로우툴:
 왼클릭-찍기
 오른클릭-스포이드(색추출)
 CMD(CTRL)+왼클릭-색바꿔치기
셀렉트툴:
 단축 S or SHIFT + 드래그
 선택영역에 대해(선택영역이 없을때 전체) 회전, 반전
 - f : 가로 반전
 - v : 세로 반전
 - r : 회전 (시계방향)
 - 화살표: 이동 (루프 적용)
패닝툴: space
기타:
 1,2-앞/뒤 색상선택
 q,w-앞/뒤 스프라이트 선택
 tab-풀스크린전환
 마우스휠-zoom
 shift+drag-다중 스프라이트 선택 (맵에디터에서 사용)

맵에디터

 드래그 - 해당 스프라이트 배치
 space - zoom

SFX에디터

 TAB - pitch 모드/tracker 모드 전환
 , .  SPD up/down
- = PATCH prev/next
 pitch 모드
 - SHIFT +왼쪽 클릭 (톤 목록) - 현재 선택한 음색으로 전체 적용
 - SHIFT +왼쪽 클릭 (피치) - 현재 피치만 음색 적용
 - 1~9 볼륨
 tracker 모드
 - CMD(CTRL)-C,V 복사, 붙이기
 - C 1 4 5 1 - Pitch, Octave, Tone, Effect 순서
 - backspace or volume 0 - 삭제
 - q2w3er5t6y7ui zsxdcvgbhnjm (piano-like layout) 입력
 - Effects
0 none
1 slide          //  Slide to the next note
2 vibrato        //  Rapidly vary the pitch within one quarter-tone
3 drop           //  Rapidly drop the frequency to very low values
4 fade in        //  Ramp the volume up from 0
5 fade out       //  Ramp the volume down to 0
6 arpeggio fast  //  Iterate over groups of 4 notes at speed of 4
7 arpeggio slow  //  Iterate over groups of 4 notes at speed of 8

뮤직에디터

SFX를 배열
CMD(CTRL)-C,V : 드래그로 패턴 복사, 붙이기
화살표 기능
첫번째 : 반복 시작점. 없으면 0번째.
두번째 : 반복 끝점.
세번째 : 반복 없이 종료

프로그램 구조

크게 3개의 function
_update() / _update60() - 30/60fps 마다 호출
_draw() - 매 프레임마다 화면에 그린다.
_init() - 프로그램 시작 시 단 한번 시작

기타

CMD(CTRL)+S : save
ALT+ENTER : 전체화면 전환
CMD+Q/ALT+F4 : 종료
CMD(CTRL)+R : 실행
CMD(CTRL)+M : 뮤트
P : pause
F6 스샷 저장
F7 Capture cartridge label image
F8 비디오 저장 시작
F9 최대 8초 GIF 저장
기타 참조: https://neko250.github.io/pico8-api/
https://github.com/felipebueno/awesome-PICO-8
cheatsheet:

EXPORT

export XXXX.html : 현재 카트리지를 XXXX.html과 XXXX.js로 익스포트한다.
folder : export 되는 파일 저장소를 finder/explorer 에서 연다.

감상

부족한게 장점.
노이즈를 줄여서 최대한 프로그램을 만드는데 집중할 수 있게 한다.
lua로 시작해서 emscripten으로 끝나는 점도 재밌다.
löve lua 엔진하고 콜라보도 있고 발전 가능성....아니 이미 충분히 사랑받는 플랫폼이다.

이 블로그의 인기 게시물

meteor로 nw.js 개발하기.

실제로 nw.js 어플리케이션을 개발하다보면 UI구현하기 막막하고 수동으로 리프레쉬 하는 것도 귀찮아서 Meteor 연동을 하려고 했더니 생각보다 간단했다.

디렉토리 구조는 먼저 이렇게 잡았다.
`- app
  `-client
  `-public
`- dist
  `- 배포용 html,css,js
  `- package.json
`- package.json 아이디어는 이렇다. nw.js의 시작페이지를 http://localhost:3000으로 두고 배포시엔 meteor client 배포툴인 meteor-build-client를 사용하여 html,css,js 로 분리하는 계획이다.

가장 중요한 nw.js 용 package.json 파일은 아래와 같이 구성한다.
{
  "main": "http://localhost:3000",
  "node-remote": "http://localhost:3000",
  "name": "<앱이름>"
} 이게 전부. 어떻게 보면 Web과 nw.js를 동시에 개발할 수도 있는 환경이기도 한 것이다.
meteor create app 을 해서 meteor용 앱을 만들고 meteor 를 시작한다.
그리고, 위의 package.json이 있는 경로로 돌아가서 nw . 으로 nwjs를 실행한다.

한번 번쩍하더니 잘 된다.
cordova 등에서 index.html 대신 http://localhost:3000을 하는 것도 비슷한 느낌이다.

즐겁게 개발을 일단 마구 하고 실제로 배포하기 위해서는 개발환경이 아니라 html,css,js로 구성된 배포본을 만들어야한다.
npm install -g 해도 되지만 어짜피 Meteor에서만 쓸거
meteor npm install -g meteor-build-client 해버릴거다.

개발은 문제 없어 보이고 배포판을 한번 만들어보자. meteor app 이 있는 경로(meteor run으로 …

RxJS - ReactiveX 인터뷰

A: 왜 RxJS입니까
B: javascript는 참 쉽고 친숙한 언어죠.
A: 별로 그렇게 생각 안합니다만.
B: 그래서 좀 어렵고 있어보이는게 뭘까 싶어서...
A: 네?
B: 함수형이라는게 유행하기도 하고
f(x) 좋쟎습니까? 미스테리~ 미스테리~ 정수정짱짱 으아아

이런 수학선생님이라면 수포자 따윈 A: ...
B: 그리고 반응형이라는 말 뭔가
A: 뭔가?
B: 대충대충해도 막 알아서 할거 같고...
A: 그럴리가요?
B: 안그렇겠죠?
A: 네
B: 네

(잠시만 기다려주세요)

A: 그래도 뭔가 매력이 있으니 이렇게 시간을 내셔서 이것저것 Rx에 대해 글도 쓰고 이야기도 하고 그러시는거 아닌가요?
B: 매력이라.
으음.
제가 팔꿈치 터널 증후근이 좀 있어요.
오른손 세끼손가락, 약지손가락이 저립니다.
A: 무슨 상관이?
B: 그래서 각종 괄호를 쓰는게 너무 힘듭니다.
소중대괄호 만든 사람 죽었으면.
Hello world (ASCII): https://esolangs.org/wiki/Parenthesis_Hell
A: 이미 옛날에 돌아가셨겠죠.
B: 그렇겠네요.
아무튼 그래서 소중대괄호 의존이 적은 커피스크립트를 쓰는데요.
A: 빨리 본론을 말씀해주시죠.
B: 커피스크립트에서 가로로 80자 이상쓰면 Line exceeds maximum allowed length 라고 경고해요.
A: 그래서요?
B: 근데 Rx를 쓰면 코드를 가늘게 쓸 수가 있더라구요.
A: 호오?
B: 그리고 = 쓰는 것도 너무 힘듭니다.
A: 네?
B: 오른손을 쓰쟎아요.
A: ...
그러니까 정리하면
1. 괄호가 힘들다
2. 커피를 쓴다
3. 커피는 길게 쓰면 경고
4. Rx를 쓰면 코드가 가늘다
5. 대입문을 줄이고 싶다.
B: 네
하지만 5번은 생각보다 별로...
A:
B:

B: 아!
A: ?
B: 코드가 가늘어서 좋은 점이.
A: 네.
B: 핸드폰에서 코드를 보기 좋습니다.
A: ... 왜 팔꿈치 터널 증후근이 안 낫는지 알겠습니다.
B: 도와주세요.
쇠고기 사묵으면 나을 것 같습니…

Troubleshooting - Meteor package가 적용이 되지 않을 때

버전 1.5 기준 package.js에서 Package.onUse 에 새 패키지를 추가했는데 인식하지 못하는 경우가 있다.
Package.onUse((api) => {
  api.use([
    'vulcan:core',
    'vulcan:forms',
    'vulcan:accounts' /* <-- 추가함! */
  ]);
...
} 내부패키지건 원격패키지건 안되는 안된다. 이럴 때 meteor add 후 meteor remove 해도 되지만 더 간단한 방법이 있다. meteor update vulcan:accounts 이렇게 update 해주는 방법이 있다. .meteor/package 파일을 건들지 않아서 좋다. 그래도 역시 좋지 않다. Meteor 스럽지 않다. https://github.com/meteor/meteor/issues/7721 현재 1.5.2에서도 해결이 안되었군요. 해결되어 적용되면 다시 글 올리겠습니다.