소리꽃 KeyBloom TIL 7

이 글은 Today I Learn 시리즈의 63번째 기록입니다. (총 125개)

무료로 내놓을 상태를 만들며 나온 것들. 파일을 다시 열어 주는 기억, 유료 경계, 그리고 규칙의 일관성.

기억하는 기능

작업 파일이 어떤 음원을 쓰는지 기억해 뒀다가 다시 열 때 자동으로 불러오게 했다. 브라우저는 보안 때문에 파일 경로를 기억할 수 없다. 대신 File System Access API가 주는 핸들 — 그 파일을 다시 열 수 있는 열쇠 같은 참조 — 을 저장해 둔다.

문제는 그 핸들이 항상 통하지는 않는다는 것이다. 사용자가 파일을 옮겼거나 지웠을 수 있고, 브라우저가 접근 권한을 다시 물어보는데 거절할 수도 있다.

그래서 실패했을 때 “다른 파일로 대신할까요, 아니면 없이 진행할까요”로 빠져나갈 길을 뒀다. 자동 복원이 실패했다고 작업 자체를 못 열면 안 된다.

무언가를 기억했다가 자동으로 되살리는 기능은 성공할 때보다 실패할 때 설계가 중요하다. 되살리기가 편의 기능인데 그것 때문에 본 작업이 막히면 없느니만 못하다.

같은 방식으로 작업 파일 자체의 위치도 기억할 수 있었는데 일부러 안 했다.

새로고침한 뒤 저장을 누르면 위치를 다시 묻는 게 조금 귀찮다. 그런데 기억해 뒀다가 사용자가 예상 못 한 파일에 덮어쓰는 건 되돌릴 수 없다. 귀찮음과 데이터 손실 사이라면 귀찮음을 고른다.

편의 기능을 넣을지 정할 때, 그게 틀렸을 때 무슨 일이 일어나는지를 같이 봐야 한다. 틀려도 한 번 더 클릭하면 되는 것과 파일이 날아가는 것은 다른 무게다.

유료 항목에 왕관 표시를 붙이려는데, 드롭다운 목록 안에는 이미지를 넣을 수 없다는 제약이 있었다. 그래서 해상도 선택을 드롭다운에서 버튼 묶음으로 바꿨다.

바꾸고 보니 배보다 배꼽이었다. 표시 하나 때문에 멀쩡한 UI 구조를 갈아엎은 것이다. 드롭다운으로 되돌리고 이모지를 글자로 넣으니 그걸로 충분했다.

제약을 만나면 그걸 우회할 방법부터 찾게 되는데, 우회 비용이 얻는 것보다 큰지 먼저 재야 한다. 대부분의 표시 제약은 “덜 예쁜 방법”으로 넘어갈 수 있고, 그게 구조를 바꾸는 것보다 싸다.

앞선 TIL 3에서 파티클은 태어난 순간의 설정을 끝까지 유지하게 했다. 큐(곡 중간에 갈아타는 연출 설정 묶음)가 바뀌어도 이미 떠 있는 파티클은 원래 색으로 사라진다.

그런데 건반은 매 순간 현재 설정으로 색을 계산하고 있었다. 그래서 큐가 바뀌는 순간 이미 눌려 있던 건반까지 색이 확 바뀌었다.

각각만 보면 둘 다 말이 되는데, 화면에 함께 보이니 어긋남이 그대로 드러난다. 건반도 눌린 시점의 설정을 들고 있게 바꿨다.

같은 화면에 함께 보이는 것들에 서로 다른 규칙을 두면 반드시 티가 난다. 기능을 추가할 때 “이것과 같이 보이는 게 뭐고, 그건 어떤 규칙을 따르나”를 먼저 보는 게 맞다.

규칙을 옮길 때 한 속성만 옮기는 것도 함정이었다. 색은 눌린 시점 값으로 바꾸고 광택은 현재 값으로 두니, 색은 그대로인데 광택만 변하는 어색한 상태가 됐다. 규칙을 옮기면 그 규칙이 지배하는 것 전부를 같이 옮겨야 한다.