みずぴー日記

月に行こうという目標があったから、アポロは月に行けた。飛行機を改良した結果、月に行けたわけではない。

🐙Githubブラウザ for iOS11

iOS11で追加されたFilesアプリから、Githubレポジトリを見るための拡張を作った。 AppStoreから入手できる。

OctoEye

OctoEye

  • HIROKI MIZUNO
  • Productivity
  • Free

Github->Octocat->Octopusという連想で、OctoEyeという名前にした。

⭐️使い方

OctoEyeをインストール・初期設定をすると、FilesのLocationsにGithubが追加される。

f:id:mzp:20170913210709p:plain

ここからレポジトリの内容をできる。

f:id:mzp:20170913211021p:plain

さらに、Textasticといった別アプリから開くこともできる。 ただし、保存はサポートしていない。

f:id:mzp:20170913211049p:plain

📦ソースコード

Githubブラウザなので、Githubに置いてある。

http://github.com/mzp/OctoEye

🎨デザイン

Sketch

最近Sketchを買ったので、事前にデザインを描いた。

f:id:mzp:20170913220733p:plain

今までは適当な紙に落書きするだけだったが、Sketchで描くと考慮漏れに気付けたり、単純に楽しかったりしてよかった。

アイコン

アイコンは最初いらすと屋のタコを使い、途中で自分で描いたのに差し替えた。

f:id:mzp:20170913212158p:plain

GithubなのでOctocatを使いたかったが、そのものを使うわけにはいかないので、一部だけ+シルエットにした。 猫耳だけを拡大したバージョンも作ったが今ひとつだったので段ボールバージョンを採用した。

f:id:mzp:20170913212447p:plain

ウォークスルー

初回起動時に出すウォークスルーを作った。 これは結構大変だった。

EAIntroViewの動きの確認。

iPadProで下書きをした。

f:id:mzp:20170913213039p:plain

雰囲気が分かったのでSketchでいろいろ描いて、デザインを検討した。

f:id:mzp:20170913213411p:plain

実装した。

f:id:mzp:20170913213450p:plain

🛠開発

Github Graphql

Githubから情報を取得するために、GraphqlAPIを利用している。 FileProviderExtensionではネットワークアクセスの回数を減らしたかったのでちょうどよかった。

ただバイナリデータを取得することができなかったので、そこだけはREST APIを使っている。

ReactiveCocoa/ReactiveSwift

レポジトリ追加画面などではReactiveSwiftを使っている。最初はRxSwiftを使おうとしたが、@にReactiveSwiftのほうが語彙がSwiftっぽいと言われたので、ReactiveSwiftにした。

イベントをmap等で加工するのは分かるが、画面上の要素とバインドする部分がよく分かんないまま書いていた。

スクリーンショット

AppStoreに提出用のスクリーンショットはfastlaneのsnapshotとframeitで生成した。

snapshotで各デバイス用のスクリーンショットを準備し、frameitでiPhone/iPadの枠をつけ上部に文字を入れた。

Xcode9からUITestが複数アプリに対応したので、Filesアプリの撮影も自動化できた。(がMetadata Rejectになったので、このスクショは削除した)

f:id:mzp:20170913220059p:plain

その他

  • CIはTravisCIを使った。 Xcodeの新しいベータが出て3〜4日でTravis側も更新されててすごかった。
  • ベータ版のOSにはスクリーンショットを外部に出せない制約が付くので、プルリクエストに画像を貼れなかった。

🚀今後の予定

  • Filesにあるタグ機能やお気に入り機能をサポートしてないのでやりたい。
  • masterブランチ以外は見れないので、切り替え機能をつけたい。
  • 書き込み機能もつけたいが、コミットメッセージをどうするかが難しいと思っている。