Mengintegrasikan Model Kustom ke dalam Aplikasi

1. Sebelum memulai

Dalam Codelab pertama dalam seri ini, Anda membuat aplikasi yang sangat sederhana yang menggunakan Image Labelling untuk mengurai konten gambar. Anda melewatinya dengan gambar bunga aster, dan Anda mendapatkan informasi bahwa bunga tersebut melihat hal-hal seperti kelopak atau langit. Kemudian, di Codelab kedua, Anda beralih ke Python untuk melatih model baru dan kustom yang mengenali lima jenis bunga.

Dalam codelab ini, Anda akan mengupdate aplikasi dari lab pertama dengan model dari lab kedua.

Anda bisa mendapatkan kode sumber lengkap untuk codelab ini dengan meng-clone repo ini. Anda akan melihat sub direktori untuk Android dan iOS. Kode codelab sebelumnya tersedia sebagai ImageClassifierStep1 jika Anda ingin mengikutinya. Kode yang sudah selesai untuk codelab ini tersedia sebagai ImageClassifierStep2.

Prasyarat

  • Anda seharusnya sudah menyelesaikan dua codelab pertama di jalur pembelajaran ini

Yang akan Anda bangun dan pelajari

  • Mengintegrasikan model kustom, yang dilatih di lab sebelumnya, ke dalam aplikasi Android atau iOS

Yang Anda butuhkan

  • Android Studio, yang tersedia di developer.android.com/studio untuk bagian Android lab
  • Xcode, yang tersedia di Apple App Store, untuk bagian lab iOS

2. Mendapatkan Aplikasi Awal

Pertama, Anda akan memerlukan aplikasi dari Codelab Membangun Aplikasi Computer Vision pertama Anda di Android atau iOS. Jika Anda sudah menyelesaikan lab, namanya akan bernama ImageClassifierStep1. Jika tidak ingin menggunakan lab, Anda dapat meng-clone versi yang sudah selesai dari repo

Buka di Android Studio, lakukan update apa pun yang Anda perlukan, dan jika sudah siap, jalankan aplikasi untuk memastikannya berfungsi. Anda akan melihat sesuatu seperti ini:

f3703d45d1332d1d.png

Ini adalah aplikasi yang cukup primitif, tetapi menunjukkan beberapa fungsi yang sangat kuat hanya dengan sedikit kode. Namun, jika ingin bunga ini dikenali sebagai bunga daisy, dan tidak hanya sebagai bunga, Anda harus mengupdate aplikasi untuk menggunakan model kustom dari codelab Membuat model kustom untuk codelab pengklasifikasi gambar Anda.

3. Mengupdate build.gradle untuk menggunakan Model ML Kit Kustom

  1. Menggunakan Android Studio, temukan file build.gradle tingkat aplikasi. Cara termudah untuk melakukan ini adalah di {i>project explorer<i}. Pastikan Android dipilih di bagian atas, dan Anda akan melihat folder untuk Gradle Scripts di bagian bawah.
  2. Buka direktori yang ditujukan untuk Module, dengan nama aplikasi Anda diikuti dengan ‘.app' seperti yang ditunjukkan di sini – (Module: ImageClassifierStep1.app):

8fe1d04b40610047.pngS

  1. Di bagian bawah file, temukan setelan dependensi. Di sana Anda akan melihat baris ini:
implementation 'com.google.mlkit:image-labeling:17.0.1'

Nomor versi mungkin berbeda. Selalu temukan nomor versi terbaru dari situs ML Kit di: https://developers.google.com/ml-kit/vision/image-labeling/android

  1. Ganti ini dengan referensi library pelabelan gambar kustom. Nomor versi untuk ini dapat ditemukan di: https://developers.google.com/ml-kit/vision/image-labeling/custom-models/android
implementation 'com.google.mlkit:image-labeling-custom:16.3.1'
  1. Selain itu, Anda akan menambahkan model .tflite yang Anda buat di lab sebelumnya. Anda tidak ingin model ini dikompresi saat Android Studio mengompilasi aplikasi, jadi pastikan Anda menggunakan setelan ini di bagian Android pada file build.gradle yang sama:
aaptOptions{
    noCompress "tflite"
}

Pastikan lokasi tersebut tidak berada dalam setelan lainnya. Kode ini harus disusun bertingkat langsung di bawah tag android. Berikut contohnya:

62d546bff11d2a50.pngS

4. Menambahkan Model TFLite

Di codelab sebelumnya, Anda telah membuat model kustom dan mendownloadnya sebagai model.tflite.

Di project Anda, temukan folder assets yang saat ini berisi flower1.jpg. Salin model ke folder tersebut sebagai berikut:

  1. Klik kanan folder Assets di Android Studio. Di menu yang terbuka, pilih Buka di Finder. ('Show in Explorer' di Windows, dan 'Show in Files' di Linux.)

db30b47e419a326b.png

  1. Anda akan dibawa ke direktori di sistem file. Salin file model.tflite ke direktori tersebut, di samping flower1.jpg.

36de0c51bec1c19e.pngS

Android Studio akan diupdate untuk menampilkan kedua file di folder aset Anda:

e9f4e9f394d9b357.png

Sekarang Anda siap untuk memperbarui kode.

5. Memperbarui kode untuk model kustom

Langkah pertama adalah menambahkan beberapa kode untuk memuat model kustom.

  1. Di file MainActivity, tambahkan kode berikut ke onCreate Anda, tepat di bawah baris yang bertuliskan setContentView(R.layout.activity_main).

Ini akan menggunakan LocalModel untuk membuat dari aset model.tflite. Jika Android Studio mengeluh dengan mengaktifkan 'LocalModel' merah, tekan ALT + Enter untuk mengimpor library. Langkah ini akan menambahkan impor ke com.google.mlkit.common.model.LocalModel untuk Anda.

val localModel = LocalModel.Builder()
        .setAssetFilePath("model.tflite")
        .build()

Sebelumnya, Anda menggunakan model default di pengendali btn.setOnClickListener. Alat tersebut disiapkan dengan kode ini:

val labeler = ImageLabeling.getClient(ImageLabelerOptions.DEFAULT_OPTIONS)

Anda akan menggantinya untuk menggunakan model kustom.

  1. Siapkan objek opsi kustom:
val options = CustomImageLabelerOptions.Builder(localModel)
        .setConfidenceThreshold(0.7f)
        .setMaxResultCount(5)
        .build()

Opsi ini menggantikan opsi default dengan set yang disesuaikan. Nilai minimum keyakinan menetapkan standar kualitas prediksi yang akan ditampilkan. Jika Anda melihat kembali contoh di bagian atas codelab ini, dengan gambar yang berupa daisy, Anda memiliki 4 prediksi, masing-masing dengan nilai di sampingnya, seperti 'Sky' menjadi 0,7632.

Anda dapat secara efektif memfilter hasil yang berkualitas lebih rendah dengan menggunakan ambang batas keyakinan tinggi. Menyetel ini ke 0,9, misalnya, tidak akan menampilkan label apa pun dengan prioritas yang lebih rendah dari itu. setMaxResultCount() berguna dalam model dengan banyak class, tetapi karena model ini hanya memiliki 5 class, Anda hanya akan membiarkannya 5.

Setelah memiliki opsi untuk pemberi label, Anda dapat mengubah pembuatan instance pemberi label menjadi:

val labeler = ImageLabeling.getClient(options)

Kode lainnya akan berjalan tanpa modifikasi. Cobalah!

dd40c36c4edbb33.png

Di sini Anda dapat melihat bahwa bunga ini sekarang diidentifikasi sebagai bunga daisy dengan probabilitas 0,959!

Misalnya Anda menambahkan gambar bunga kedua, lalu mengulanginya:

8556a5fbea487842.png

Atribut ini mengidentifikasinya sebagai mawar.

Anda mungkin bertanya-tanya mengapa tertulis mawar, bukan hanya "mawar". Itu karena dalam {i>dataset<i}, label diberikan oleh nama folder, dan sayangnya nama folder tersebut sedikit tidak konsisten, terkadang menggunakan bentuk tunggal (seperti 'daisy') dan kadang-kadang menggunakan jamak (seperti 'mawar'). Jangan tertukar dengan model yang mencoba menghitung item dalam gambar – ini jauh lebih primitif dari itu, dan hanya dapat mengidentifikasi jenis bunganya.

6. Dapatkan Start App iOS

  1. Pertama, Anda akan memerlukan aplikasi dari Codelab pertama. Jika Anda sudah menyelesaikan lab, namanya akan bernama ImageClassifierStep1. Jika tidak ingin menggunakan lab, Anda dapat meng-clone versi yang sudah selesai dari repo. Perlu diperhatikan bahwa pod dan .xcworkspace tidak ada di repo. Jadi, sebelum melanjutkan ke langkah berikutnya, pastikan untuk menjalankan 'pod install' dari direktori yang sama dengan {i> .xcproject<i}.
  2. Buka ImageClassifierStep1.xcworkspace di Xcode. Perhatikan bahwa Anda harus menggunakan .xcworkspace, bukan .xcproject, karena Anda telah memaketkan ML Kit menggunakan pod, dan ruang kerja akan memuatnya.

Untuk sisa lab ini, saya akan menjalankan aplikasi di simulator iPhone yang akan mendukung target build dari codelab. Jika ingin menggunakan perangkat sendiri, Anda mungkin perlu mengubah target build di setelan project agar sesuai dengan versi iOS.

Jalankan dan Anda akan melihat sesuatu seperti ini:

9e151ed18f99fb98.pngS

Perhatikan klasifikasi yang sangat umum - kelopak, bunga, langit. Model yang Anda buat di codelab sebelumnya dilatih untuk mendeteksi 5 jenis bunga, termasuk yang satu ini – bunga daisy.

Untuk codelab ini lainnya, Anda akan melihat apa yang diperlukan untuk mengupgrade aplikasi dengan model kustom.

7. Menggunakan Pod Pelabel Gambar ML Kit Kustom

Aplikasi pertama menggunakan file pod untuk mendapatkan library dan model Image Labeler ML Kit dasar. Anda harus memperbaruinya untuk menggunakan library pelabelan gambar kustom.

  1. Cari file bernama podfile di direktori project Anda. Buka saja, dan Anda akan melihat sesuatu seperti ini:
platform :ios, '10.0'

target 'ImageClassifierStep1' do
        pod 'GoogleMLKit/ImageLabeling'
end
  1. Ubah deklarasi pod dari ImageLabeling menjadi ImageLabelingCustom, seperti ini:
platform :ios, '10.0'

target 'ImageClassifierStep1' do
        pod 'GoogleMLKit/ImageLabelingCustom'
end
  1. Setelah selesai, gunakan terminal untuk membuka direktori yang berisi podfile (serta .xcworkspace) dan jalankan pod install.

bb5d78eb7c7ab975.png

Setelah beberapa saat, library MLKitImageLabeling akan dihapus, dan library kustom akan ditambahkan. Sekarang Anda dapat membuka .xcworkspace untuk mengedit kode.

8. Menambahkan Model TFLite ke Xcode

Di codelab sebelumnya, Anda membuat model kustom dan mendownloadnya sebagai model.tflite. Jika Anda belum memilikinya, kembali dan jalankan codelab tersebut, atau baca kode colab di sini. Jika Anda tidak memiliki akses ke Google Colab, notebook tersedia di link ini

  1. Setelah ruang kerja terbuka di Xcode, tarik model.tflite ke project Anda. File tersebut harus berada di folder yang sama dengan file Anda lainnya seperti ViewController.swift atau Main.storyboard.
  2. Sebuah dialog akan muncul dengan opsi untuk menambahkan {i>file<i}. Pastikan Tambahkan ke Target dipilih, atau model tidak akan digabungkan dengan aplikasi saat di-deploy ke perangkat.

Perhatikan bahwa opsi 'Add to Targets' Anda akan memiliki ImageClassifierStep1 jika Anda memulai dari lab tersebut dan melanjutkan lab ini langkah demi langkah atau ImageClassifierStep2 (seperti yang ditunjukkan) jika Anda langsung melewati kode yang sudah selesai.

5b6a7f40c73f0f1f.pngS

Hal ini akan memastikan bahwa Anda dapat memuat model. Anda akan melihat caranya di langkah berikutnya.

9. Memperbarui Kode untuk Model Kustom

  1. Buka file ViewController.swift Anda. Anda mungkin melihat error pada perintah 'import MLKitImageLabeling' di bagian atas file. Hal ini terjadi karena Anda menghapus library pelabelan gambar generik saat memperbarui file pod. Anda dapat menghapus baris ini, dan memperbarui dengan hal berikut:
import MLKitVision
import MLKit
import MLKitImageLabelingCommon
import MLKitImageLabelingCustom

Mungkin akan mudah untuk membaca pesan ini dengan cepat dan berpikir bahwa kode tersebut mengulangi kode yang sama. Tapi sifatnya "Umum" dan "Kustom" di bagian akhir!

  1. Selanjutnya, Anda akan memuat model kustom yang Anda tambahkan di langkah sebelumnya. Temukan fungsi getLabels(). Di bawah baris yang bertuliskan visionImage.orientation = image.imageOrientation, tambahkan baris berikut:
// Add this code to use a custom model
let localModelFilePath = Bundle.main.path(forResource: "model", ofType: "tflite")
let localModel = LocalModel(path: localModelFilePath!)
  1. Temukan kode untuk menentukan opsi bagi ImageLabeler generik. Mungkin terjadi error karena library tersebut telah dihapus:
let options = ImageLabelerOptions()

Ganti dengan kode ini, untuk menggunakan CustomImageLabelerOptions, dan yang menentukan model lokal:

let options = CustomImageLabelerOptions(localModel: localModel)

...dan selesai! Coba jalankan aplikasi Anda sekarang. Saat mencoba mengklasifikasikan gambar, gambar itu akan lebih akurat – dan menunjukkan bahwa Anda sedang melihat bunga aster dengan probabilitas tinggi!

238cd21748a97cf4.png

Misalnya Anda menambahkan gambar bunga kedua, lalu mengulanginya:

75f3970a6b509bfe.pngS

Aplikasi berhasil mendeteksi bahwa gambar ini cocok dengan label 'mawar'.

10. Selamat!

Anda kini sudah beralih dari membangun aplikasi yang menggunakan model generik untuk mengenali konten gambar, membuat model ML sendiri untuk mengenali hal-hal tertentu, seperti bunga, lalu mengupdate aplikasi untuk menggunakan model kustom.

Aplikasi yang dihasilkan tentu saja sangat terbatas karena mengandalkan aset gambar yang dipaketkan. Namun, bagian ML bekerja dengan baik. Misalnya, Anda dapat menggunakan Kamera AndroidX untuk mengambil bingkai dari feed live dan mengklasifikasikannya untuk melihat bunga apa yang dikenali ponsel Anda.

Dari sini kemungkinannya tidak terbatas – dan jika Anda memiliki data sendiri untuk sesuatu selain bunga, Anda memiliki dasar-dasar yang diperlukan untuk membuat aplikasi yang mengenalinya menggunakan Computer Vision. Ini hanyalah beberapa langkah pertama menuju dunia yang jauh lebih luas, dan semoga Anda menikmatinya!