【ITニュース解説】Shipaton: Do0ne Build Journal #2 - Using Do0ne in Practice & Custom Loading Screen with Lottie Icons

Day 2の作業は、24時間カフェでのコーヒー一杯から始まった。前日に基本的な機能を組み込んだDo0neというアプリの、実際の使用を進めることでプロジェクトは継続された。このShipatonという開発イベントにおけるDo0neアプリの目標は、最終的にアプリをローンチすることにある。その目標達成のため、必要なタスクを一つずつ登録し、消化していく作業が行われた。これは、開発者自身が実際のユーザーとしてDo0neのワークフローを検証する意味も兼ねていた。

これまでのアプリ開発タスクの整理方法では、あらゆる作業内容を書き出し、優先順位をつけ、期日を設定するというプロセスを辿っていた。しかし、この方法はしばしば面倒で疲れるものだった。Do0neを実際に使ってみると、その体験は大きく異なっていた。最も顕著な違いは、一度に一つの、目の前のタスクのみを登録すれば良いという点にあった。これにより、開発者は他の多くの未完了タスクに気を散らされることなく、現在の作業に集中しやすくなった。

アプリの画面中央には、現在取り組むべきタスクが大きく表示される。この視覚的な提示は、タスクを迅速に完了させようという強いモチベーションにつながった。さらに、このタスクは開発者自身が最も重要だと選んだものなので、他の保留中のタスクについて心配する必要がなくなる。この安心感は、作業の集中度を高め、効率的な開発を可能にした。従来の一般的なToDoアプリが、多くのタスクをリストアップし、それら全体を管理する設計であるのに対し、Do0neのアプローチは、一度に一つの「今やるべきこと」に焦点を当てることで、ユーザーの集中力と達成感を高めるという、新鮮で異なる体験を提供した。この実践的な利用を通して、Do0neの核となる強み、つまりユーザーが目の前のタスクに集中するのを助ける機能が実際に効果的であることが確認された。

次に、アプリのユーザーインターフェース（UI）の改善として、カスタムローディング画面の実装が進められた。FlutterFlowという開発ツールにはデフォルトのローディングインジケータが備わっている。しかし、このデフォルトのインジケータは、クリックされたボタン上でのみアニメーションを表示するものであった。このため、アプリ全体が現在ロード中であるのかどうかをユーザーが直感的に判断しにくく、また視覚的にもあまり魅力的ではないという課題があった。

そこで開発者が求めたのは、画面の中央に大きく表示され、アプリ全体のデザインに調和する、より洗練されたアニメーションを持つローディングアイコンであった。この要件を満たすために採用された解決策は、外部のアニメーションリソースとFlutterFlowの機能を組み合わせるものだった。

まず、LottieFilesというプラットフォームから、アプリのコンセプトに合った好みのローディングアニメーションがダウンロードされた。LottieFilesは、Webやモバイルアプリで手軽に利用できる軽量なアニメーションファイルを提供しており、開発者が複雑なアニメーションを自作することなく、プロフェッショナルな動きをアプリに組み込むことを可能にする。

次に、FlutterFlow内で「Custom Dialog（カスタムダイアログ）」というコンポーネントが作成された。ダイアログとは、アプリの他のコンテンツの上に一時的に表示される小さなウィンドウのようなもので、ユーザーに情報を提供したり、入力を求めたりするために使われる。このカスタムダイアログの中に、ダウンロードしたLottieアニメーションを表示するためのローディングコンポーネントが挿入された。

このローディング画面を適切に制御するために、「Action Block（アクションブロック）」が設定された。アクションブロックとは、特定のユーザー操作やイベントに応じて実行される一連の処理の流れを定義する機能である。ここでは、処理の開始時にこのカスタムダイアログを呼び出すように設定された。この際、重要な二つのオプションが有効にされた。一つは「Non-Dismissible（非閉鎖可能）」という設定で、これはローディング画面が表示されている間にユーザーが画面のどこかをタップしても、誤ってダイアログが閉じないようにするためのものである。もう一つは「Non-Blocking（非ブロック）」という設定で、これはローディング画面が表示されている最中でも、その裏側で実際のデータ処理やネットワーク通信といった後続の作業が進行できるようにするための設定である。この非ブロック設定により、ユーザーはアニメーションを見ながら、アプリがバックグラウンドで処理を行っていることを認識できる。

これらの設定を組み合わせたロジックはシンプルで効果的である。まず、何らかの処理が開始される直前にカスタムダイアログとしてローディングコンポーネントが表示される。次に、アプリが必要とする実際のデータ処理や準備が裏側で実行される。そして、その処理がすべて完了した後に、表示されていたローディングコンポーネント（カスタムダイアログ）が閉じられるという流れである。この実装により、ユーザーはアプリがロード中であることを明確に理解でき、より洗練されたユーザー体験を提供できるようになった。

Day 2の作業を通じて、Do0neアプリは実際に使われることでその核となる強み、すなわち一度に一つのタスクに集中することを助けるという点が確認された。また、FlutterFlowのデフォルト機能を超え、Lottieアイコンを用いたカスタムローディング画面を実装することで、アプリのユーザーインターフェースが大幅に改善された。この段階で、Do0neは単なる機能の集合体ではなく、より実用的なツールへと進化していく姿がはっきりと見えてきた。

これまでのところ、開発者はDo0neを使って7つのタスクを完了させた。事前に何十、何百ものタスクを詳細に計画し、定義する従来のやり方と比較して、この一度に一つのタスクに集中するアプローチは、心理的な負担がずっと軽く、作業へのモチベーションを高く保てるという感覚を得られた。Do0neが最終的にローンチされるまでに、一体どれくらいのタスクが完了することになるのか、そしてどれほどの達成感を味わえるのか、開発者自身も大きな期待を抱いている。この開発プロセスそのものが、Do0neの有効性を証明する場ともなっている。