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

겉의 말을 바꾸는 데 속까지 갈아엎을 필요는 없다

박자 설정이 “한 마디에 몇 박, 한 박을 몇 개로 쪼갬” 두 칸으로 되어 있었다. 직관적이지 않다는 피드백을 받았다. 악기를 다루는 사람에게 익숙한 표기는 4/4, 6/8 같은 박자표다.

소리를 만드는 부분은 이미 “박 수와 쪼갬 수” 두 값으로 돌아가고 있었다. 화면 표기를 바꾸려고 그 부분까지 다시 짤 필요는 없었다.

사용자가 고른 박자표를 그 두 값으로 옮기는 규칙만 사이에 뒀다. 겉은 익숙한 말로 바뀌었고 속은 그대로다.

여기서 배운 건 피드백을 받았을 때의 폭 조절이다. “이 용어가 어렵다”는 말은 대개 표기와 조작 방식에 대한 것이지 내부 구조에 대한 것이 아니다. 사용자가 쓰는 말과 내부가 쓰는 말이 다를 때, 둘을 억지로 같게 만드는 것보다 사이에 옮기는 규칙을 두는 게 싸고 덜 위험하다.


동작하는 것과 그 분야에서 맞는 것은 다르다

6/8 박자를 8분음표 여섯 번 치는 것으로 만들면 동작은 한다. 그런데 음악에서 6/8은 여덟 번째 음표 여섯 개를 셋씩 묶어 큰 박 둘로 느끼는 박자다. 여섯 번 똑같이 치면 그 박자로 안 들린다.

그래서 분모가 8이고 분자가 3의 배수면 큰 박을 분자÷3으로 잡고 각 박을 셋으로 쪼개도록 했다. 6/8은 2박, 9/8은 3박, 12/8은 4박이 된다. 강세는 각 박의 첫 번째에 얹히니 큰 박이 자연히 살아난다.

이건 코드를 보고 알 수 있는 게 아니다. 만드는 사람이 그 분야를 모르면 “돌아가니까 맞다”고 판단하게 되고, 쓰는 사람은 바로 알아챈다. 사용자가 특정 분야 사람인 제품을 만들 때는, 기능이 도는지와 그 분야에서 맞는지를 따로 확인해야 한다. 뒤쪽은 그 분야를 아는 사람만 판정할 수 있다.

3의 배수가 아닌 5/8이나 7/8은 묶는 방식이 곡마다 달라서(둘+셋인지 셋+둘인지) 일단 고르게 두고 나중으로 미뤘다. 도메인 규칙이 하나로 안 정해지는 자리는 미루는 것도 답이다.


못 쓰게 만드는 것과 못 쓴다고 알리는 것은 다른 일이다

박자표에서 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