2022-10-17

ポケモンガチ対戦用パーティー管理アプリ『PokeBox』をリリースしました

まもなく『ポケットモンスター　スカーレット・バイオレット』が発売しますが、先日、iPhone/iPad/Mac向けのポケモンパーティー構築管理アプリ、『PokeBox』をリリースしました。

ポケモンパーティー構築アプリの「PokeBox」をバージョン1.1にアップデートしました。ポケモン新規作成時の挙動改善や、わざ周りのインターフェイスがわかりやすくなっています。SV対応もしていくぞ https://t.co/p8E1GjvCeq pic.twitter.com/kbzDw885WY
— giginet (@giginet) October 16, 2022

PokeBox - 構築管理ソード・シールド

gigi-net.net
ユーティリティ
無料

『ポケモン剣盾』以来、ランクマッチなど、いわゆるポケモンガチ対戦にハマり、自分の需要から開発したアプリです。

『剣盾』環境では、100体近いポケモンを育成し、努力値振りや構築意図などを、秘伝のスプレッドシートで管理していましたが、あまりにも煩雑なので、ちゃんと管理できるアプリを作ろうと思いつつ、この度ようやっと開発できました。

今のところ『剣盾』での利用を想定しています。今更『剣盾』を遊んでいる人は面構えが違う廃人ばかりだと思いますが『SV』のリリース後も末永く使っていただけると幸いです。（SVでシステムが大きく変わらないことを願うばかり！）

ご意見、ご感想、機能要望はTwitterにてお待ちしてます。

特に耐久調整などあまり考えて構築できてないので、本当のガチ勢の方のユースケースなどぜひ聞きたいです。

主な機能

ポケモンエディタ

ゲームの表示に近いレーダーチャート
わざ、とくせいを管理、フレーバーテキストの閲覧
きそポイント（努力値）振り、せいかく補正エディタ
ASぶっぱ、CSぶっぱなどよく使う調整の入力支援
メモ

パーティーエディタ

作成したポケモンをパーティーに登録
もちもの管理
1匹ごとに個別メモが可能

OS標準の機能

iPad対応(要iPadOS 16以上)
Mac対応(要macOS Ventura以上とM1 Mac)
日本語、英語サポート
ダークモードサポート
Dynamic Typeサポート
iCloudサポート
- お手持ちの全てのiPhone, iPad, Macでデータを同期できます

今後の機能追加予定

『ポケモンSV』サポート（新ポケモン・わざ・とくせい・もちもの、テラスタイプ）
さらなる入力支援（最硬調整、HP調整など）
構築のタイプチェッカー
- 「ポケモン徹底攻略」のタイプバランスチェッカーに近い機能になりそうです
構築シェア機能

技術的な話

このプロジェクト自体、技術的なキャッチアップの目的も大きかったため、語りたいこともたくさんあるのですが、この記事はリリース告知に留め、技術的な注目トピックをざっくりと紹介。

詳しい話はまた他所の勉強会やカンファレンスでできればなと思っています。

ポケモンデータの構造化

この手のアプリで一番頭を悩ますのが、ゲーム内のデータをどのように構造化するかという点です。

既存の構造化されたポケモンデータとして、PokéAPIというデータソースがあります。これは、ポケモンの様々な情報を取得できるWebAPIです。GraphQLなどにも対応しています。

このPokéAPIはオープンソースで開発されていて、実はデータソースもGitHubにあります。

このリポジトリには、大量のCSVと、それらをSQLiteにdumpするPython スクリプトがあるのですが、長らくメンテされていなかったため、いろいろPRを投げて修正しました。 SQLAlchemyのバージョンを上げたり、Docker上でのdumpをGitHub Action対応したりなどです。

ここまで来ると、あとは全データをRDBとして扱えます。

PokeBoxでは、ここから生成したSQLiteをアプリ内に保持し、SQLを投げています。アプリ容量が大きめなのはそのためです。

『SV』発売後に、この情報ソースが迅速に新仕様に対応できるかは懸念があります。この辺を自給自足できれば良いのですが、現状難しいため、発売後は別のソースも検討しないとならないかもしれません。

また、わざの習得テーブルなど、一部怪しいデータも散見されました。どうぐの細かなパラメータなども、6世代付近の情報で止まっていそうです。

SwiftUI on iOS 16

今回の裏テーマとして「SwiftUIを使って、Appleの推奨するモダンアプリケーションを正しく作る」というところを目指しました。全てがSwiftUIでできていますし、UIは標準のメールやメモアプリを参考にしています。

業務ではあまりアプリケーションレイヤーを触らないため、長年、SwiftUIについてしっかりキャッチアップできていないという課題感を感じていました。（エアプ）

今回、1本ちゃんと作って、さまざまなハマりを経験したことで、かなり知識のアップデートができたと考えています。この手のアプリの中では、かなり使い勝手の良いものが作れたのではと。

PokeBoxは、7月頃に開発を始めたため、WWDC 2022で登場した、iOS 16/iPad OS 16の新機能をふんだんに使っています。

What's new in SwiftUI - WWDC22 - Videos - Apple Developer

Layout

エディタ画面のレーダーチャートの実現のため、新しいCompositional Layoutの仕組みを使っています。

Compose custom layouts with SwiftUI - WWDC22 - Videos - Apple Developer

Path でレンダリングしたグラフに、ZStack で文字を重ね、Layout でグラフ上に配置しています。おかげで任意のサイズで描画できるレーダーチャートが実装できました。

当初はSwift Chartsの採用も考えましたが、試してみたところ、時系列グラフを前提として設計されていて、レーダーチャートの描画には向かなかったので早々に諦めました。

ViewThatFits

ViewThatFits はiOS 16から登場した新しいViewで、複数の候補のうち、収まりが良いものを自動的に採用してくれる仕組みです。PokeBoxでは、わざの表示に採用しています。

文字数が少ない場合はグリッド表示、多い場合はリスト表示に自動的に切り替わります。これによりiPadで表示しても収まりが良いものとなりました。

Grid/GridRow

Grid は、表組みのようなものを作る際に、最長の要素の幅に合わせて、自動的にレイアウトしてくれる仕組みです。

PokeBoxでは努力値エディタなどに利用しています。各パラメータについて、ラベルやスライダーの開始位置が揃っていることがわかるかと思います。

NavigationSplitView

NavigationSplitView は新しいNavigationStackの一種で、これ1つで全プラットフォームに適したナビゲーションを構築できます。

iPadではSplitViewとなり、iPhoneやwatchOSでは、自動的に NavigationStack のような挙動をします。

これのおかげでワンコードでサイドバー付きのiPad対応が実現しています。

素晴らしい仕組みのように見えて、iPhoneで正しく動かすには、バグが多く悩まされました･･････。β版どころか、16.0になってもバグってるので注意です。

navigationDestination / NavigationPath

navigationDestination modifierを使うことで、NavigationLink の遷移先を従来より管理しやすくなりました。

PokeBoxではほとんどの画面遷移に用いています。

The SwiftUI cookbook for navigation - WWDC22 - Videos - Apple Developer

Variants Preview

Xcode 14から、Xcode PreviewをダークモードやDynamic Typeを適応した状態でまとめて閲覧できるようになりました。（なぜ今までなかった）

PokeBoxでは、随所でPreviewを活用してUIを作成していました。またタイプ表示といった、小さなコンポーネントもSwiftUI化できました。

こういったものを作るには非常に向いていますね。

ぜひダウンロードしてね

手短に書こうと思いつつ、長くなりましたが、良い感じのアプリが作れて大変勉強になりました。普段UI層をあまり書かないアプリエンジニアなので、「UI作れる人すげーな」という気分。

ポケモンプレイヤーはもちろん、そうじゃない人が触っても楽しいアプリになったと思います。

どうぞご利用ください。

PokeBox - 構築管理ソード・シールド

gigi-net.net
ユーティリティ
無料

*1:筆者はfastlaneコミッターです

2022-07-25

クックパッド株式会社を退職して、LINE株式会社に入社しました

こんにちは、@giginetです。先日、新卒以来7年3ヶ月勤続したクックパッド株式会社を退職しました。

本日、クックパッド株式会社の最終出社でした！新卒で入社してから7年3カ月お世話になりました。最高の職場だった！ 👋 pic.twitter.com/VJLF3yh9UB
— giginet (@giginet) 2022年6月24日

このエントリは5年半振りの当ブログの更新になるのですが、いわゆる退職エントリというやつです🇨🇳👨‍🍳🍗

でっ誰？

@giginet
- https://github.com/giginet/
- https://twitter.com/giginet
前職：クックパッド株式会社
- 2015年4月に新卒入社、2022年6月に退職
- モバイル基盤部テックリード
現職：LINE株式会社
- 2022年7月15日に入社 🐣
- ディベロッパーエクスペリメンス開発室ビルドエンジニア
iOSの技術顧問やっています
- 株式会社マネーフォワード技術顧問
- taskey株式会社技術顧問
いくつかのiOSの開発ツールのコミッターをしている
- fastlane, Carthage, XcodeGenなど

クックパッドでやったこと

クックパッドでは、新卒入社後、最初1年はプレミアムサービスのグロースを行う事業を経験した後、その後丸6年は、モバイル基盤部という、全社のモバイルアプリの開発環境改善や、組織開発を行うチームで、全社横断的なiOSアプリの基盤開発をしてきました。

例えば、認証、決済、ロギング、A/Bテスト基盤といった、アプリ開発の基幹となるOSS・社内ライブラリ開発のほか、継続的デリバリー実現のためのCIやテスト、リリースフローの構築といった役割です。その他、社内iOSエンジニアのメンタリングや、面接や書類選考など、モバイルエンジニアの採用にも携わっていました。

長いこといたので、全て書くとキリがないのですが、大きな仕事としては以下のようなものが挙げられます。

レシピ検索の『クックパッド』アプリの開発環境改善とビルド高速化
- 6年間継続してメンテしていた
- 後半はモジュール分離やビルド環境改善にフォーカスした、通称「霞が関」プロジェクトを主導（後述）
記述しやすい行動ログ基盤の導入と汎化
『クックパッドマート』や『cookpadLive』といった、新規サービスの開発支援や、社内ライブラリ、開発基盤の整備
全アプリのサブミット自動化と、毎週のアプリリリースフロー自動化
オンプレのmacOS CIクラスタをフルPaaS(Bitrise)化
登壇、執筆、面接官、メンタリングなど組織開発と採用

やりきった！もうゴールしてもいいよね

リアーキテクチャとモジュール分離

「霞が関」プロジェクト。社内の政治的問題も解決していくぞ、とアイロニカルな意図を込めた名称でした

特にその中でも、後半の2~3年間は、事業の柱となっているレシピアプリである、クックパッドアプリの大規模なリアーキテクチャと、ビルド時間高速化を主導しました。

2019年当初のクックパッドアプリは、旧来から続く負債や、依然まだ25%残るObjective-C、計24万行に達するコードベースから来るビルド時間が事業上の大きな問題になっていました。当時の様子は、以下の講演記事をご覧ください。

そこで様々な問題を改善するため、「霞が関プロジェクト」*1を立ち上げ、ObjCの撲滅や、クリーンアーキテクチャの整備、ビルド待ち時間の削減に着手しました。

ビルド時間の改善のアプローチとして、Appleの主導するSwiftコンパイラの性能が支配的な要因であるフルビルドを効率化するのは早々に諦め、大きなアプリを複数のモジュールに分割し、Sandboxアプリと呼ばれるミニアプリのみを使って開発可能にするマルチモジュール化を推進しました。

すなわち、開発時に一部だけ簡単にビルドして起動できるようにするということです。

中層にあるFeature Moduleの1つだけしかビルドしなきゃ早くなるんじゃね？という考えで生み出されたアーキテクチャ。通称「親の顔より見た図」。

詳しいアーキテクチャの説明は、過去の講演資料や、ブログ記事に譲りますが、今では*2、アプリ全体が30個程度のモジュールに分かれ、ほとんどの機能開発がミニアプリのみを使って開発できるようになりました 🎉

アプリ全体のビルドには、一部のデザインを調整した程度の修正で、差分ビルドに十数秒を要していましたが、ミニアプリを使った開発では、ほんの3秒程度で起動できるようになります。

Sandboxアプリの実行の様子。機能毎にアプリが分かれているため、ビルドが爆速になり、画面の頭出しも容易になった

また、モジュール化により、一部の画面だけSwiftUIを取り入れたり、Xcode Previewを使うなど、Appleが提唱する標準のワークフローに乗ることができるようになりましたし、モジュール間の依存関係が整理され、機能間を疎結合に保ち、開発することができるようになりました。

この取り組みは、iOS開発界隈にも影響を与えられたと思います。近年のカンファレンスでは、多くの組織によるアプリのアーキテクチャや、マルチモジュール化の話題が多く取り沙汰されるようになり、クックパッドの取り組みを先進的だと評価してもらえたり、メルカリさんのイベントなど、様々な場所で発信の機会をいただきました。ありがたいことです。前掲のモジュール分離図は、界隈では「親の顔より見た図」と親しまれるようになり、自身の仕事によりプレゼンスを確立できたのが何より嬉しかった！もっと親の顔見て。

「モバイルファースト」の達成

僕が新卒で入社した2015年は、まだまだモバイルアプリの黎明期。当時から社内では「時代はモバイルファーストだ！」と言われてはいたけれど、アプリ版の開発は注力事業ではなかったし、まだまだWebフロントの開発が主流でした。

そこから7年、業界の様子はすっかりと様変わりしました。今やクックパッドではほとんどの新機能がモバイルアプリに優先的に投入されています。開発のスケジュールはアプリ版のリリーススケジュールに沿って組まれ、バックエンドの開発課題も、BFF*3化やOpenAPIの導入など、モバイル開発を意識したものに変化しました。

退職時に、「そういえば昔はモバイルファーストとか言ってたなあ」と思い出したけど、いつのまにか当たり前になり、言われることはなくなったとしみじみしております。

自分だけの力と言うつもりはなく、メンバーの協力や、業界の変化といった要因も大きいけれど、ここに至るまでにわりと寄与できたのではないでしょうか。

なんでやめたの？

「やりきったから！」というのは大きかったです。仕事がなくなったかと言えば、他にもSwift ConcurrencyやSwiftUIなどの新しい開発手法の推進、既存ツールの更なる汎化や、通信のGraphQL化、その他無数に積み残した細かなissueの改善など、まだまだやらないとならない課題は無数に残っています。

とはいえ、個人的にはすでに大きい仕事をやりきった気持ちがしており、ここ1年ほどは正直結構ダレていたという感覚は否めません。

働き方の変化もありました。コロナ禍はもちろん、昨年、職場が横浜に移転したことで、チームメンバーが集まりにくくなったり、移転や経営の注力事項の変化などによる社内メンバーの入れ替わりで、空気感の変化も感じました。

長く所属した組織なので、離れがたい気持ちはあるけれど、変化の激しいこの業界、定年まであと30年居続けるということはありえないだろうし、まあここらが潮時なのかなと。

これから何をやるの？

本日よりLINE株式会社DXチームにジョインしました！LINEアプリのビルド高速化や開発環境改善をやっていきます！！！ pic.twitter.com/cSs7uBZVXd
— giginet (@giginet) 2022年7月15日

LINE株式会社のディベロッパーエクスペリエンス(DX)開発室でLINEアプリの開発基盤の改善をしていきます。 ObjCの撲滅など、クックパッドではすでに達成できたことをもう一度やっていく必要がある部分もありますが、前職では取り組みきれなかった、ビルドパイプラインの改善や、リモートキャッシュ化など、世界有数の大きなアプリ向けのスケールの大きい問題をなんとかしていければなと思っています。

前職と比べ、開発人員もコードベースの規模も数倍に。今までは全ての開発者の顔が見えていたけれど、今度は韓国のチームを含め、世界中で1つのアプリを開発しています。新しい環境でもやっていけるか、それともあまりのデカさに尻尾を巻いて逃げ出すことになるのか、今から楽しみにしています。

新しい職場の感想

まだ入社して1週間ほどですが、早くも小さなことから改善に着手することができて、これからの仕事にわくわくしています。

新しい職場で何より最高なのが裁量労働制になったことです。これは本当に良い。マジで良い。僕の中では、労働の仕方が大きく変わり、パラダイムシフトとも言える変化でした。本当に帰りたいときに帰って良いのか？って心配になって未だに慣れない。

今までは、1日8時間の刑期を全うするために、どうやって乗り越えるかと、グダグダ働くことに無駄なリソースを割いていたけれど、時間を気にしなくて良くなったおかげで、とても集中して働くことができています。やる気が出ない日はさっさと上がってしまえばいいわけだし。

今までのフルフレックス制では、月にあと何時間働かないとと意識するのが何よりも辛かった。入社前は、裁量労働でちゃんと成果を出せるのか？と懐疑的だったけど、今のところは自分のペースで働けそうで、とても良い変化となっています。

反面、細かなツールの使い勝手や、業務フローに慣れなかったり、前職の方がより洗練されていたなと感じることはもちろんあります。大きな組織で、多数の人を巻き込んで業務環境を改善していく難しさはとても理解できるので、当事者意識を持っていきたい気持ちはある。

また、今までは裁量があり、わりと自由に業務上の意思決定をできていたけど、新しい職場では、どこに話を通せば良いかわからなかったり、業務把握のためにまだまだ難しいという、転職後特有のもどかしさを早くも感じています。そもそも、新卒以来初めての転職なので、これはどこに行っても起きていそうな問題だけど･･････。

転職先で前職の不満を言い続けているのも、逆に「前職ではこうだったのに」とか言い続けてるのも、両方ともダサいなあという気持ちがあるので、「まあ両方いいところも悪いところもあるよね」以上では無いかなと思いますし、どちらの会社も「最高！！！」と言えるようになっていきたい。