Webエンジニアのpawaと申します。今年はピクシブ社員史上初の学会（言語処理学会第24回年次大会ワークショップ）での登壇をこなしたり、ピクシブ史上初の運動部である硬式庭球部を設立したり、ピクシブ史上初のIT健保の硬式テニス大会に出場したりといった1年でした。年内にまだ1つビッグなことがあるはずですが何が起こるかはお楽しみです。
今回は、テニス部（活動詳細はこちら）の活動を通じて私が生み出した、テニス用ITツールを紹介します。無償配布しているのでぜひご利用ください。以下、私がどういう過程で問題を見つけてそれをどう技術で解決したかをトレースできるよう綴っていきます。
Keywords: スマートウォッチ, Pebble, C言語, Final Cut Pro X, Motion5, スコアカウンター, スコアボード, 動画編集, テニス
創作物その１：スマートウォッチ「Pebble」のアプリ「Tennis+」：テニスのスコアカウンター
テニス部活動を通じて初めに作ったツールは「Tennis+ 」というテニスのスコアカウンター（海外では Score keeper と呼ばれるよう）です。自作ながら今も愛用してテニスしています。アマチュアのテニスで使う腕時計型スコアカウンターとしては執筆時点で世界一使いやすい自信があります。
私は、Pebbleというスマートウォッチを2016年から愛用しています。このスマートウォッチ上で使える「Tennis」というテニスのスコアカウンター用のアプリがストアに無償でありました。しかし、アマチュアのテニスのルールまでは十分にカバーされておらず、「かゆいところに手が届かない」状態でした。そこで、私が改良してリリースしたのが今回紹介する「Tennis+」（図1）です。
実は Pebble Technology は大部分を Fitbit に買収されて、今はPebbleのオンラインサービス（ストアからアプリをダウンロードしたりといった機能）も終了されています。しかし、Rebbleという非公式の開発グループが代替となるオンラインサービスを維持していて、今でも特に問題なく使えます。
そもそもなぜスコアカウンターが必要と考えたか？
テニスの公式ルールブックでは、「チェアアンパイアがつかない試合方法」としてセルフジャッジの方法が定められています。アマチュアのテニスでは、この「セルフジャッジ」をする機会が大変多く（図2）、もしセルフジャッジ中にスコアを忘れた場合はプレーヤー同士が合意できるポイントまでさかのぼってから試合再開となります。
「スコアを忘れることなんてあるのか？」と思われる方もいるかもしれませんが、私の初めての大会出場時に、相手プレーヤーがスコアを忘れて試合が過去のポイントに戻るということが実際に起こりました（ボコボコにされる運命には変わりありませんでしたが）。
これを回避するためにスコアカウンターへの需要が生じます。試合中に身につけられるものを考えるとスマートウォッチがちょうど良かったため、スマートウォッチで実現することにしました。
競合となる商品はあるか？
競合となる商品を調査すると、腕に付けるタイプのスコアカウンター「ScoreBand Play」（Amaozn.co.jp で9000円弱）が見つかりました。
しかし、以下のようなアマチュアのテニスで使うルールには対応していないようでした。
- ノーアド（40 - 40 の後、次の1ポイントでゲーム）
- タイブレイク
- 1セットのゲーム数と何セットマッチかなどの調整
Pebbleで使えるオリジナルの「Tennis」アプリも「ノーアド」や「1セットのゲーム数の調整（例えば1セット4ゲームマッチなど）」には対応していません。そこで、「Tennis」がオープンソースであることを利用して、これを改良して、自身でこれらのアマチュアのテニスのルールに対応させた「Tennis+」を作ることにしました。
アマチュアのテニスでも使えるスコアカウンターの要件定義
プロが行うテニスの試合形式には既存の「Tennis」アプリが対応していたので、私が作るのはアマチュアのテニスで使われる以下の機能だけでした。
- ノーアド対応
- ゲーム数を 2,4,6,8 から選択可能化
- 試合途中でスコアカウントを終えられる機能（テニスコートをレンタルして使えるのは通常は時間単位であり、試合途中で終わるということも間々あるため）
C言語で開発
PebbleアプリはC言語かJavaScriptで作れるようですが、「Tennis」はC言語で書かれていたので、C言語で必要な機能を追加していくことにしました。
GitHubでオリジナルの「Tennis」をフォークしてプルリクエストベースで開発しました。以下の3つのプルリクエストで主要な機能は実装完了となりました。
元のコードがとても綺麗だったため、平日の真夜中に3日ほどプログラミングするだけで必要な機能を追加できました（ひょっとしたらどこかにバグがあるかもしれませんが）。
ノーアド対応
https://github.com/pawa-/pebble-tennis-plus/pull/3
ゲーム数を 2,4,6,8 から選択可能化
https://github.com/pawa-/pebble-tennis-plus/pull/5
試合途中でスコアカウントを終えられる機能
オリジナルの「Tennis」では試合終了までスコアカウントすると最後に簡単な統計情報が表示されます（図3）。
しかし、下のスクリーンショットの画面にある「Discard match」で試合を途中で放棄すると統計情報が見られなくなります。アマチュアのテニスでは試合形式の練習時などに時間制限で途中で試合を切り上げることもあるので、この機能（Finish match）が欲しいと思って実装しました。途中で Finish match しても統計情報は大体あっているはずですが、バグがないかやや怪しいです。
https://github.com/pawa-/pebble-tennis-plus/pull/7
使い心地のほどは？
ノーアドで試合するときに「Tennis」で面倒だった 40-40 の後にポチポチと2回ボタンを押す手間（アドバンテージを飛ばすため）が1回に減って、少し感動するところがありました。あとは、ダブルスで1セット4ゲームで試合することが多いので、それにも対応しているのは使いがいがあると感じます（「Tennis+」を使わずに試合をするということがまったくなくなりました）。
今後の改良点としては、5-5 からタイブレイクに入ることがたまにあるので、今後もそのケースに当たったら対応する予定です（現時点では https://developer.rebble.io/ からはアップロードできないようなので個人サイトで配布することになるかもしれません）。
補足：pebble app store への登録と公開，Pebbleアプリの開発フロー
この「Tennis+」開発当時（2018年3月末）、FitbitによるPebble買収に伴ってPebbleのアプリストアも3ヶ月後に閉鎖されるという状況でした。オリジナルの「Tennis」にプルリクエストを投げてマージされてリリースされるまでの時間の余裕はないと思われたので「Tennis+」というアプリで pebble app store に登録してあります（図4，今だと rebble app store，どうも私が最後のPebbleアプリ登録者だったようです）。
今はRebbleという非公式の開発グループが代替のストアを維持しているようなのでそちらからご利用ください（無償）：https://apps.rebble.io/en_US/application/5b02f29f461a8dd931000e5a
app store への登録の手順やPebble特有の開発フローはスライドにまとめてあるので、そちらをご覧ください：https://www.slideshare.net/pawa_/ss-98659720
創作物その２：Final Cut Pro X 用のテニススコアボード
テニス部活動を通じて次に作ったのは Final Cut Pro X 用のテニススコアボードです。
社会人になってからテニスを始める我々が効率よく上達するには自身のフォームをよく把握することが不可欠なので、我がテニス部では、第1回目の活動からすべて動画撮影しています。28回の練習会を終えた今、過去の動画を見ると、打ち方がまったく別人という具合で大変感慨深く感じられます。
どうせ動画撮影して編集するなら「部員が観てテンションの上がる編集力」を身に付けたいと思ってしまった私は、テニス経験ゼロからテニス部を創部してコート予約しつつ練習メニューを考えつつ自身のテニスに関するPDCAを回しに回しつつ、動画編集に関しても経験ゼロから独学で学んでいきました。
以下のように3月17日にMacの標準の動画編集ソフト「iMovie」を初めて触って、何本か部活動画を編集して「もうこのソフトを使っても自身は成長しない」と思えた段階で次のステップとなる動画編集ソフトの「Final Cut Pro X」に進んでいきました。
- 2018年3月17日：iMovie を初めて触る
- 2018年5月中旬：Final Cut Pro X をトライアル版で初めて触る
- 2018年6月12日：Final Cut Pro X 購入
音楽の使い方は、テニス系YouTuberである「TENNISISM【テニスイズム】」や「テニスのゴンちゃん」を大いに参考にしました（テニスイズムには実は出演したことがあって、YouTubeに映っていない場面でテニスイズムのメインキャラクターであるテニ男さん・テニ吉さんとラリーしたりしました）。
35歳テニス経験ゼロのテニ吉さんがテニス歴30年以上のテニ男さんの指導を受けて練習して大会出場して勝利を目指すYouTubeチャンネルなのですが、音楽の使い方だけでなく、動画編集の仕方・テニスの考え方・スポーツ経験の生かし方・常に進化を目指し続ける姿勢・経験ゼロからどうやって上達するかなど、多くのことを学ばせてもらっている非常にオススメのチャンネルです。
図5のように20本近く動画編集経験を積んだところで、テニス動画を編集する上で学ぶことはほぼなくなったと感じました。
ただ、動画編集時に「うまくスコアを表示する手段がない」という唯一不満に思うことはあったので。この不満を解消しながら動画編集能力をさらに引き上げようと思いました。図6のように表示できるのを理想と考えて要件定義しました（絵は描けないので伝わるか自信がない）。
構成要素は図7の通りです。
これを Final Cut Pro X 上で実現することを目指しました。
Motion5でスコアボードを実現するまで
「final cut pro tennis score」などで検索しても利用できそうなものは出てこなかったので、どうやれば実現できそうか調べました。どうもMotion5というモーショングラフィックスツールを使えば Final Cut Pro X 上で使えるものが作れそうだということまで分かったのですが、理想的なテニスのスコアボードができるかという確信には至っていませんでした。しかし、これでできないならばどうやっても作れないのではないかと思って2018年10月3日にMotion5を購入しました。
Motion5で実現可能かを検証
まずは本当にMotion5で Final Cut Pro X 上で編集・表示可能なものを作れるかを検証しました。Motion5で適当にテキストを表示する謎のブツ（図8）を作ったところ、Final Cut Pro Xでテキスト編集した上で動画に埋め込めることを確認できました（図9）。あとは、テニススコアボード用の背景を用意して、セット・ゲーム・ポイントごとの入力欄を用意すれば、「理論上は実現可能」という結論に至りました。
実際に作ってみた
実際に作ってみると思っていたよりもずっと簡単にできました（図10-12）。ベースとなるものは6時間もかからなかったくらいです。Final Cut Pro とのシームレスな連携も含めて、Motionが Final Cut Pro の最強のプラグインと言われる訳が分かりました。
Final Cut Pro X プラグインとして配布する方法は分からず
Final Cut Pro X プラグインとして無償配布したかったのですが、調べてもやり方が分かりませんでした。Motion5のファイルを配布する手が使えそうですが、Motion5が使えるユーザーならこの程度のスコアボードはユーザー自身で作れると思われるのでスコアボードの配布はなしにしました。
IT企業での合同練習・対抗戦相手募集中
ついこの前、taskey株式会社との合同練習が実現しました。元テニスコーチということで、ありがたいことに懇切丁寧に指導していただきました。
まだまだIT企業との合同練習・対抗戦相手を募集中です。ピクシブの中の人とテニスしてみたい方は pawa@pixiv.com までぜひメールをください！
