見出し画像

「KIOKU」開発チームのテックリードがアプリの技術的なことを解説します


はじめに

この記事では、アプリ「KIOKU」の開発チームを統括しているテックリードが、技術的な視点からアプリを解説していきます。個人でアプリを作ってみたいという大学生・社会人エンジニアの方は参考にしてみてください!
アプリの内容については、最低限必要な内容は紹介しますが、詳細に知りたい方はこちらの記事を読んでみてください。

アプリ全体の概要

アプリ「KIOKU」は「実際にその場所に行くことに価値を生み出す」をコンセプトに、これまで300人以上のユーザーを獲得してきました。アプリとしてもリリース以降継続的に開発を進め、これまでに8回のアップデートを行い、現在はv1.2.4を展開中となっております。

開発言語

開発言語については、Flutterを利用しています。
FlutterはGoogle社が提供するフレームワークです。通常はAndroidはKotilin・iOSはSwiftなど、プラットフォームごとに開発する言語が変わってしまいますが、Flutterを利用することでAndroid・iOSなど複数のプラットフォームを一気に作ることができます。

Flutterはほかにも嬉しいことがありました。私は以下のような点がメリットだと思います。

  • ホットリロード(コードを書き換えて保存するとすぐに再読み込みしてくれる)がある。これによって細かいデザインの調整などがとてもやりやすかったです。

  • FlutterではDartという言語を利用して開発を行うのですが、これがJavaScriptライクな言語で書きやすかった。Dartの文法を学習するハードルはだいぶ低かった気がする。

  • ライブラリが充実している!やりたいことが実装できるライブラリがだいたい存在していていつもありがたく利用させてもらっています。

バックエンド・データベース

バックエンドやデータベースにはFirebaseを利用しています。Firebaseは、Google社が開発している、モバイルアプリケーションのためのバックエンドを提供するMBaaSです。

私たちのアプリではDBのほかに、バックエンドとして以下のようなサービスを利用しています。

  • Firestore Database: NoSQLのDB

  • Authentication: 認証サービス

  • Storage: メディアファイルのストレージ

  • Dynamic Links: アプリ内のコンテンツに飛ぶリンクを作れる(後述します)

  • Crashlytics: アプリのcrashやエラーを検出・集計

  • In App Messaging: アプリ内でお知らせ的なポップアップを表示できる

  • App Distribution: 開発中のアプリをテスターに配布できる

他にもリアルタイム性に特化したDBである「Realtime Database」、サーバレスで処理を実行できる「Functions」など便利な機能がたくさんあります。私たちも開発しながら「こんなサービスあるんだ!これ使えそうだね」といった形で勉強しながらサービスに組み込んでいます。

手のかかっている実装を振り返る

ここからは実装を進めるうえでとても手のかかった機能を3つピックアップして紹介していきます。

1. キオクを「開ける」機能

キオクを「開ける」手順の概要

キオクを「開ける」機能はこのアプリの核となる機能で、最も重要であるといっても過言ではありません。私たちはこの機能をどう実装するかかなりの時間を費やして検討しました。
距離制限については、マーカー(Google Map上で場所を指し示すピンの様なもの)をタップした時に、現在位置の座標とマーカーの座標との距離を計算し、あらかじめキオクごとに定められた制限距離以内であればキオクを開けることができるという仕組みにしました。制限距離以内に入ったことが分かりやすいように、マーカーの周囲に円を描画し、円の中であればキオクを開けることができるという様にしました。
「キオクを開ける」ボタンを押したらすぐに見られる、というのも面白みがないということで、キオクを開けるために簡単なタスクを挟んでいます。現状は「ボタン連打」「ボタン長押し」「(事前に記憶に設定された)合言葉」の3種類ですが、今後様々なタスクを追加していきたいと思っています。

今後の課題としては、位置情報を取得してからマーカーまでの距離を計算するのに少し時間がかかってしまっているという点です。これにより、高層ビルの中や人の多い場所など、位置情報の精度が悪いところでUXがかなり悪くなってしまっています。
これに関してはコードの方で位置情報の誤差をどの程度許容するかを設定することができ、それを必要以上に高い精度に設定してしまっているのではないかと思っているので、その辺りを調整してより快適な操作感を目指していきたいと思います。

2. サインアップ・サインイン

サインアップ・サインイン機能の概要

アプリのベースとなる、アカウントのサインアップ・サインインの部分も苦労しました。
実装自体はFirebaseの「Authentication」を利用することで、簡単で安全に認証機能を実装することができました。大変だったのはiOSのApp Storeに出す上での審査です。何度もリリースを却下され、その度に修正を加えて再チャレンジした記憶があります。具体的には、以下の様なことを指摘されたと思います。

  • 利用規約やプライバシーポリシーを策定し、サインアップ時に明記した。

  • アプリの機能のうち、アカウントが必要ではない部分(キオクリストの閲覧など)はログインしなくても閲覧できる様にした。

  • Google認証を実装した際は、一緒にApple認証も実装を行なった。

今後の課題としては、「ログインせずに閲覧」機能かなと思っています。現状、アカウント登録なしでも先には進めるのですが、アプリの醍醐味である「キオクを開ける」といったことができなくなっています。これだとこの機能がある意味があまりないと思うので、今後は「1つのキオクリストは保存できる」「3つまでならキオクを開けることができる」といった様に、少しでもお試しできる要素を増やしていきたいと考えています。

3. キオクリストの「共有」機能

キオクリスト共有機能の概要

キオクリストを共有する機能も、地味ではあるが重要な機能であると言えると思います。これがあることで、LINEやXなど他のアプリで「KIOKU」のコンテンツに関するやり取りができますし、リンクをQRコードにすれば対面で会う人に簡単に自分が作ったコンテンツを紹介することができます。
この機能はFirebaseのサービスである「Dynamic Links」を使って実装しました。「Dynamic Links」の特徴的な点は、AndroidとiOSどちらでも、1つのリンクで対応可能なこと、それとアプリを持っていない人にはアプリストアへ飛ばしてくれることだと思います。
私たちはこの「Dynamic Links」を使い、キオクリスト固有のIDをもとにリンクを作成して共有する機能を実装しました。上の画像を見ればわかるかと思いますが、OGP画像まで設定することができています。今後はQiitaやnoteのようにページに応じたカスタムのOGPの設定にも取り組んでいきたいと思っています。
しかし1つ問題があり、残念ながら「Dynamic Links」は2025年8月でサービスの終了が決定しているため、そこまでに代替の実装を考える必要があります。まだ1年以上先のことではありますが今のうちから少しずつ代替を考えていきます。

終わりに

いかがだったでしょうか?
チームでどの様に開発しているかなども、いつか記事にまとめられたらと思います。
この記事を通して少しでもこのアプリに興味を持っていただけたら、下のリンクからぜひインストールをお願いします!
ここまで読んでいただいた方はありがとうございました!

****************************************
iOSでのインストールはこちら
AndroidOSでのインストールはこちら
****************************************

この記事が気に入ったらサポートをしてみませんか?