デジタル置き時計アプリを作った話
今年の三賀日は餅三昧で、揚げ餅に砂糖醤油のタレと大根おろしをかけたのが感動的にうまかった。どうも、案山子です。久しぶりに正月らしい正月。
年末年始にUnityでデジタル置き時計アプリを作ったのでその顛末を。
これをアプリと言っていいやらわからんがアプリらしきものを初めて作ったので書き残しておきます。
初心者というものはこんなこともわからんのだったという遠い過去を思い出してください。
事の起こり
2021年末、帰省先の家族からLINEが来た。
「黒地に白のデジタル置き時計が欲しい」
どういうこっちゃと聞いてみたら、今使ってる置き時計は白地に黒なので夜中に目が覚めた時によく見えないし、時刻の読み上げも聞き取れないので何時なのかがわからんのだと言う。地元ではちょうどいい時計が手に入らないので都会の電器屋で買って持って来てくれということらしい。
なお家族は老眼で若干耳も遠くなってきた老案山子である。
時計メーカーの製品情報をぐぐったり自分のスマホで置き時計アプリを試してみたりしていたのだが、老案山子にヒアリングしているうちに「朝は時報を鳴らして欲しい」という要望が出てきた。目覚ましのアラームは止めるのが面倒なので勝手に鳴って勝手に止まって欲しいと言うのである。布団の中に居てもそれで時刻が知れる。昔の柱時計みたいのがいい。
朝だけ鳴る鳩時計かな。ポッポー・ポッポー🐦
もしかして作れなくもないのでは。Unityで。
幸い帰省先には使ってないスマホ(android)が一台あり、老案山子はスマホのLINEで家族トークが出来る程度にはデジタル化されている。やってみるか。
要求定義
・黒地に白字のデジタル表示の置き時計
・普段は画面は暗いままで、タップしたら明るくなる
・老眼でも眼鏡なしで時刻が見える
・朝の6時・7時・8時に時報が鳴る←new!
オプション機能としてアプリ上で変更を行いたい項目
・画面をタップした時の明るさ（スライダー）
・明るくなっている時間1秒(早い)・2秒・3秒(ゆっくり)をToggleで選択
・時報各時のON/OFF
・時報の試聴の再生/停止
さて作ろう。
制作１日目
メインの時計機能は先達の知恵に与りほぼ楽勝。ｲﾂﾓｱﾘｶﾞﾄｳｺﾞｻﾞｲﾏｽ(-人-
時刻も日付もSystem.Datetimeで取得してToString()でTextに入れるだけ。曜日を日本語で表示するのにSwitch文を書いたくらい。
バッテリーの残量や状態もSystemInfoから取得できた。
タップして明るくなる部分は時計の上に黒Imageを置いて不透明度をアニメーションする。シンプルに力技である。
制作２日目
合間に大掃除したり満席の新幹線で移動したり餅を買いに行かされたりしているので日付は飛ぶがだいたい2日目。オプション機能を作る。
変更したい部分を変数にしておいて、タップされたりスライダーが動いたりしたら代入する値を変更するだけである。楽勝デスネ。
時報の音源は効果音ラボ(ｲﾂﾓｵｾﾜﾆﾅｯﾃｵﾘﾏｽ)からお借りした。老案山子は高い音が聞こえづらいとのことで、声素材から「落ち着いた女性の声」をDLしてGarageBandで切ったり貼ったり。
あいにく７を「しち」と読んでいる音源がなかったのだが、老案山子は「"いち"だか"しち"だかわからんから"なな"でいい」らしい。
ジングルとして鳩時計の音も入れてみたよポッポー🐦
試聴の再生/停止をひとつのボタンで賄う為に再生の終了タイミングを知りたいなあと言うことでぐぐっては先達の知恵に与る。
いろいろ方法はあるみたいだが、今回はAudioClip.lenghで音源の長さを取得しボタンの機能を切り替えることにした。実際に再生してみるとなぜか音がフェードアウトし切らないうちに切り替わってる気がするが、体感で0.3秒くらいの誤差なので見なかったことにする。
スライダーのハンドルやボタンのRaycastPaddingも掴みやすいように広めに調整した。自分の指も太いので反応する範囲は広い方が操作しやすい。
よっしゃ、これでだいたい出来た！！！
制作３日目
ビルドしようとしてふと気がついたが(遅い)、アプリが終了した時にオプションで変更した値を保存しておくようにしておかないといかんのでは？？？
これはあれだ。前に解説本見ながらUnityでゲームを作った時のやつ。PlayerPrefsだ。
吉例に則りOnDestroy()でアプリ終了時にオプションの各項目をPlayerPrefsでセットして保存する。Unityのゲームビューを停止→再生を繰り返しても変更が受け継がれている。わあすごい。
しかしandroid向けにビルドして実機にインストールしてみるとオプションの変更が保存されない。アプリを起動する度に初期値に戻ってる。自分のスマホと合わせて2台とも同じ挙動である。何故だ！！！？？？
助けてドラえもーん！！！(という名の先達のみんなー！！！
>onDestroyは呼ばれないことが多い
まじか。
正直よくわからん。わからんのだがわからんなりに解決の光は見えた！！！
OnDestroy()でだめなら、その場で保存すればいいんじゃね？？？
…という訳でタップイベントやスライダーのOnValueChanged()にそれぞれPlayerPrefsの保存を追加、ビルド、何度目かのインストール。
保存されたーーーーー！！！！！
ありがとう世界。穏やかな気持ちで年越しそばに間に合いました。
以下附
ここからは老案山子に枕元で実際に使ってもらっての調整である。
制作４日目
「６時は鳴ったけど変な画面になった。あと明るすぎて眩しい」
メールの通知が出ていたのでそれをタップしたらしい。念の為すべての通知を切り、置き時計アプリを画面固定にする。ベースの明るさはスマホ本体のディスプレイ設定から調整。
制作５日目
「時報が鳴らんかった」
わしがオプションいじった後で設定戻すの忘れました。ごめんなさい。
制作６日目
「ちゃんと時報が鳴った。明る過ぎないしこれでいい」
クライアントが満足したのでヨシ！！！
オプションのUIをもうちょっとなんとかしようと思ってたけど、残り日数も少ないので今はこのまま使ってもらうことにした。
三賀日をめいっぱい使ってぎりぎりセーフ。
アプリのUIを作って思ったこと
ざっくり作ったデザインほぼそのままでいったん完成としたのはちょっと心残りではあるが、「老眼の老案山子が眼鏡なしでも(目がしょぼついている寝起きでも)使えるUI」という前提はかなり難しいという気づきを得た。
フォントの読みやすさやサイズ、背景や文字・オブジェクトのコントラスト、ボタンアイコンの意味が伝わるかどうか。
「歯車⚙マークは設定を開くで✖マークは設定閉じるなのはわかる？」というところから始まったが、いわゆる「お約束」が通じないかも…という条件は本当に難しい。
同時にテキストの強さも痛感する。しかしテキストを多用しすぎると目が滑って伝わらないあるあるである。しかもフォントサイズが大きいのでテキストが長いと入り切らない。説明がなくてもわかる言葉を探した。家族という小さなコミュニティ内だから出来たことではある。
オプションを画面半分で使うよりも全画面に広げた方が見やすかったなあと反省しつつ、明るさの調整で時計画面そのものを見せたいというジレンマもあり、時刻の部分だけ見せたらどうか…と今頃思いついたりもしている。
2022年のはじめに
Unityを始めて約２年、これまではゲームのGUIっぽいものを実装して動かしてみたり主にビジュアル面に集中していたのだが、今回は家族向けのフルオーダーとは言え小さなアプリらしき何かを作る機会があり、ああしようこうしようと考えることでまた別の視界が広がった気がする。
C#に触るようになって１年、やりたいことに対してこれをこうしたら出来るかも…という予想を立て、それをぐぐってなんとかするということが出来るようになって来た。
スクリプトを打ってる時間よりぐぐってる時間の方が長いけど。まだまだツギハギのパッチワークではあるけども。もっとスマートなやり方もあるとは思うけど。
一歩だけ大人の階段を登りました。
今年からUnityちゃん３年生です。がんばります。
この記事が気に入ったらサポートをしてみませんか？