Integrar um modelo personalizado ao aplicativo

1. Antes de começar

No primeiro codelab desta série, você criou um app muito simples que usava a rotulagem de imagens para analisar o conteúdo de uma imagem. Você passou uma foto de uma margarida, e o app retornou que viu coisas como uma pétala ou o céu. Em seguida, no segundo codelab, você mudou para o Python para treinar um novo modelo personalizado que reconhece cinco tipos diferentes de flores.

Neste codelab, você vai atualizar o app do primeiro laboratório com o modelo do segundo.

Você pode acessar o código-fonte completo deste codelab clonando este repositório. Você verá subdiretórios para Android e iOS. O código do codelab anterior está disponível como ImageClassifierStep1 se você quiser acompanhar. O código finalizado deste codelab está disponível como ImageClassifierStep2.

Pré-requisitos

  • Você precisa ter concluído os dois primeiros codelabs neste programa de aprendizagem.

O que você vai criar e aprender

  • Integrar um modelo personalizado, treinado no laboratório anterior, a um app Android ou iOS.

O que é necessário

  • Android Studio, disponível em developer.android.com/studio para a parte do laboratório do Android.
  • Xcode, disponível na App Store da Apple, para a parte do laboratório do iOS.

2. Instalar o app inicial

Primeiro, você vai precisar do app do codelab Criar seu primeiro app de visão computacional no Android ou iOS. Se você já fez o laboratório, ele será chamado de ImageClassifierStep1. Se você não quiser fazer o laboratório, clone a versão finalizada do repositório.

Abra-o no Android Studio, faça as atualizações necessárias e, quando estiver pronto, execute o app para garantir que ele funcione. Você vai conferir algo parecido com:

f3703d45d1332d1d.png

É um app bastante primitivo, mas mostra uma funcionalidade muito poderosa com apenas um pouco de código. No entanto, se você quiser que essa flor seja reconhecida como uma margarida, e não apenas como uma flor, atualize o app para usar seu modelo personalizado do codelab Criar um modelo personalizado para o classificador de imagens.

3. Atualizar o build.gradle para usar modelos personalizados do Kit de ML

  1. Usando o Android Studio, encontre o arquivo build.gradle no nível do app. A maneira mais fácil de fazer isso é no explorador de projetos. Verifique se a opção Android está selecionada na parte de cima e você verá uma pasta para Scripts do Gradle na parte de baixo.
  2. Abra o arquivo do módulo, com o nome do app seguido por ".app", conforme mostrado aqui: (Module: ImageClassifierStep1.app):

8fe1d04b40610047.png

  1. Na parte de baixo do arquivo, encontre a configuração dependencies. Nela, você verá esta linha:
implementation 'com.google.mlkit:image-labeling:17.0.1'

O número da versão pode ser diferente. Sempre encontre o número da versão mais recente no site do Kit de ML em: https://developers.google.com/ml-kit/vision/image-labeling/android

  1. Substitua isso pela referência da biblioteca de rotulagem de imagens personalizada. O número da versão pode ser encontrado em: https://developers.google.com/ml-kit/vision/image-labeling/custom-models/android
implementation 'com.google.mlkit:image-labeling-custom:16.3.1'
  1. Além disso, você vai adicionar um modelo .tflite criado no laboratório anterior. Não queremos que esse modelo seja compactado quando o Android Studio compilar o app. Portanto, use essa configuração na seção Android do mesmo arquivo build.gradle:
aaptOptions{
    noCompress "tflite"
}

Verifique se ele não está em nenhuma outra configuração. Ele precisa estar aninhado diretamente na tag android. Veja um exemplo:

62d546bff11d2a50.png

4. Adicionar o modelo do TFLite

No codelab anterior, você criou seu modelo personalizado e fez o download dele como model.tflite.

No seu projeto, encontre a pasta assets que contém flower1.jpg. Copie o modelo para essa pasta da seguinte maneira:

  1. Clique com o botão direito do mouse na pasta Assets no Android Studio. No menu exibido, selecione Reveal in Finder. ("Show in Explorer" no Windows e "Show in Files" no Linux).

db30b47e419a326b.png

  1. Você será direcionado ao diretório no sistema de arquivos. Copie o arquivo model.tflite para esse diretório, ao lado de flower1.jpg..

36de0c51bec1c19e.png

O Android Studio será atualizado para mostrar os dois arquivos na pasta de recursos:

e9f4e9f394d9b357.png

Agora você pode atualizar seu código.

5. Atualizar seu código para o modelo personalizado

A primeira etapa é adicionar um código para carregar o modelo personalizado.

  1. No arquivo MainActivity, adicione o seguinte ao onCreate, imediatamente abaixo da linha que lê setContentView(R.layout.activity_main).

Isso vai usar um LocalModel para criar a partir do recurso model.tflite. Se o Android Studio reclamar ao deixar "LocalModel" vermelho, pressione ALT + Enter para importar a biblioteca. Ele vai adicionar uma importação para com.google.mlkit.common.model.LocalModel.

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

Anteriormente, no handler btn.setOnClickListener, você estava usando o modelo padrão. Ele foi configurado com este código:

val labeler = ImageLabeling.getClient(ImageLabelerOptions.DEFAULT_OPTIONS)

Você vai substituir isso para usar o modelo personalizado.

  1. Configure um objeto de opções personalizadas:
val options = CustomImageLabelerOptions.Builder(localModel)
        .setConfidenceThreshold(0.7f)
        .setMaxResultCount(5)
        .build()

Isso substitui as opções padrão por um conjunto personalizado. O limite de confiança define uma barra para a qualidade das previsões a serem retornadas. Se você voltar ao exemplo na parte de cima deste codelab, em que a imagem era uma margarida, você tinha quatro previsões, cada uma com um valor ao lado, como "Sky" sendo 0,7632.

Você pode filtrar os resultados de qualidade inferior usando um limite de confiança alto. Definir isso como 0,9, por exemplo, não retornaria nenhum rótulo com uma prioridade menor do que isso. O setMaxResultCount() é útil em modelos com muitas classes, mas como esse modelo tem apenas cinco, você vai deixá-lo em cinco.

Agora que você tem opções para o rotulador, é possível mudar a instanciação do rotulador para:

val labeler = ImageLabeling.getClient(options)

O restante do seu código será executado sem modificação. Faça um teste!

dd40c36c4edbb33.png

Aqui, você pode ver que essa flor foi identificada como uma margarida com uma probabilidade de 0,959.

Digamos que você adicionou uma segunda imagem de flor e executou novamente com ela:

8556a5fbea487842.png

Ele a identifica como uma rosa.

Você pode estar se perguntando por que ele diz rosas em vez de apenas "rosa". Isso ocorre porque, no conjunto de dados, os rótulos são fornecidos pelos nomes das pastas e, infelizmente, esses nomes de pastas são um pouco inconsistentes, às vezes usando o singular (como "margarida") e às vezes usando o plural (como "rosas"). Não confunda isso com o modelo tentando contar os itens na imagem. Ele é muito mais primitivo do que isso e só pode identificar os tipos de flores.

6. Instalar o app inicial do iOS

  1. Primeiro, você vai precisar do app do primeiro codelab. Se você já fez o laboratório, ele será chamado de ImageClassifierStep1. Se você não quiser fazer o laboratório, clone a versão finalizada do repositório. Os pods e o .xcworkspace não estão presentes no repo. Portanto, antes de continuar para a próxima etapa, execute "pod install" no mesmo diretório do .xcproject.
  2. Abra ImageClassifierStep1.xcworkspace no Xcode. Observe que você deve usar o .xcworkspace e não o .xcproject porque você agrupou o Kit de ML usando pods, e o espaço de trabalho vai carregá-los.

Para o restante deste laboratório, vou executar o app no simulador do iPhone, que oferece suporte aos destinos de build do codelab. Se você quiser usar seu próprio dispositivo, talvez seja necessário mudar o destino de build nas configurações do projeto para corresponder à versão do iOS.

Execute-o e você verá algo parecido com isto:

9e151ed18f99fb98.png

Observe as classificações muito genéricas: pétala, flor, céu. O modelo criado no codelab anterior foi treinado para detectar cinco variedades de flores, incluindo esta: uma margarida.

Para o restante deste codelab, você vai conferir o que é necessário para fazer upgrade do app com o modelo personalizado.

7. Usar pods do rotulador de imagens personalizado do Kit de ML

O primeiro app usou um arquivo de pod para acessar as bibliotecas e o modelo básicos do rotulador de imagens do Kit de ML. Você precisa atualizar isso para usar as bibliotecas de rotulagem de imagens personalizadas.

  1. Encontre o arquivo chamado podfile no diretório do projeto. Abra-o e você verá algo parecido com isto:
platform :ios, '10.0'

target 'ImageClassifierStep1' do
        pod 'GoogleMLKit/ImageLabeling'
end
  1. Mude a declaração do pod de ImageLabeling para ImageLabelingCustom, assim:
platform :ios, '10.0'

target 'ImageClassifierStep1' do
        pod 'GoogleMLKit/ImageLabelingCustom'
end
  1. Quando terminar, use o terminal para navegar até o diretório que contém o podfile (bem como o .xcworkspace) e execute pod install.

bb5d78eb7c7ab975.png

Depois de alguns momentos, as bibliotecas MLKitImageLabeling serão removidas e as personalizadas serão adicionadas. Agora você pode abrir o .xcworkspace para editar seu código.

8. Adicionar o modelo do TFLite ao Xcode

No codelab anterior, você criou um modelo personalizado e fez o download dele como model.tflite. Se você não tiver isso em mãos, volte e execute esse codelab ou acesse o código do Colab aqui. Se você não tiver acesso ao Google Colab, o notebook estará disponível neste link.

  1. Com o espaço de trabalho aberto no Xcode, arraste o model.tflite para o projeto. Ele precisa estar na mesma pasta que o restante dos arquivos, como ViewController.swift ou Main.storyboard.
  2. Uma caixa de diálogo será exibida com opções para adicionar o arquivo. Verifique se a opção Add to Targets está selecionada. Caso contrário, o modelo não será agrupado com o app quando ele for implantado em um dispositivo.

A entrada "Add to Targets" terá ImageClassifierStep1 se você tiver começado por ela e estiver continuando neste laboratório passo a passo ou ImageClassifierStep2 (conforme mostrado) se você tiver pulado para o código finalizado.

5b6a7f40c73f0f1f.png

Isso vai garantir que você possa carregar o modelo. Você vai aprender a fazer isso na próxima etapa.

9. Atualizar seu código para o modelo personalizado

  1. Abra o arquivo ViewController.swift. Você pode ver um erro na "import MLKitImageLabeling" na parte de cima do arquivo. Isso ocorre porque você removeu as bibliotecas de rotulagem de imagens genéricas ao atualizar o arquivo de pod. Exclua essa linha e atualize com o seguinte:
import MLKitVision
import MLKit
import MLKitImageLabelingCommon
import MLKitImageLabelingCustom

Pode ser fácil ler rapidamente e pensar que eles estão repetindo o mesmo código. Mas é "Common" e "Custom" no final.

  1. Em seguida, você vai carregar o modelo personalizado que adicionou na etapa anterior. Encontre a função getLabels(). Abaixo da linha que lê visionImage.orientation = image.imageOrientation, adicione estas linhas:
// Add this code to use a custom model
let localModelFilePath = Bundle.main.path(forResource: "model", ofType: "tflite")
let localModel = LocalModel(path: localModelFilePath!)
  1. Encontre o código para especificar as opções do ImageLabeler genérico. É provável que ele esteja mostrando um erro, já que essas bibliotecas foram removidas:
let options = ImageLabelerOptions()

Substitua isso por este código para usar um CustomImageLabelerOptions e que especifica o modelo local:

let options = CustomImageLabelerOptions(localModel: localModel)

Isso é tudo. Tente executar o app agora. Ao tentar classificar a imagem, ela será mais precisa e informará que você está olhando para uma margarida com alta probabilidade.

238cd21748a97cf4.png

Digamos que você adicionou uma segunda imagem de flor e executou novamente com ela:

75f3970a6b509bfe.png

O app detectou com sucesso que essa imagem correspondia ao rótulo "rosas".

10. Parabéns!

Você passou de criar um app que usava um modelo genérico para reconhecer o conteúdo de uma imagem a criar seu próprio modelo de ML para reconhecer coisas específicas, como flores, e depois atualizar o app para usar seu modelo personalizado.

O app resultante é, é claro, muito limitado porque dependia de recursos de imagem agrupados. No entanto, a parte de ML está funcionando bem. Por exemplo, você pode usar a câmera AndroidX para tirar frames de um feed ao vivo e classificá-los para ver quais flores seu smartphone reconhece.

A partir daqui, as possibilidades são infinitas. Se você tiver seus próprios dados para algo diferente de flores, terá as bases do que precisa para criar um app que os reconheça usando a visão computacional. Estas são apenas as primeiras etapas em um mundo muito mais amplo, e esperamos que você tenha gostado de trabalhar com elas.