アクセル×『Interface』編集部特別企画　現場で役立つ！　AI装置やアプリ製作　第六回 AIスマホ・アプリ作り②…学習済みモデルをスマホへ組み込む

出荷用にキュウリが箱詰めされた段ボールを数えて、等級とともに表示するスマートフォン用のアプリケーションを作ります（図1）。

前回（第5回）は出荷数のカウントと等級を表示するための学習モデルを作って精度の評価をしました。今回はそのモデル（ONNXモデル）をスマートフォンへ組み込んで使ってみます。

OSを選ばないアプリ開発環境Flutter

Flutterは、グーグルが開発しているオープンソースのアプリケーション開発フレームワークです。クロス・プラットフォームのアプリケーションを効率的に開発するためのフレームワークです。Flutterを導入することで、iOS、Android、Web、デスクトップ（Windows，macOS，Linux）など、複数のプラットフォーム向けに単一の言語でアプリケーション開発を行うことができます。

Flutterで使用する言語はDartです。Dartは、JavaScript言語の問題点を解決し、より優れたパフォーマンスを発揮しつつ、大規模なプロジェクト用途にも対応できる言語として開発されました。筆者は、JavaScriptやJavaに似ている印象を持ちました。

開発環境の構築

●使用するソフトウェアとスマホ

今回使用した開発環境のバージョンを表1に示します。

▶FlutterとVS Code
WindowsにFlutterの環境を構築します。スマートフォン向けの開発では、Visual Studio Codeの拡張機能としてFlutterプラグインをインストールする方法が推奨されています（注1）。

▶Android Studio
Android端末向けの開発では、Android Studio（注2）も併せてインストールしておくと便利です。AndroidStudioを使用することで、デバッグ用の仮想端末の作成/管理や、実機デバッグに必要となるUSBドライバのインストールなどを簡単に行うことができます。

▶AndroidスマホPixel6
使用したスマートフォンは、Pixel 6 ProのAndroidバージョン15（ビルド番号：AP4A.250205.002）です。
注1：インストール方法，https://docs.flutter.dev/get-started/install/windows
注2：https://developer.android.com/studio?hls=ja

名称	バージョン
Visual Studio Code	1.97.2
Flutter Plugin	3.104.0
Android Studio	Ladybug Feature Drop | 2024.2.2

●ステップ1…プロジェクトの新規作成

Flutterの新規プロジェクトを作成します。作成手順を次に示します。

1. Visual Studio Codeを起動
2. メニューから「View」→「Command Palette」を開く
3. 「flutter」と入力する
4. 「Flutter:New Project」を選択する
5. 「Application」を選択する
6. 「保存先フォルダ」を指定する
7. プロジェクト名を入力する

●ステップ2…依存パッケージの追加

プロジェクトに依存パッケージを追加します。本アプリケーションでは、YOLOXモデルを実行するためのアイリアSDKと、カメラを使用するためのパッケージを追加します。pubspec.yamlを開き30行目のdependenciesに、（リスト1）に示す内容を追加します。

dependencies:
  flutter:
    sdk: flutter

  ailia:
      git:
        url: https://github.com/axinc-ai/ailia-sdk-flutter.git
        ref: main
  camera: ^0.11.1
  path_provider: ^2.1.5
  image: ^4.5.2

（リスト1）SDKの追加方法（pubspec.yaml）

●ステップ3…Android Gradleの設定

FlutterでAndroidアプリをビルドするためには、Android Gradle Pluginを8.2.1以上にする必要があります。また、アイリアSDKを使うには、Android NDKのバージョンが27である必要があります。これに対応するため、次の3つの変更を加えます。

• android/settings.gradleを開き、21行目のcom.android.applicationのバージョンを8.8.0に変更する
• android/gradle/wrapper/gradle-wrapper.propertiesを開き、5行目のURLの末尾のファイル名をgradle-8.10.2-all.zipに変更する
• android/app/build.gradleを開き、11行目のndkVersionを27.0.12077973に変更する

●ステップ4…モデルをassetsへ追加

前回ダウンロードしたONNXモデルをアプリケーションへ追加します。プロジェクト・フォルダに、assetsという名前のフォルダを作成し、フォルダにmodel.onnxを配置します。次に、pubspec.yamlの72行目のassetsに、（リスト2）に示す内容を追加します。

 assets:
    - assets/model.onnx

（リスト2）ONNXモデル・ファイルの追加（pubspec.yaml）

推論の実行

アイリアSDKのAPIを使って、YOLOXモデルの推論を実行するためのコードを（リスト3）に示します。

// ailia SDKでYOLOXモデルを実行
import 'dart:io';
import 'dart:typed_data';
import 'package:ailia/ailia.dart';
import 'package:ailia/ailia_model.dart';
import 'package:flutter/services.dart' show rootBundle;
import 'package:path_provider/path_provider.dart';

class YoloX {
  AiliaDetectorModel? _model;
  final List<String> category = ["2L", "L", "M", "S", "2S", "UNKNOWN"];

  void open() async {
    // 1.一旦assetsのモデルをファイルに保存…①
    final byteData = await rootBundle.load('assets/model.onnx');
    final tempDir = await getTemporaryDirectory();
    final file = File('${tempDir.path}/model.onnx');
    await file.writeAsBytes(byteData.buffer.asUint8List(
      byteData.offsetInBytes,
      byteData.lengthInBytes,
    ));

    // 2.保存したファイルを読み込む…②
    _model = AiliaDetectorModel();
    _model!.openFile(
      file.path,
      networkImageFormat: AILIA_NETWORK_IMAGE_FORMAT_RGB,
      numCategory: 6,
    );
  }

  List<AiliaDetectorObject> run(Uint8List data, int width, int height) {
    /* 物体検出モデルを使って推論を実行する…③
        data  : 画像データ(RGBの1次元配列)
        width : 画像の横幅
        height: 画像の高さ
    */
    List<AiliaDetectorObject> ret = _model!.run(data, width, height);
    return ret;
  }

  void close() {
    _model!.close();
  }
}

（リスト3）アイリアSDKを使った推論の実行（yolox.dart）

●モデルをファイルに書き出す

アイリアSDKでは、モデルはファイルから読み込む仕様となっているため（リスト3の②）、アセットに格納したモデルをいったんファイルに書き出す処理を追加しています（リスト3の①）。

●推論する

推論を実行するには、AiliaDetectorModelクラスのrunメソッドを使用します（リスト3の③）。このメソッドの引数には、画像データ、画像の幅、高さを指定します。また、画像データは8ビットのRGB形式の画像データを、1次元配列に変換したものを渡す必要があります。推論結果は、AiliaDetectorObjectの配列として出力されます。アイリアSDKの詳細については、公式ドキュメントを参照してください。

プログラムのデバック

●処理の流れとプログラム

出荷数カウント・アプリケーションの基本的な処理フローを（図2）に示します。Flutterでのカメラ制御は、cameraパッケージ（注3）を介して行われます。（リスト4）には、写真撮影時の処理を示します。（図2）の「写真を撮影する」から「推論実行」までの処理を、撮影のタイミングで実施しています。
注3：https://pub.dev/packages/camera

●実機によるデバッグ手順

作成したアプリケーションを、実機端末にインストールします。Android端末に、開発中のアプリをインストールするためには、端末を開発者モードにしてUSBデバッグを有効にする必要があります。USBデバッグを有効にする手順は次に示します（Androidバージョン15，Pixel 6の場合）。

1. 設定を開く
2. 「デバイス情報」→「ビルド番号」を7回連続でタップする
3. 開発者モードが有効になったことを確認する
4. 設定から「システム」→「開発者向けオプション」を開く
5. 「開発者向けオプションを使用」がONになっていることを確認
6. 下にスクロールし「USBデバッグ」をONにする
7. さらに下にスクロールし「デフォルトのUSB設定」を開く
8. 「ファイル転送/Android Auto」または「PTP」にチェックが入っていることを確認する

これで、PCとAndroid端末をUSBケーブルで接続したときに、デバッグ・モードでの接続が可能になります。

実際に使ってみた

●カウントは問題ないが等級の識別には課題が残る

作ったアプリケーションを実際に使ってみました（図3）。段ボール箱のカウントは、問題なく検出できているようです。一方で、等級の識別については、段ボール箱が小さくなるほど精度が低下してしまいました［図3（c）、図3（d）］。今回は転移学習を採用したため、入力する画像データの解像度は640×640でした。しかし、この解像度では、遠くから段ボール箱を撮影した場合、等級の表示が人間の目でも認識できないほどに小さくなってしまいます。等級識別の精度を向上させるには、より高解像度の画像データを入力する必要がありそうです。解像度1280×1280の画像データが十分に集まれば、改めて高解像度で学習を試みたいと考えています。

●実行速度は実用に耐える

写真撮影から結果表示までの速度は、10回測定して平均0.56秒でした。この程度の速度であれば、実用に全く支障はないと考えますが、画像を高解像度にした場合やYOLOX-lのような、より大きなモデルを使用する場合などは、改めて検証する必要があります。