iOS向けMastodonクライアント「iMast」を作った話

この記事はMastodon Advent Calendar 2017 - Adventarの1日目の記事です。 私のアカウントは@rinsuki@mstdn.maud.ioです。

私は「iMast」というiOSバイス向けのMastodonクライアントを作っています。 今回の記事は、iMastを知らない人のための簡単な説明と、iMastを開発した理由、開発中に苦労したことなどを書きます。

iMastとは

iMastは、上でも書いたようにiOSバイス(iPhone, iPad, iPod Touch)向けのMastodonクライアントで、私個人が趣味で開発をしています。 App Storeへの公開にあたっては、合同会社プロ生さまの以下の制度を利用させていただきました。

iMastは、iOSヘビーユーザー向けと呼ばれるいくつかのTwitterクライアント*1に影響されつつも、iOSらしさがある以下のようなUIを持っています。

f:id:rinsuki:20171130215749p:plain f:id:rinsuki:20171130220336p:plain f:id:rinsuki:20171130220442p:plain

App Storeのページはこちら。

開発をはじめるまで

時は2017年4月。ちょうど ニコニコ超会議2017 の前ぐらいからnullkalさんが運営する mstdn.jp(旧mastodon.nil.nu、4月11日に公開したが4月15日にさくらクラウドへの移行のためデータ消去)ピクシブ株式会社の運営する Pawoo(4月14日公開) 、株式会社ドワンゴの運営する friends.nico(4月19日公開) などのインスタンスを筆頭に第一次Mastodonブームが来ていました。

そのころは、スマホMastodonクライアントはiPhoneであれば AmaroqAndroidであれば Tusky しかないような状態でした。 私はAndroid端末を所持しておらず、iPhoneを使っているので、必然的にAmaroqを利用することになりました。

しかし、当時のAmaroqは今のAmaroqとは違い、マルチアカウントに対応していませんでしたし、その他にも以下のような欠点がありま(す|した)。

  • UIが英語だけだった(使えないレベルではない)
  • CWが設定されたトゥートを表示する際、CWで隠されている内容ぶんだけ高さが取られていた(よく長文を隠すためにCWが使われていたが、この仕様だと隠されている長文の分だけ高さがあったため、非常に不便でした。時には投稿が一画面で収まらないこともありました)
  • ログインを変な方法で実装していることにより、friends.nicoの「ニコニコアカウントでログイン」機能を始めとしたインスタンスの独自実装による他サービスでのOAuthログイン機能が正しく動作しなかった *2
  • せっかくOAuthで認証するのにSafariで認証画面を表示せずWebView内でログインさせている
    *3
  • 画面上に表示できるトゥート数が少ない *4

このような欠点を踏まえ、「いっそのこと自分でクライアントを作ってしまえばいいのではないか」と考え、iMastの開発に取りかかりました。

開発中

iOSアプリの開発はほぼ初めて*5で、Mastodon APIだけでなくSwiftやiOSのUIKitにも詳しくなかったので、かなり苦労をしました。具体的には:

  • そもそもMastodon APIでどうやって認証すればいいのかわからなかった(Amaroqのリクエストをこっそり見てみたけどわからなかった、人から聞いて解決)
  • Mastodon APIが返す投稿内容がHTML(リッチテキストを表示する物にHTMLをパースする機能があったのでそれで解決)
  • なぜかTLのスクロールがガクガクだった(投稿のviewが画面外に出ると破棄されていたため。viewをキャッシュすることで解決)

などです(記憶がもうないのでコミットログから推察しました)。

また、開発も中旬にさしかかった6月ころからiOSアプリのβ版が配信できる「TestFlight」というサービスでベータ版の配布を開始しました。 βテストに付きあってくださっている*6一部の imastodon.netmstdn.maud.iofriends.nico のみなさん、ありがとうございます。そして、これからもよろしくお願いします!

そして公開

私はアイドルマスターシンデレラガールズというゲームが大好きなのですが、その中で私が担当*7している「渋谷凛」というアイドルの誕生日(8月10日)にリリースすることを当初から決めていました。

8月1日にリリース版を提出して、何回かリジェクト→修正をしたあと8月10日の昼ごろに無事リリースされました。

これからリリース日を決めて新規アプリを出す場合、何回かリジェクトされる事も考えて二週間前にはリリース版を審査に通しておくといいかもしれません(かなりギリギリで、リリース日の昼にやっと審査が通りました)。

公開後のアップデート

リリース日はすべてアイドルマスターシリーズの担当or推しの誕生日にしています。過去何度か間にあわなくなりそうになりましたが、なんとか守れています。

リリース日 バージョン番号 誕生日のアイドル
8/10 2.0(初版) 渋谷凛/五十嵐響子
8/27 2.1 森久保乃々
9/5 2.2 北条加蓮
9/16 2.3 神谷奈緒
10/27 2.4 鷺沢文香
11/12 2.5 城ヶ崎美嘉
12/1 2.6 本田未央

という順番でリリースをしてきました。 2.4以降のリリースノートはGitHubリポジトリのReleasesApp Storeで確認できます。

一番苦労したアップデート: ピン留めトゥートの表示

Mastodon 1.6からピン留めトゥートが実装されて、iMastでもピン留めされたトゥートの表示に対応したのですが、ピン留めトゥートを取得するAPIがこれまたひどいものでした(そして未だに改善されていません)。

まず、あるアカウントが投稿したトゥート一覧は/api/v1/accounts/アカウントID/statusesで取得できるのですが、ピン留めトゥートはアカウントのトゥート一覧を取得するAPI?pinned=1というパラメータを付けて取得する仕様になっています。 しかし、1.6以前のインスタンスでピン留めトゥートを取得しようとすると、そのパラメータが無視され、アカウントの普通のトゥート一覧が返ってくるのです。また、それをAPIレスポンスから判断する方法はありません

そのため、実装する際に、/api/v1/instanceから得られるバージョンをパースして1.6rc1以上だったらピン留めトゥートを取得する処理を書く必要があり、実際に書きました

ちなみに、Pawooの独自拡張の方のピン留めトゥートはちゃんとエンドポイントが分かれています。なぜエンドポイントを分けなかったのか...

Open Source 🎉

正確にはまだライセンスが決まっていない(いつになったら決まるんだ)のでオープンソースと言えるかは微妙ですが、iMast 2.4からGitHubソースコードを公開しています。 汚くて非効率なコードばかりだと思いますが、興味があればどうぞ。

おまけ: iMast 2.6、本日9時リリースです

今回は添付画像のサムネイル表示の実装が目玉です。 多くの人から、iMastで一番欲しいと言われている程度には欲しいと言われていた機能で、私自身もずっと実装したかったのですが綺麗な実装の仕方が思いつかず、最近やっときれいな実装の方法がわかったので今回ついに実装できました。 リリースノートはGitHubリポジトリのReleasesやApp Storeで確認できます。


明日は私が居候しているMastodonインスタンスimastodon.netの管理人、フサギコさんです。

*1:TheWorld, hel2um等

*2:その変な実装の影響でMastodon2.0のインスタンスでログインできなくなり、その対応が行なわれた結果普通の方法でログインできるようになったのですが、それはまた別のお話

*3:悲しいことに、現在iOS App Storeで公開されているMastodonクライアントの半数程度がWebView内でログインをさせています。OAuthの認証画面はできるかぎりアプリ内WebViewでなくOSのデフォルトブラウザを使って表示するべきです。その方がアプリの信頼等にも繋がります

*4:私はiPhone 5sを使っているのですが、iPhone 5sの画面サイズではとくにつらかったです

*5:実を言うとMacを買った直後(去年の今ごろ)に身内向けのSNSクライアントの制作にトライした時期もありましたが、挫折しました

*6:βテストは今でも継続中で、App Storeでリリースする前のバージョンをテストしていただいています

*7:いわゆる「推し」のようなもので、アイドルマスターは数あるアイドルの中から自分でプロデュースしたいアイドルを選択してプロデュースする、というゲームなのですが、自分がその中でプロデュースしているアイドルを担当アイドル、と呼ぶ文化があります。私もちゃんと説明できるわけではないので、詳しく知りたければGoogle等で検索してみてください