Pebble 워치페이스(watch face) 프로그래밍 경험담

며칠 간 Pebble의 워치페이스를 프로그래밍 해 보고 느낀 점을 기술하고자 한다.

1. 계기

< 이번에 프로그래밍한 워치페이스 (Engineering 소스 기반) >

예전에 Texas Instrument사의 eZ430를 engineering sample로 구입했던 적이 있다.

그 기기를 받아 이리저리 둘러보면 내가 원하는대로 화면 표시도 바꾸고 싶고 기능도 추가, 변경 하고 싶은 욕구가 넘쳤다. 

이후 Pebble Time Steel을 구입했을 때 개발 환경을 살폈던 것도 그런 영향이 있었을 것 같다.

< 여러가지 센서가 있어 호기심을 자극했던 eZ430 >

Pebble Time Steel의 경우 처음부터 워치페이스를 개발하고자 했던 건 아니었다.

Pebble 기기 자체의 성능이 다른 스마트워치에 비하면 부족한 편이이서 다른 큰 기대를 하지 않았기 때문이기도 했지만 이미 다양한 워치페이스와 앱들이 이미 많이 공개되어 있었기 때문이었다.

특히 워치페이스의 경우 클래식하거나 노멀한 것은 물론이고 기발하고 때론 기괴한 것들도 넘처날 정도였다.

다만 각각의 워치페이스들은 개인적으로 느끼기에 한 두 개씩 아쉬운 요소가 있었다.

< 개인적 요구를 만족시키면서 Pebble 커뮤니티에서 매우 인기있는 워치페이스인 MODERN - Pebble 클래식용을 고려해서 그런지 컬러 처리가 없어 아쉽다 >

워치페이스에 대한 내 요구사항은,

- 아날로그 시간 표시가 되면서

- 동시에 디지털 시간도 표시되고

- 날짜/요일이 함께 출력

되는 것이었다.

실제로 Pebble 워치페이스에서 이를 만족하는 다수 있는데 그 워치페이스들은 미적으로 약간 아쉬운 점이 있었다.

미적으로도 괜찮다 싶은 종류들은 위의 사항에서 한 가지 정도가 아쉽게 지원이 안되었다.

그래서 만들어 보자는 생각을 하게 되었다.

(미리 언급하지만, 만든 것이 기존에 발표된 워치페이스 보다 좋다고는 말 못하겠다. 그냥 한번 시도해 봤다는 것에 의의를 두는 수준이다.)

2. 준비

개발 방법을 찾을 때 즈음에는 이미 SDK 4.0이 발표되어 있었다.

문제는 Pebble이 사업을 종료한다고 발표한 후 매우 늦게 구입한 편이다 보니 향후 지원이 불안한 상태였다.

다행히 개발자 사이트(https://developer.pebble.com)에서 SDK 다운로드나 기술자료 조회가 되고 CloudPebble 사이트에서 클라우드 개발환경을 사용할 수 있는 상태였다.

개발자 사이트에 있는 튜토리얼에 간단히 워치페이스를 만드는 예제가 있는데 C 언어를 선택하면 디지털 시간이 표시되는 예제만 수록되어 있다.

아날로그 시계와 같은 화면을 그리고 관련된 처리를 하는 예제가 필요했는데 당시에 참조가 될 만한 자료를 못 찾았다.

(나중에 보니 Example 항목에서 아날로그 워치 페이스 예제 소스를 Github나 CloudPebble로 볼 수 있었다)

그래서 개발자 분들이 공개한 Pebble 워치페이스를 찾기 시작했다.

이전 글에서 잠깐 언급했듯이 Terry Yuen이라는 개발자의 Fourier 워치페이스를 매우 만족했기 때문에(디지털 시간이 표시되지 않는 것이 아쉬웠다) 혹시 그 워치페이스의 소스가 있는지 찾아봤다.

그의 기사와 개발기 등이 소개된 글은 있지만 Fourier를 포함하여 TH 시리즈 등에 대한 소스 코드는 공개하지 않는 듯 했다.

다른 워치페이스 중 소스를 공개한 것이 있는지 확인하다가 Engineering이라는 워치페이스의 소스 코드가 Github에 있는 것을 발견했다.

아날로그 시계 화면이 Pebble Time에 맞는 사각형이었으면 했지만 화면 모습이 미려해 보여서 이것을 기본으로 하기로 마음먹었다.

개발환경으로 CloudPebble을 사용하느냐 리눅스에 툴을 설치하느냐도 고민했다.

리눅스에 관련 툴을 설치해 보기는 했지만, 대규모 작업을 하지 않고 여러가지 리소스를 쓰지 않는다면 CloudPebble이 편할 것이라고 판단하고 CloudPebble에 해당 Github 소스를 import하여 수정하기로 했다.

3. 시도

Engineering 워치페이스의 소스 코드와 기술문서들을 보면서 앱의 구조와 처리 방법들을 스터디 할 수 있었다(개발자인 Nicko Guyer라는 분께 감사드린다).

그러는 와중에 소스에서 찜찜한 부분이 있어 고쳐보기로 마음먹었다.

이 워치페이스는 매초 마다 모든 레이어의 화면을 갱신하게 되어 있었다.

시침, 분침, 초침을 시간에 맞게 표시하려면 초단위로 화면을 갱신하는 것이 가장 확실하겠으나, 시간에 따라 변하지 않는 시간 숫자나 시/분 눈금, 특히 하루에 한 번 변하는 날짜 정보까지 매초마다 다시 그려야 할까 하는 생각이 들었다.

그래서 갱신 필요한 레이어만 갱신하도록 고쳐 보았는데, 이것이 적절한 판단이었는지는 잘 모르겠다.

왜냐하면 매초 마다 화면을 새로 그리는 것도 부하이지만, 화면 갱신 필요성을 판단하고 화면의 갱신 부분을 분석하는 것도 새로운 부하이기 때문이다.

Pebble을 임베디드 시스템으로 보면 워치페이스는 항상 돌고 있는 중요 어플리케이션인 샘이므로 어느 쪽이 전력을 덜 사용하는지 확인해 볼 필요가 있다.

또한 기본 소스 코드에서는 각 레이어 작업을 할 때 마다 새롭게 시간 확인을 하는데, 매초 콜백되는 함수가 제공하는 시간을 글로벌 변수에 넣어 쓰는 것이 더 효율적일 것 같았다.

물론 이렇게 하기 위해서는 모든 작업이 1초 이내에 다 끝난다는 보장이 있어야 한다.

그리고 각 작업 마다 시간을 확인하는 것 보다 시간 오차가 클 것이다.

코드 구조에서 추가로 변경한 부분은 다음과 같다.

- 설정 변경 외에 동작 중 화면 갱신이 필요없는 시간 숫자, 눈금을 별도의 레이어로 분리

- 매초 모든 레이어를 변경하지 않고 수정 필요한 레이어만 수정

- 날짜는 00초가 되었을 때만 갱신되도록 수정

- 초침 표시로 설정되어 있지 않아도 초침을 그릴 위치를 계산하는 구조를 변경해서 초침의 위치는 초침을 보는 상황에서만 계산

- 매초 콜백되는 함수에 기본으로 제공되는 시간 정보를 사용하지 않고 다시 시간을 확인하는 코드를 변경

- 사용되지 않는 펑션을 삭제 또는 주석 처리

처음 목적이 UI의 변경이었던 만큼 UI도 바꿨다.

BASALT(Pebble Time, Pebble Time Steel 종류)의 화면에서 숫자를 조정해 시계 원 화면이 넓게 보이도록 만들었고, 시/분 눈금(mark) 길이도 줄였다.

디지털 시간 표시는 화면 하단에 배치하도록 하면서 상단의 아날로그 시간 표시를 위쪽으로 시프트 했다.

날짜 표시도 월(月) 표시가 되도록 하면서 더 넓은 공간이 필요하여 역시 하단으로 옮겼다.

남은 베터리 수준을 화면 우상단 모서리에 퍼센트(%) 단위로 표시하게 했고, 연결이 끊어졌을 때 좌상단 모서리에 X자로 표시되게 했다.

시침, 분침 바늘도 원형처럼 보이도록 path 값을 수정했다.

< 실제 디바이스에 실행한 화면 >

4. 그 후

보면 볼수록 수정할 것들이 보여서 잠시 이 수준에서 실사용 해보려고 한다.

혹시 다른 사람에게 도움이 되도록 배포하고 싶은 생각도 있지만, 문제는 Engineering 워치페이스를 만드신 Nicko Guyer라는 분이 라이선스를 명시하지 않으셨기에 공개 배포가 가능한지를 알 수가 없다(만약 GPL이라면 반대로 공개해야 문제가 없겠지만).

Github에 올리신 것이기 때문에 공개의 의미가 클 것으로 생각하고는 있다.

아직 제대로 된 배포 패키지가 아닌 것도 마음에 걸린다.

CloudPebble에서 PBW 파일을 만들 수는 있는데 스마트폰 Pebble 앱에서 설치는 가능하지만 소개 화면이 표시되지 않는다.

5. 마치는 글

재미있는 경험이고 동시에 중독성이 대단한 프로그래밍 소재다.

자주 보는 기기의 화면이다 보니 자꾸 수정할 부분이 보인다.

Pebble은 너무 복잡하지 않으면서도 다양한 기능을 제공하는 플랫폼을 지녔다고 생각한다.

곧 서비스 페이지를 비롯해 Pebble 지원이 끊기면 개발이 어려워 질 것으로 예상되는데 안타깝다.