🐙Githubブラウザ for iOS11
iOS11で追加されたFilesアプリから、Githubレポジトリを見るための拡張を作った。 AppStoreから入手できる。
Github->Octocat->Octopusという連想で、OctoEyeという名前にした。
⭐️使い方
OctoEyeをインストール・初期設定をすると、FilesのLocationsにGithubが追加される。
ここからレポジトリの内容をできる。
さらに、Textasticといった別アプリから開くこともできる。 ただし、保存はサポートしていない。
📦ソースコード
🎨デザイン
Sketch
最近Sketchを買ったので、事前にデザインを描いた。
今までは適当な紙に落書きするだけだったが、Sketchで描くと考慮漏れに気付けたり、単純に楽しかったりしてよかった。
アイコン
アイコンは最初いらすと屋のタコを使い、途中で自分で描いたのに差し替えた。
GithubなのでOctocatを使いたかったが、そのものを使うわけにはいかないので、一部だけ+シルエットにした。 猫耳だけを拡大したバージョンも作ったが今ひとつだったので段ボールバージョンを採用した。
ウォークスルー
初回起動時に出すウォークスルーを作った。 これは結構大変だった。
EAIntroViewの動きの確認。
アプリ起動直後にでてくるウォークスルーを作る練習してるけど、かわいい画像を挟んだら急に体験の質が向上した。 pic.twitter.com/TxG5HG28jJ
— mzp (@mzp) 2017年8月5日
iPadProで下書きをした。
雰囲気が分かったのでSketchでいろいろ描いて、デザインを検討した。
実装した。
🛠開発
Github Graphql
Githubから情報を取得するために、GraphqlAPIを利用している。 FileProviderExtensionではネットワークアクセスの回数を減らしたかったのでちょうどよかった。
ただバイナリデータを取得することができなかったので、そこだけはREST APIを使っている。
ReactiveCocoa/ReactiveSwift
レポジトリ追加画面などではReactiveSwiftを使っている。最初はRxSwiftを使おうとしたが、@banjunにReactiveSwiftのほうが語彙がSwiftっぽいと言われたので、ReactiveSwiftにした。
アイマスライブの合間にReactiveSwiftを教えてもらってたけど、プロデューサーの発音に関する話がよかった https://t.co/Xg9Hh6uJE9
— mzp (@mzp) 2017年7月31日
界隈の流行りに乗ってプロダクトに入れてみようと今週はReactiveSwiftやってたんだけど，Producer=「プロデューサー」，SignalProducer=「シグナルプロデュー↑サー↓」，小日向美穂「プロデュー↑サー↓」という知見を得た
— ばんじゅん🍓 (@banjun) 2017年5月24日
イベントをmap等で加工するのは分かるが、画面上の要素とバインドする部分がよく分かんないまま書いていた。
スクリーンショット
AppStoreに提出用のスクリーンショットはfastlaneのsnapshotとframeitで生成した。
snapshotで各デバイス用のスクリーンショットを準備し、frameitでiPhone/iPadの枠をつけ上部に文字を入れた。
Xcode9からUITestが複数アプリに対応したので、Filesアプリの撮影も自動化できた。(がMetadata Rejectになったので、このスクショは削除した)
その他
- CIはTravisCIを使った。 Xcodeの新しいベータが出て3〜4日でTravis側も更新されててすごかった。
- ベータ版のOSにはスクリーンショットを外部に出せない制約が付くので、プルリクエストに画像を貼れなかった。
🚀今後の予定
- Filesにあるタグ機能やお気に入り機能をサポートしてないのでやりたい。
- masterブランチ以外は見れないので、切り替え機能をつけたい。
- 書き込み機能もつけたいが、コミットメッセージをどうするかが難しいと思っている。
