【Sensor Watch】cheapCASIOを改造し私だけの褒め腕時計作ってみた

こちらはDeNA 24新卒 Advent Calendar 2023 の16日目の記事になります

（昨日の記事の投稿は@wdtkr さんでした。）

はじめに

はじめまして！AO（あお）と申します。

いつも記事は自身の個人ブログに書いていたので、何気にQiitaで記事書くのは初めてになります..！

こちらの記事をざっくりまとめると以下のような内容になります。

Sensor Watchで遊んだだけの内容にはなりますが、ぜひ最後まで読んでいただけると嬉しいです。

記事概要

【読むのにかかる時間】

• だいたい3分程度

【内容】

• cheapCASIOの中の基盤をSensor Watchに変更し、プログラム書き換えて私を褒める機能を追加。
• さらに文字盤も剥がして塗装し直し。
• 世界で一つの私だけのオリジナル時計作ったぞ！わい！

【対象読者】

• ちょうど新しい時計が欲しい方
• 電子工作好き
• ハンドメイド好き

この記事に至った背景

私は来年の4月から社会人になる予定であり、社会人になっても見劣りしない良さげな腕時計欲しいなあ

↓

cheapCASIOとSensor Watch基盤をいただく機会があった

↓

自分でプログラム書いた腕時計なら、社会人エンジニアとして見劣りしないし面白いやん！！作ったろ！！

cheapCASIO、Sensor Watchって何？

そもそも「cheapCASIO、Sensor Watchって何？」って方も多いと思うので、ここから説明。

cheapCASIOとは、時計メーカーCASIOブランドの腕時計の中でも低価格（1000〜3000円程度）の時計のことです。

一時期あいみょんがつけていて話題になったやつですね。今回弄るのもこれになります。
※私が持ってるあいみょんモデル（A158WEA-9）

Sensor Watchというのは、これらの安価なCASIO時計をベースにしてセンサーやプログラム可能な機能を追加し、よりカスタマイズされた個性的な時計を作ることを可能にするためのオープンソースのハードウェアハッキングプロジェクトになります。

以下から「Sensor Watch」の基盤（32bitCPU)を購入することができ、これのプログラムを書き換え、別途購入したcheapCASIOに入れることでオリジナルの機能を搭載した時計を作ることができるわけです。

使用するもの

まずは使用物。今回は以下のものを使用します。

【機能書き換え・ハード】

• Sensor Watchの基盤
• cheapCASIO（A158WEA-9）
• ちっちゃいドライバー
• USB MicroBケーブル

【機能書き換え・ソフト】

• Mac(M2)
• Docker(ubuntu)
• vscode(dev container)

【文字盤まで変えるときのもの】

• マニキュアの除光液
• UVレジン
• UVライト
• 塗装用のラメや染色できるもの
• 綿棒
• テッシュ
• 接着剤

※ちっちゃいドライバーは、ネジ外しにはプラスしか使いませんが、ちっちゃいマイナスもあると基板の取り外しなどに便利です。

機能書き換え実践！

さっそく機能書き換えをやってみます。

プログラム書くぞ

まずは環境を立ち上げプログラムを書いていきます。

※以下の記事が本当に参考になりましたので、実際にやる方はこちら参考にする方がわかりやすいかも、、

上記お二方の記事参考に、今回私はDockerで立ち上げてみました。

FROM arm64v8/ubuntu:22.04

WORKDIR /workspaces

# 必要なパッケージをインストール
RUN apt -y update \
    && apt -y upgrade \
    && apt -y dist-upgrade \
    && apt -y install gcc-arm-none-eabi \
    && apt -y install make \
    && apt -y install git \
    && apt -y install python3 \
    && apt -y install xz-utils

# Emscripten SDK (emsdk) のインストール
RUN git clone https://github.com/emscripten-core/emsdk.git \
    && cd emsdk \
    && git pull \
    && ./emsdk install latest \
    && ./emsdk activate latest

# 環境変数の設定
ENV PATH="/workspaces/emsdk:/workspaces/emsdk/node/14.15.5_64bit/bin:/workspaces/emsdk/upstream/emscripten:${PATH}"

vscodeのdevcontainersという拡張機能を使用してこちらのコンテナに入ります。

左下のvscodeのコンテナを開くボタンを押すとチャチャっと入れます。

その際、devcontainer.jsonというdevcontainerの設定などを記入するファイルが作られます。

私の場合は以下の内容になります。

// For format details, see https://aka.ms/devcontainer.json. For config options, see the
// README at: https://github.com/devcontainers/templates/tree/main/src/docker-existing-dockerfile
{
	"name": "Sensor Watch Development",
	"build": {
		"context": "..",
		"dockerfile": "../Dockerfile"
	}
}

コンテナを開きWorkspaceを開いたら、そのターミナル内で以下を実行し、Sensor Watchのプロジェクトをクローンしてきます。

git clone https://github.com/joeycastillo/Sensor-Watch

その後以下を実行し、新たなwatch_faceを追加します。

cd /workspaces/Sensor-Watch/movement/template
python3 watch_face.py complication love

watch_faceとは、この時計の機能コンポーネントみたいな部分で、これでlove_faceという機能コンポーネントファイルができたという形です。

※私を褒めさせる機能を作成したかったので名称をloveにしました。ここの名称は機能がわかりやすいものであればなんでもよきです。

これにより、love_face.c と love_face.hというファイルが出来上がりました。

※こちらのファイル等の詳細は以下の方の記事が大変わかりやすいです。

ここからプログラムを書いていきます。

※言語はCになりますが、コード構成の大枠は出来上がっているのでC未経験でも全然かけます。

そして今回実装してく機能としては以下になります。

• モードボタンを押すと表示
• １秒ごとに私を励ます文字を表示する。
• ライトもぴかぴかさせてゴージャスに。

まずはlove_face.hのtypedef structの部分を以下追加します。

typedef struct {
    // Anything you need to keep track of, put it here!
    bool led_light; //ここ追加。赤いライト光らせる判定値
    uint8_t unused;
} hello_state_t;

love_face.cのlove_face_loopにも追記します。

ここポイントで、表示させる文字の表示領域が以下のようになっているので、大きく表示される部分にのみ表示させるために0~1分の空白をうまいこと追記します。（4~9のみ表示）

引用：https://www.sensorwatch.net/docs/wig/display/

さらに、７セグメント表記で表示できないアルファベット(N,M,Tなど)もあるので、これも加味して褒めメッセージを考案します。

苦肉の策で出したメッセージが以下。（恥ずかしいなこれ）

ao HOPE (あお　希望！)

ao COOL (あお かっこいい！)

これを実際に組み込んでいきます。

bool love_face_loop(movement_event_t event, movement_settings_t *settings, void *context) {
    char buf[100]; // buf変数の宣言とサイズの指定
    love_state_t *state = (love_state_t *)context;
    switch (event.event_type) {
        case EVENT_ACTIVATE:
            sprintf(buf, "    AOHOPE");
            watch_display_string(buf, 0);
            break;
            
        case EVENT_TICK:
            if (state->led_light) {
                watch_set_led_red();
                state->led_light = false;
                sprintf(buf, "    AOHOPE");
                watch_display_string(buf, 0);
            }
            else {
                watch_set_led_off();
                movement_illuminate_led();
                state->led_light = true;
                sprintf(buf, "    AOCOOL");
                watch_display_string(buf, 0);
            }
            break;
        case EVENT_MODE_BUTTON_UP:
            watch_set_led_off();
            state->led_light = true;
            movement_move_to_next_face();
            break;
        case EVENT_LIGHT_BUTTON_UP:
            break;
        case EVENT_ALARM_BUTTON_UP:
            break;
        case EVENT_TIMEOUT:
            break;
        case EVENT_LOW_ENERGY_UPDATE:
            break;
        default:
            // Movement's default loop handler will step in for any cases you don't handle above:
            // * EVENT_LIGHT_BUTTON_DOWN lights the LED
            // * EVENT_MODE_BUTTON_UP moves to the next watch face in the list
            // * EVENT_MODE_LONG_PRESS returns to the first watch face (or skips to the secondary watch face, if configured)
            // You can override any of these behaviors by adding a case for these events to this switch statement.
            return movement_default_loop_handler(event, settings);
    }

ここまでできたらmovement_config.hにlove_faceを追記します。

これはmainみたいなもので、実際に時計に表示するwatch_faceコンポーネント達を記入します。

const watch_face_t watch_faces[] = {
    simple_clock_face,
    love_face, //ここ追加。ここにすることでモードボタン押した時最初にこの画面になる
    world_clock_face,
    sunrise_sunset_face,
    moon_phase_face,
    stopwatch_face,
    preferences_face,
    set_time_face,
};

ここまできたらエミュレータに反映させ、内容を確認します。
以下を実行し、htmlにアクセスするとエミュレーターを確認できます。

//移動
cd /workspaces/Sensor-Watch/movement/make/

//エミュレータに反映。
//私は赤い基盤を使っているのでCOLOR=REDですが、緑の人はCOLOR=GREEN、青の人はCOLOR=BLUEと入力します。
emmake make COLOR=RED

//サーバー立ち上げ
python3 -m http.server -d build-sim

http://localhost:8000/watch.html にアクセス

こんな感じの画面。
モードボタンやライトボタンなど押すと、実際に動きがわかりやすいです。

ちゃんと動いてることが確認できたら.uf2ファイルに書き出します。

これを後程接続する基板の中にアップロードしてあげれば書き換えが完了します！

以下で書き出しです。

make COLOR=RED

cheapCASIOを分解！PCに繋いで内容書き換えるぞ

まずはPCにMicroBで基盤を接続します。

接続したら、後ろのボタンをダブルクリックし、WATCHBOOTドライブをPCに読み込ませます。

Macだとこんな感じで許可するかどうかが出るので、許可を押します。

読み込まれたWATCHBOOTドライブに先ほど出力した.uf2ファイルをアップロード（元あった.uf2を上書き）して完了です！

あとは時計を分解し、内部の基盤を入れ替えるだけです。

まずは後ろのネジを外し、内部を取り出します。

白いカバー部分の留め金を外し、基盤と画面部分を分離させます。

そこで出てきた基盤と、先ほど書き換えたSensor Watchの基盤を入れ替えます。

これを元通り組み立てると、、私のことを褒めてくれる時計が出来上がりました。

文字盤塗装しなおし

世界に一つだけの腕時計になったので、どうせならもっと可愛くしてやりたい。

ってことで塗装もし直しました。

まずは文字盤部分を取ります。

接着剤でつけてあるだけなので取れるらしいのですが、めちゃくちゃくっついてて大変でした。

力こそパワーです。

付着している接着剤の残りは綺麗に取り除きます。

次に、マニキュアの除光液を使用し文字盤の塗装を溶かします。

※マニキュア塗ったままやると当然マニキュアも溶けます、マニキュアしたままの人はゴム手とかしましょう！（私はマニキュア溶けました)）

ここから、塗装をしっかりし直し、UVレジンでぷっくり効果もつけて、出来上がったのがこちら↓

完成！！

可愛い宇宙色になりました！
こちらに基板も嵌め込み完成！

ao HOPEも言ってくれます！嬉しいですね。

あとがき

Sensor Watch触ってみましたが、やれることも多く理想の時計を作成でき、楽しい上に大満足でした！

（ただ、エンジニアとして見劣りしない時計にしたかったので、サイバーパンクっぽい見た目にすりゃよかったかも）

また、DeNA 24 新卒 Advent Calendar 2023 は明日以降も続きます！

面白い記事がたくさん上がっておりますので、よかったら是非みてみてもらえると嬉しいです！

（明日の記事は@ry-na さんです！お楽しみに〜！）

参考