한 캐릭터용 도구에서 누구나 쓰는 프로그램으로 — 토키 개발기 #04

지난 글에서는 표정과 입 모양을 나누는 구조를 정리했다. 이번에는 그 그림들을 사용자가 어떻게 등록하고 확인하며, 방송 중에 조작할지를 다룬다.

만드는 사람은 파일이 어디에 있고 어떤 버튼을 눌러야 하는지 알고 있다. 하지만 프로그램을 처음 켠 사람에게 그 순서까지 익숙한 것은 아니다. 기능이 작동하는 것에서 한 걸음 더 나아가, 화면만 보고도 사용법을 알아갈 수 있도록 다듬을 필요가 있었다.

그림을 바꿀 수 있다는 것과, 쉽게 바꿀 수 있다는 것은 달랐다.

파일보다 먼저 바꿀 대상을 보여주기

3편에서는 표정마다 무음·말하기·크게 말하기 이미지를 연결하는 구조를 다뤘다. 구조가 나뉘면 등록할 자리도 늘어난다. 지금 고른 PNG가 웃음 표정에 들어가는지, 기본 표정의 말하기 상태에 들어가는지 알 수 있어야 한다.

현재 Studio 화면에서는 표정을 먼저 선택하고, 그 아래에서 입 상태를 고른 뒤 PNG를 바꾼다. 표정 슬롯에는 작은 그림이 보이고, 선택한 상태에는 별도의 이미지와 등록 안내가 표시된다. 큰 미리보기에서는 현재 캐릭터의 반응을 확인한다.

1.2.0 검증 과정에서 저장한 실제 Studio 화면. 마이크는 중지되어 있고 커스텀 PNG는 미등록 상태다. 라쿤은 임시 샘플이다.

PNG 바꾸기 버튼으로 파일을 선택할 수도 있고, PNG 한 장을 미리보기나 표정 슬롯에 끌어다 놓을 수도 있다. 미리보기에 놓으면 현재 선택한 표정과 입 상태에, 슬롯에 놓으면 그 슬롯의 선택된 입 상태에 연결된다. 어느 자리를 선택해 두었는지가 중요하다.

가져온 이미지는 앱이 관리하는 이미지 폴더에 복사한다. 원래 파일이 있던 위치를 계속 가리키는 방식에만 의존하지 않도록 한 것이다. 파일을 읽는 데 실패하면 기존 이미지를 유지하고 안내를 표시한다.

미리보기는 확인 도구에 가까웠다

투명 PNG는 배경에 따라 확인하기 어려운 부분이 달라진다. 어두운 후드의 윤곽은 어두운 바탕에서 잘 보이지 않을 수 있고, 밝은 부분은 밝은 바탕과 섞여 보일 수 있다.

현재 미리보기에는 체크무늬·밝게·어둡게 배경을 바꾸는 버튼이 있다. 그림을 다른 바탕에 놓고 확인하기 위한 기능이다. 이 배경은 방송 출력에 넣는 배경이 아니며, 화면 아래에도 그 차이를 안내한다.

현재 표정과 무음·말하기 상태를 글자로 보여주는 것도 같은 이유다. 그림만으로 판단하면 비슷한 PNG 두 장이 바뀐 것인지, 반응 자체가 멈춘 것인지 구분하기 어렵다. 캐릭터를 보여주는 영역과 상태를 설명하는 안내가 함께 있어야 확인하기 쉬워진다.

단축키를 기억하지 않아도 조작할 수 있게

방송 중에 표정을 바꾸려고 매번 큰 설정 창을 여는 것은 번거롭다. 전역 단축키는 한 가지 방법이지만, 모든 사람이 여러 조합을 외우거나 편하게 누를 수 있는 것은 아니다.

그래서 미니 모드를 추가했다. 작은 창에서 표정 그림을 눌러 선택하고, 마이크를 켜거나 끄고, 캐릭터 창을 표시하거나 숨길 수 있다. 기본 표정과 커스텀 표정은 페이지를 나눠 보여준다.

1.2.0의 실제 미니 모드 검증 화면. 기본 표정 페이지이며 마이크는 꺼져 있다. 미니 창의 설정·트레이 버튼은 문자형으로, 큰 Studio 창의 아이콘 버튼과 구분된다.

미니 모드는 Studio와 같은 표정 상태를 조작하는 작은 제어창이다. 여기서도 표정만 선택하면 입 모양은 마이크에 따라 자동으로 바뀌는 구조를 유지한다.

창은 항상 위에 표시되고, 이동한 위치는 설정에 저장된다. 자세한 설정이 필요하면 설정 버튼으로 Studio에 돌아갈 수 있다. 작은 창에는 자주 쓰는 조작을 남기는 쪽으로 범위를 정했다.

단축키도 정해진 조합을 강요하지 않기

마우스 조작과 함께 단축키를 쓰는 길도 남겼다. 표정 전환뿐 아니라 설정 창 열기, 미니 모드, 마이크 전환 같은 동작의 키를 사용자가 바꿀 수 있다. 필요하지 않은 항목은 해제할 수도 있다.

1.2.0 검증 중 저장한 단축키 설정 창. 커스텀 1에 표시된 조합은 시험 설정이며 기본값이 아니다.

설정 창에서 원하는 조합을 직접 누르면 입력되고, 중복된 조합은 검사한다. 전역 단축키는 Windows에 등록하는 방식이므로 다른 프로그램의 사용 상황에 따라 등록에 실패할 수 있다.

단축키와 미니 모드 중 어느 쪽이 더 편한지는 방송 중 사용하는 프로그램과 조작 습관에 따라 달라질 수 있다. 한 가지 조작법을 익혀야만 쓸 수 있는 구조보다 선택지를 두고 싶었다.

창을 닫는 것과 프로그램을 끝내는 것을 구분하기

설정을 마쳤다고 해서 큰 창을 계속 띄워둘 필요는 없다. 토키의 트레이로 보내기는 Studio와 미니 제어창을 숨기고, 프로그램은 실행 중인 상태로 남기는 동작이다. 이 동작 자체가 마이크를 끄거나 캐릭터 창을 숨기지는 않는다.

트레이 아이콘을 더블클릭하면 Studio로 돌아온다. 우클릭 메뉴에서는 미니 모드 열기, 마이크 전환, 캐릭터 표시 전환과 완전 종료 등을 선택할 수 있다. 트레이 아이콘이 정상적으로 있는 경우에는 Studio의 닫기 버튼도 트레이로 보내는 동작으로 처리한다.

이 차이를 모르면 창이 없어졌는데 프로그램은 왜 계속 실행되는지 혼란스러울 수 있다. 그래서 처음 트레이로 보낼 때 계속 실행 중이라는 안내를 보여주고, 완전히 끝내는 항목은 ‘Toki 완전 종료’로 따로 둔다.

설정 창을 숨기는 문제와 방송에 캐릭터를 전달하는 문제는 구분해야 한다. 트레이 기능만으로 화면 캡처의 검은 배경이나 캐릭터 창 표시 문제까지 해결되는 것은 아니다. 방송 프로그램으로 보내는 과정은 다음 글에서 다루려 한다.

작은 표시도 사용법의 일부가 됐다

큰 Studio 창의 상단에는 미니 모드와 트레이로 보내기 같은 동작을 아이콘으로 배치했다. 상단 버튼의 크기와 아이콘 영역을 맞추고, 동작을 설명하는 도움말을 제공한다. 왼쪽에는 실행 중인 버전도 표시한다.

아이콘은 공간을 줄여 주지만 모양만으로 의미가 분명하지 않을 수도 있다. 특히 트레이로 보내기가 파일 다운로드처럼 읽히면, 버튼이 작고 깔끔하다는 것만으로는 충분하지 않다. 무엇을 하는 버튼인지 이해할 수 있는지도 함께 봐야 했다.

버전 표시는 서로 다른 실행 파일을 비교하거나 문제 화면을 전달받았을 때, 어느 버전을 보고 있는지 확인하는 기준이 된다. 기능을 만드는 과정에서 사용법을 설명하고 문제를 확인하는 일까지 조금씩 화면 안으로 들어왔다.

이 글의 제목은 모든 사람이 이미 편하게 쓸 수 있다는 선언은 아니다. 한 캐릭터 세트를 움직이는 도구에서, 사용자가 자기 PNG를 넣고 자기 방식으로 조작할 수 있는 프로그램으로 넓혀 가는 방향을 뜻한다. 실제 방송 중에도 충분히 편리한지는 계속 확인할 부분이다.

---

다음 기록
캐릭터는 보이는데 방송에는 안 나왔다 — PRISM과 OBS로 캐릭터를 전달하면서 만난 문제.