Integra un modelo personalizado en tu app

1. Antes de comenzar

En el primer Codelab de esta serie, creaste una app muy simple que usaba el etiquetado de imágenes para analizar el contenido de una imagen. Le pasaste una foto de una margarita, y te devolviste que veía cosas como un pétalo o el cielo. Luego, en el segundo codelab, cambiaste a Python para entrenar un modelo nuevo y personalizado que reconozca cinco tipos diferentes de flores.

En este codelab, actualizará la aplicación del primer lab con el modelo del segundo.

Para obtener el código fuente completo de este codelab, clona este repositorio. Verás subdirectorios para Android y iOS. El código del codelab anterior está disponible como ImageClassifierStep1 si deseas continuar. El código terminado para este codelab está disponible como ImageClassifierStep2.

Ve al paso 6 para iOS

Requisitos previos

• Debes haber completado los dos primeros codelabs de esta ruta de aprendizaje

Qué compilarás y aprenderás

• Integrar un modelo personalizado, entrenado en el lab anterior, a una aplicación para Android o iOS

Requisitos

• Android Studio, disponible en developer.android.com/studio para la parte de Android del lab
• Xcode, disponible en App Store de Apple, para la parte de iOS del lab

2. Obtén la app de inicio

Primero, necesitas la app del codelab Desarrolla tu primera app de visión artificial en Android o iOS. Si ya realizó el lab, se llamará ImageClassifierStep1. Si no desea realizar el lab, puede clonar la versión finalizada desde el repositorio

Ábrelo en Android Studio, haz las actualizaciones que necesites y, cuando esté listo, ejecuta la app para asegurarte de que funcione. Debería ver algo como esto:

Es una app básica, pero muestra algunas funciones muy potentes con solo un poco de código. Sin embargo, si quieres que esta flor sea reconocida como una margarita, no solo como una flor, tendrás que actualizar la app a fin de usar tu modelo personalizado en el codelab Cómo crear un modelo personalizado para tu clasificador de imágenes.

3. Actualiza build.gradle para usar modelos de ML Kit personalizados

1. Busca el archivo build.gradle a nivel de la app con Android Studio. La forma más fácil de hacerlo es en el explorador del proyecto. Asegúrate de que Android esté seleccionado en la parte superior y verás una carpeta para Gradle Scripts en la parte inferior.
2. Abre el que es para el módulo, con el nombre de tu app seguido de ".app" como se muestra aquí ((módulo: ImageClassifierStep1.app):

3. En la parte inferior del archivo, busca el parámetro de configuración dependencias. Allí debería ver esta línea:

implementation 'com.google.mlkit:image-labeling:17.0.1'

El número de versión puede ser diferente. Encuentra siempre la versión más reciente del sitio del Kit de AA en https://developers.google.com/ml-kit/vision/image-labeling/android

4. Reemplázalo con la referencia de la biblioteca de etiquetado de imágenes personalizada. Puedes encontrar el número de versión en: https://developers.google.com/ml-kit/vision/image-labeling/custom-models/android

implementation 'com.google.mlkit:image-labeling-custom:16.3.1'

5. Además, agregará un modelo .tflite que creó en el lab anterior. No quieres que se comprima este modelo cuando Android Studio compile tu app, así que asegúrate de usar esta configuración en la sección Android del mismo archivo build.gradle:

aaptOptions{
    noCompress "tflite"
}

Asegúrate de que no esté incluida en ninguna otra configuración. Debe anidarse directamente en la etiqueta android. Por ejemplo:

4. Agrega el modelo de TFLite

En el codelab anterior, creaste tu modelo personalizado y lo descargaste como model.tflite.

En tu proyecto, busca la carpeta assets que contiene flower1.jpg actualmente. Copia el modelo en esa carpeta de la siguiente manera:

1. En Android Studio, haz clic con el botón derecho en la carpeta Assets. En el menú emergente, selecciona Mostrar en Finder. ("Mostrar en Explorer" en Windows y "Mostrar en archivos" en Linux).

2. Se te dirigirá al directorio del sistema de archivos. Copia el archivo model.tflite en ese directorio, junto con flower1.jpg..

Android Studio se actualizará para mostrar ambos archivos en tu carpeta de elementos:

Ya puedes actualizar tu código.

5. Actualiza tu código para el modelo personalizado

El primer paso será agregar código para cargar el modelo personalizado.

1. En el archivo MainActivity, agrega lo siguiente a onCreate, justo debajo de la línea que dice setContentView(R.layout.activity_main).

Esto usará un LocalModel para compilar a partir del elemento model.tflite. Si Android Studio se queja volviendo a rojo "LocalModel", presiona ALT + Intro para importar la biblioteca. Debería agregar una importación a com.google.mlkit.common.model.LocalModel.

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

Anteriormente, en el controlador btn.setOnClickListener, usabas el modelo predeterminado. Se configuró con este código:

val labeler = ImageLabeling.getClient(ImageLabelerOptions.DEFAULT_OPTIONS)

Lo reemplazará para usar el modelo personalizado.

2. Configura un objeto de opciones personalizadas:

val options = CustomImageLabelerOptions.Builder(localModel)
        .setConfidenceThreshold(0.7f)
        .setMaxResultCount(5)
        .build()

Esto reemplaza las opciones predeterminadas por un conjunto personalizado. El umbral de confianza establece una barra para la calidad de las predicciones que se mostrarán. Si observas la muestra de la parte superior de este codelab, en la que la imagen era una margarita, tenías 4 predicciones, cada una con un valor a su lado, como "Sky" en 0 .7632.

Podría filtrar de manera eficaz los resultados de menor calidad si utilizara un umbral de confianza alto. Por ejemplo, si se establece en 0.9, no se muestra ninguna etiqueta con una prioridad inferior. setMaxResultCount() es útil en modelos con muchas clases, pero como este modelo solo tiene 5, solo lo dejarás en 5.

Ahora que tienes opciones para el etiquetador, puedes cambiar la creación de instancias de este:

val labeler = ImageLabeling.getClient(options)

El resto del código se ejecutará sin modificaciones. ¡Pruébalo!

Aquí puede ver que esta flor ahora se identificó como margarita con una probabilidad de 0.959.

Supongamos que agregaste una segunda imagen de una flor y le volviste a agregar la siguiente imagen:

Se identifica como una rosa.

Es posible que se pregunte por qué dice rosas en lugar de solo “rosa”. Esto se debe a que, en el conjunto de datos, las etiquetas se asignan según los nombres de las carpetas y, desafortunadamente, esos nombres son un poco incoherentes, y a veces se usan en singular (como “margarita”) y, a veces, se usan plurales (como “rosas”). No lo confunda con el modelo que intenta contar los elementos de la imagen. Es mucho más primitivo y solo puede identificar los tipos de flores.

6. Obtener la app de inicio de iOS

1. Primero, necesitarás la app del primer Codelab. Si ya realizó el lab, se llamará ImageClassifierStep1. Si no desea realizar el lab, puede clonar la versión finalizada desde el repositorio. Tenga en cuenta que los Pods y .xcworkspace no están presentes en el repositorio. Por lo tanto, antes de continuar con el siguiente paso, asegúrese de ejecutar “pod install” desde el mismo directorio que el .xcproject.
2. Abre ImageClassifierStep1.xcworkspace en Xcode. Tenga en cuenta que debe usar .xcworkspace y no .xcproject porque agrupó el Kit de AA con Pods, y el lugar de trabajo los cargará.

En el resto de este lab, ejecutaré la app en el simulador de iPhone, que debería admitir los objetivos de compilación del codelab. Si quieres usar tu propio dispositivo, es posible que debas cambiar el destino de compilación en la configuración del proyecto para que coincida con la versión de iOS.

Ejecuta el comando. Verás lo siguiente:

Tengan en cuenta las clasificaciones más genéricas: pétalo, flor, cielo. El modelo que creaste en el codelab anterior se entrenó para detectar 5 variedades de flores, incluida esta: margarita.

En el resto de este codelab, verás lo que se necesita para actualizar tu app con el modelo personalizado.

7. Usar Pods de etiquetado de imágenes del Kit de AA personalizado

La primera app usó un archivo de Pod para obtener el modelo y las bibliotecas base del etiquetador de imágenes del Kit de AA. Actualiza esa información para usar las bibliotecas de etiquetado de imágenes personalizadas.

1. Busca el archivo podfile en el directorio del proyecto. Ábrelo y verás lo siguiente:

platform :ios, '10.0'

target 'ImageClassifierStep1' do
        pod 'GoogleMLKit/ImageLabeling'
end

2. Cambie la declaración del Pod de ImageLabeling a ImageLabelingCustom de la siguiente manera:

platform :ios, '10.0'

target 'ImageClassifierStep1' do
        pod 'GoogleMLKit/ImageLabelingCustom'
end

3. Cuando termines, usa la terminal para navegar al directorio que contiene el podfile (y el archivo .xcworkspace) y ejecuta pod install.

Después de unos segundos, se quitarán las bibliotecas de MLKitImageLabeling y se agregarán las personalizadas. Ahora puedes abrir el archivo .xcworkspace para editar tu código.

8. Agrega el modelo de TFLite a Xcode

En el codelab anterior, creaste un modelo personalizado y lo descargaste como model.tflite. Si no tienes esto a mano, regresa y ejecuta el codelab, o bien revisa el código de Colab aquí. Si no tienes acceso a Google Colab, el notebook está disponible en este vínculo.

1. Con el lugar de trabajo abierto en Xcode, arrastra el modelo.tflite a tu proyecto. Debe estar en la misma carpeta que el resto de los archivos, como ViewController.swift o Main.storyboard.
2. Aparecerá un diálogo con opciones para agregar el archivo. Asegúrate de que esté seleccionada la opción Add to Targets. De lo contrario, el modelo no se empaquetará con la app cuando se implemente en un dispositivo.

Tenga en cuenta que la entrada "Add to Targets" tendrá ImageClassifierStep1 si comenzó y continúa en este lab paso a paso o ImageClassifierStep2 (como se muestra) si pasó al código finalizado.

Esto garantizará que puedas cargar el modelo. En el siguiente paso, aprenderás a hacerlo.

9. Actualiza tu código para el modelo personalizado

1. Abre el archivo ViewController.swift. Es posible que aparezca un error en la importación de MLKitImageLabeling en la parte superior del archivo. Esto se debe a que quitó las bibliotecas genéricas de etiquetado de imágenes cuando actualizó su archivo de Pods. Si lo desea, puede borrar esta línea y actualizarla con lo siguiente:

import MLKitVision
import MLKit
import MLKitImageLabelingCommon
import MLKitImageLabelingCustom

Puede ser fácil leerlas rápidamente y pensar que repiten el mismo código. Sin embargo, es “Common” y “Custom” al final.

2. A continuación, cargará el modelo personalizado que agregó en el paso anterior. Busca el func. de getLabels(). Debajo de la línea que dice visionImage.orientation = image.imageOrientation, agrega estas líneas:

// Add this code to use a custom model
let localModelFilePath = Bundle.main.path(forResource: "model", ofType: "tflite")
let localModel = LocalModel(path: localModelFilePath!)

3. Busca el código para especificar las opciones del ImageLabeler genérico. Es probable que veas un error, ya que se quitaron esas bibliotecas:

let options = ImageLabelerOptions()

Reemplázala con este código para usar CustomImageLabelerOptions y que especifique el modelo local:

let options = CustomImageLabelerOptions(localModel: localModel)

y listo. Prueba ejecutar la app ahora. Si intenta clasificar la imagen, esta debe ser más precisa, y debe decir que está mirando una margarita con alta probabilidad.

Supongamos que agregaste una segunda imagen de una flor y le volviste a agregar la siguiente imagen:

La app detectó correctamente que esta imagen coincidía con la etiqueta "rosas".

10. ¡Felicitaciones!

Pasaste de compilar una app que usó un modelo genérico para reconocer el contenido de una imagen a crear tu propio modelo de AA para reconocer elementos específicos, como flores, y luego actualizaste la app para usar el modelo personalizado.

La app resultante es, por supuesto, muy limitada porque dependía de elementos de imagen agrupados. Sin embargo, la parte del AA funciona correctamente. Por ejemplo, puedes usar la cámara de AndroidX para tomar fotogramas de un feed en vivo y clasificarlos a fin de ver qué flores reconoce tu teléfono.

Desde aquí, las posibilidades son infinitas y, si dispones de tus propios datos para algo que no sea flores, tendrás los cimientos de lo que necesitas para crear una aplicación que las reconozca mediante visión artificial. Estos son solo los primeros pasos para lograr un mundo mucho más amplio y esperamos que hayas disfrutado trabajar con ellos.