この記事は、現在進行中のチーム開発の現状とこれからを公開するものです。
※継続的にアップデートをしていきます。

進捗度メーター：　0% ⬛︎⬛︎⬛︎⬛︎⬛︎⬛︎⬛︎_____ 100%

作成中のアプリの概要について

　現在は、サイバーエージェントのインターンで知り合った友人と、自分を含めて4人で「投票とか統計がとれたりできるSNS」を作成しています。

作成背景としては、以下のようなことがあります。

• twitterやinstagramには投票機能がすでに存在しているが、その他の情報に埋もれてしまい、多くの票を得ることができない

• ユーザーが知りたい情報が知ることができる場所（アプリ）を作ることで、同じように自分が知りたい情報を集めたい人が来る為、上記ものとは異なり、多くの票が集まり、ユーザーどうして知的好奇心の充足が可能となる為。

このような理由により我々はこのアプリの作成を始めました。

技術スタック

　このアプリはiOSのみに対応予定で、Swiftで作成しています。
ライブラリは以下の通りです。（一部省略）
UIKit / SwiftUI / Firebase / XcodeGen / SwiftGen / SwiftLint / RxSwift / RxRelay / SnapKit / Nuke / Charts(github) / Alamofire …

　今回の開発で工夫した点は、SnapKitを使用しているという点から明らかですが、StoryBoardを使用しない開発を行なっております。またその際にも逐一シュミレーターで実行をしてしまうと、ビルド時間により開発効率が下がるほか、以下の方法ですとさまざまな状態のView（今回のアプリで言うと、投票前・投票後）を一度で確認ができるため、UIKitの開発でもXcodePreviewsを用いた開発方法をとっています。
この方法については株式会社メルカリのtechBlogに詳細があります。

　また、Githubから取って来ているChartsは、投票後に自分の点数や順位等の回答が全体の回答の中でどれほどの立ち位置かが分かるような棒グラフを作成する場面で使用をしています。

現状

　私はこれまで、UIについては「VS型」と「統計型」と呼んでいるものを作成しました。
まず、VS 型のUIについては写真のようなものです。

　実装的には、左右どちらのボタンがタップされているかをRxSwiftで判定をし、データの割合に合わせて、SnapKitの.updateConstraintsでwidthを変更し、UIView.animateで動かしています（実際の動作にはwithDuration: 1.0がついているため、ジワーと動くような、まさにインスタグラムのそれを同じような動きがあります）。
　このUIの作成で苦労した点は、animateの後にタスクが切れた状態で再投票ができるようになってしまっては正しい票数ではなくなってしまうため、回答をしたと言う情報によりView全体を管理している点です。ここについては、dataにInt?型の変数を持たせ、回答後にそこに左右どちらのボタンをタップしたかを入れて保存することで、解決しました。
　2種類の状態があるアプリケーションを作成するのが初めてであった為、とても苦労しました。

次に、統計型は以下のようなものです。

　統計型も、インスタグラムにあるものをイメージして作成しました。回答前のUIについてはUISliderがあり、上にslider.valueを表示するラベルをつけました。この吹き出しについては、GitHubにはいくつかのライブラリがありますが、どちらもあまり更新がされておらず、長い目で考えた際に後の運用・保守が困難になることから、それらのライブラリの使用を避け、自作をすることにしました。
　また、回答後は、自分の値をデータに入れて、すべてのデータを上記に述べたCharsを使って、棒グラフを作成しています。
　このUIの実装で苦労した点は、グラフの幅を決め、データを集計するところです。前提として、このUIではユーザーがまとめる幅や最大値/最小値を決定できるようにしています。つまり、データの数が一定ではない・幅と最大値/最小値によっては端数が発生する、それに合わせてラベルも作らないといけないと言う問題がありました。
　この解決方法については、paizaの実行環境を使って、想定できる入力に対して、期待する出力ができるような関数を作るためにひたすらTry&Errorを繰り返しました。結果、以下のような関数になりました。

1. 最大値/最小値・まとめる幅の入力によって、[[1, 10], [11, 20], [21 , 30]…[91, 100]のような２次元配列を作成　→この配列を利用して汎用ラベルも作成

2. 上の配列に合わせて、データをfor文で回して当てはめていく

3. それぞれの幅における数とそれぞれの値のラベルを返す

　この関数によって、すべての想定できる入力に対して正しく動作するように実装を行うことができました。
このUIについてその他に工夫した点としては、汎用ラベルも自作した点です。Chartsにも汎用のラベルが付けられる機能がありましたが、1つの色についてしか記述ができない（正確には🟦🟧←これを使うとできましたが、避けました）ため、UIViewを別で作成しました。

その他のUI（自分以外が 実装した/実装中 もの）

追記

・投票作成画面の実装を終えました。
具体的には上記のUIで用いるデータがぞれぞれ異なるため、それぞれに対応したUIViewを、６つのCellを配置してあるCollectionViewのタップアクションによってViewに追加されるような形で実装を行いました。

　アンケート型やクイズ型は、ある議題や写真について聞きたい情報と数をユーザーが設定できるようなものです。この「数をユーザーが設定できる」と言うところで少し苦戦しました。ここはデフォルトでStackViewにTextFieldが2つ入っていて、追加ボタンを押すとStackViewに新しいTextFieldが入るような、カスタムViewを作成することで解決できました。

またUIViewからUIImagePickerControllerを表示する点でも少し苦労をしましたが、UIViewのObservableをViewControllerでsubscribeするような形で実装を行いました。(詳細はこちら)

また、quiz型については、ユーザによって並び方を変化させたいと考えたため、配列ではなくSetで実装を行いました。また、本家インスタグラムのクイズのように入力後にUITextFieldと一緒にStackView(horizontal)に入っているボタンをタップしてどれが正解かを入力するような機能も実装中です→実装しました

（徐々に追加していきます）

チーム開発を通しての学びとこれから

　私は、このチーム開発が人生で初めての経験です。これまではずっと寂しく個人開発をやって来ましたw。チーム開発を始めてからずっと感じていることは、成長速度がめちゃめちゃ速いという点です。
個人開発では、何かのエラーや実装面での壁があった場合は、自力かネットの力で解決するしかありませんが、チーム開発の場合はそれにプラスで相談ができます。ここでいう実装面とはコードの書き方だけでなく、UIの設計についてもです。個人開発では「ここはこれでいっか」のような形になることがしばしばありましたが、チーム開発の場合は相談をし全体の満足いくようなものにするべきであるので、それは許されません。しかしそれによって自分が思いもつかないようなレイアウトや設計を知ることができています。またコード面では、レビューをする/されると言う点がとても大きいと感じています。私はまだあまりレビューをする側にはなれていませんが、多くのレビューを受けることによって、自分のどこの記述が良くないのか、このアプリの場合は、自分がどんなユースケースを想定できていないのかなど多くのinputがあると思います。これらは、個人開発では絶対に経験ができないことであると感じているので、本当に素晴らしい仲間に出会えてこうして開発ができていることをありがたく感じ、同時にもっと技術力を上げて、貢献したいとも考えています。

　また「これから」については、このアプリは必ずリリースします。
そして、継続的な運用を行うことも考えています。
このアプリがひとまず完成した後は、さらに別アプリを作成する話も既にあるため、そちらにシフトしていきます。
これからも頑張ります！