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

나누면 안 되는 단위는 구조로 묶어 둔다

박 표시를 점으로 그리는데, 박자에 따라 한 박이 점 하나가 아니라 여러 개일 때가 있다. 9/8 박자면 큰 점 하나에 작은 점 둘이 붙은 묶음이 세 벌이다.

점이 많아지면 두 줄로 내려야 하는데, 점 아홉 개를 반으로 잘라 뿌리니 한 박의 큰 점과 작은 점이 서로 다른 줄로 갈라졌다. 보는 사람에게는 박이 몇 개인지가 안 읽힌다.

고친 방법은 배치 규칙을 손보는 게 아니라 구조를 바꾸는 것이었다. 한 박을 하나의 묶음으로 만들고, 줄에는 점이 아니라 묶음만 얹었다. 그러면 줄바꿈이 묶음 사이에서만 일어나서 한 박이 찢어질 수가 없다.

배치 규칙으로 막으려 했다면 박자표가 바뀔 때마다 예외가 생겼을 것이다. 나누면 안 되는 단위가 있으면 그 단위를 구조로 표현해 두는 게 낫다. 그러면 규칙이 아니라 형태가 그걸 지켜 준다.

여기에 지켜야 하는 약속이 하나 붙는다. 소리가 울리는 순서대로 점에 불이 들어와야 하니, 묶음으로 감싸더라도 점을 목록에 넣는 순서는 소리 순서와 같아야 한다. 보기 좋게 묶는 것과 순서를 지키는 것은 별개라, 구조를 바꿀 때 순서가 유지되는지 따로 확인해야 했다.


조건은 눈에 보이는 결과가 아니라 원인이 되는 값으로 세운다

처음에는 줄 수를 “점이 다섯 개 이상이면 두 줄”로 정했다. 그때 화면에서는 맞았다.

이 기준은 금방 어긋났다. 점 크기를 키우면 넷만 돼도 넘치고, 화면을 가로로 돌리면 여덟 개도 한 줄에 들어간다. 기기 폭이 다르면 또 달라진다. 개수는 결과이지 원인이 아니라서, 원인이 바뀔 때마다 예외를 붙이게 된다.

기준을 바꿨다. 점을 다 놓으려면 폭이 얼마나 필요한지 구하고, 지금 쓸 수 있는 폭과 나눠서 몇 줄이 필요한지 계산한다. 식 하나로 세로도 가로도 커버되고, 12/4처럼 극단적인 박자에서는 세 줄로 알아서 늘어난다. 기기별 분기가 없다.

조건문이 자꾸 늘어난다면 대개 판정 기준을 결과에 두고 있기 때문이다. 그 결과를 만드는 값이 무엇인지 찾아 거기에 기준을 두면 예외가 사라진다.


화면은 총량이 정해진 자원이다

템포 숫자를 크게 키웠더니 옆에 있던 버튼의 글자가 두 줄로 꺾였다. 한 줄에서 공간을 나눠 갖는 사이라, 한쪽이 커진 만큼 다른 쪽이 좁아진 것이다.

키우려던 쪽을 조금 양보하고, 버튼에는 글자를 꺾지 말라고 지정해 두 줄이 되는 것 자체를 막았다.

배운 건 태도에 가깝다. 무언가를 키우자는 요청은 항상 무언가를 줄이자는 요청과 한 쌍이다. 키우고 싶은 것만 보고 정하면 옆에서 티 안 나게 망가진다. 크기를 조정할 때는 그 줄에서 같이 공간을 쓰는 것들을 한 번에 놓고 봐야 한다.


같은 것을 두 곳에서 정할 수 있으면 모순이 생긴다

원래는 한 박을 몇 개로 쪼갤지 고르는 설정이 따로 있었다. 나중에 박자표를 고르는 기능을 넣었는데, 박자표가 그 정보를 이미 담고 있다. 6/8을 고르면 한 박이 셋으로 쪼개지는 것이고, 4/4를 고르면 안 쪼개지는 것이다.

두 컨트롤을 다 두면 사용자가 6/8을 골라 놓고 쪼개기를 둘로 맞출 수 있다. 서로 안 맞는 조합이고, 그런 조합이 가능해진 순간 우리는 그걸 어떻게 처리할지 정해야 한다. 무시할지, 경고할지, 한쪽을 자동으로 바꿀지. 어느 쪽을 골라도 사용자에겐 이상하다.

쪼개기 설정을 지웠다. 그러자 하단이 박자표와 재생 버튼 둘로 줄었고, 안 맞는 조합을 처리할 일도 같이 사라졌다.

기능을 더할 때는 기존 것과 표현이 겹치는지 본다. 겹치는 채로 둘 다 남기면 모순된 상태를 만들 길을 열어 두는 것이고, 그 길을 막는 코드가 계속 따라붙는다. 지우는 쪽이 화면도 코드도 줄어든다.


요약

  • 나누면 안 되는 단위는 배치 규칙으로 지키지 말고 구조로 묶는다. 형태가 규칙을 대신한다.
  • 다만 보기 좋게 묶는 것과 순서를 지키는 것은 별개다. 구조를 바꿀 때 순서가 유지되는지 따로 확인한다.
  • 조건문이 자꾸 늘면 판정 기준을 결과에 두고 있는 것이다. 그 결과를 만드는 값으로 기준을 옮기면 예외가 사라진다.
  • 무언가를 키우자는 요청은 무언가를 줄이자는 요청과 한 쌍이다. 같은 공간을 쓰는 것들을 한 번에 놓고 정한다.
  • 같은 정보를 두 곳에서 정할 수 있으면 사용자가 모순된 상태를 만들 수 있고, 그걸 막는 코드가 계속 따라붙는다. 표현이 겹치면 하나를 지운다.

Series: Today I Learn

1 C++ 자료형(Data Type) 2 MD5 vs pHash 3 C++에서 함수의 선언과 정의 4 Tkinter padx, pady 5 메모리와 포인터 변수 6 Call by Value, Call by Reference, Call by Pointer 비교 7 const 8 Gemfile — Jekyll 프로젝트의 의존성 파일 9 kramdown-parser-gfm — Jekyll의 GFM 파서 10 파서(Parser) 11 AHU vs OHU 12 I might try it vs I'll try it 뉘앙스 차이 13 SESSION_EXPIRE_AT_BROWSER_CLOSE=True 14 configuration key 15 Git stash vs discard 16 subprocess.Popen으로 Windows 탐색기에 명령어를 전달 17 Post 잔디 분석하기 18 Google Sheets Sync 최적화 19 DSL (Domain Specific Language)과 GPL (General Purpose Language) 20 마크다운 표 그리는 방법 21 쿼리 파라미터(Query Parameter). 기존 QR코드 재활용 22 Django 보안 취약점 점검 및 수정 23 OOP Object-Oriented Programming 객체 지향 프로그래밍 24 Fernet 대칭 암호화 25 Jekyll 코드블록 안의 Liquid 태그 26 insertOnConflictUpdate vs DoUpdate(target) 27 세션 필터 28 아코디언(Accordiaon) UI를 펼친상태로 만들기 29 input의 step 30 Word Cloud 31 Google Sheets를 데이터 버스로(with AppSheet) 32 Django 모델 텍스트 필드 자동 수집 패턴 33 localStorage로 섹션 토글 상태 유지 34 순차 ID 생성(`select_for_update()` + `max()` 조합) 35 역참조 검색과 distinct() 36 xlsx 다운로드와 로딩 오버레이 충돌 37 Android 파일 공유 MIME 타입 38 AssetManifest — Flutter 빌드 타임 asset 목록 런타임 조회 39 UTF-8 BOM과 PowerShell 파일 쓰기 40 소리꽃 KeyBloom TIL 1 41 소리꽃 KeyBloom TIL 2 42 소리꽃 KeyBloom TIL 3 43 메트로놈 Simple Metronome TIL 1 44 소리꽃 KeyBloom TIL 4 45 메트로놈 Simple Metronome TIL 2 46 소리꽃 KeyBloom TIL 5 47 메트로놈 Simple Metronome TIL 3 읽는 중 48 정적 블로그 SEO 정비와 Pagefind 검색 도입 49 메트로놈 Simple Metronome TIL 4 50 안드로이드 AudioTrack 연속 재생, 실측 피커 정렬, 카메라 토치 플래시 51 메트로놈 Simple Metronome TIL 5 52 모래게임 Sandrop TIL 1 53 메트로놈 Simple Metronome TIL 6 54 모래게임 Sandrop TIL 2 55 모래게임 Sandrop TIL 3 56 메트로놈 Simple Metronome TIL 7 57 모래게임 Sandrop TIL 4 58 모래게임 Sandrop TIL 5 59 모래게임 Sandrop TIL 6 60 소리꽃 KeyBloom TIL 6 61 모래게임 Sandrop TIL 7 62 모래게임 Sandrop TIL 8 63 소리꽃 KeyBloom TIL 7 64 모래게임 Sandrop TIL 9 65 소리꽃 KeyBloom TIL 8 66 모래게임 Sandrop TIL 10 67 소리꽃 KeyBloom TIL 9 68 소리꽃 KeyBloom TIL 10 69 소리꽃 KeyBloom TIL 11 70 소리꽃 KeyBloom TIL 12 71 소리꽃 KeyBloom TIL 13 72 온실 GreenHouse TIL 1 73 소리꽃 KeyBloom TIL 14 74 온실 GreenHouse TIL 2 75 소리꽃 KeyBloom TIL 15 76 소리꽃 KeyBloom TIL 16 77 소리꽃 KeyBloom TIL 17 78 소리꽃 KeyBloom TIL 18 79 소리꽃 KeyBloom TIL 19 80 소리꽃 KeyBloom TIL 20 81 로그스톤 상표 셀프 출원 TIL 1 82 소리꽃 KeyBloom TIL 21 83 소리꽃 KeyBloom TIL 22 84 소리꽃 KeyBloom TIL 23 85 소리꽃 KeyBloom TIL 24 86 MiniMacro TIL 1 87 Astro가 무엇인지, 왜 옮기는지 88 MiniMacro TIL 2 89 메트로놈 Simple Metronome TIL 8 90 메트로놈 Simple Metronome TIL 9 91 블로그 Astro 이관 TIL 92 오픈데이 Openday TIL 1 93 오픈데이 Openday TIL 2 94 Unreal Engine MCP TIL 1 95 콘티온 Conti On TIL 11 96 오픈데이 Openday TIL 3 97 오픈데이 Openday TIL 4 98 오픈데이 Openday TIL 5 99 ScorePlayer TIL 1 100 BuildingHub TIL 1 101 ScorePlayer TIL 2 102 BuildingHub TIL 2 103 ScorePlayer TIL 3 104 Unreal Engine MCP TIL 2 105 궁 미로 PalaceMaze TIL 1 106 메트로놈 Simple Metronome TIL 10 107 메트로놈 Simple Metronome TIL 11 108 오픈데이 Openday TIL 6 109 BuildingHub TIL 3 110 Obsidian vault에서 코드만 빼기 — directory junction 111 ScorePlayer TIL 4 112 오픈데이 Openday TIL 7 113 URL은 바뀔 수 있는 것에 묶지 않는다 114 도구는 기능이 아니라 내 일에 맞는지로 고른다 115 돌이키기 힘든 변경은 작게 먼저 확인한다 116 궁 미로 PalaceMaze TIL 3 117 궁 미로 PalaceMaze TIL 2 118 소리꽃 KeyBloom TIL 29 119 오픈데이 Openday TIL 8 120 BuildingHub TIL 4 121 ScorePlayer TIL 5 122 BuildingHub TIL 5 123 MiniMacro TIL 3 124 소리꽃 KeyBloom TIL 30 125 궁 미로 PalaceMaze TIL 4