Categorias
JavaScript

O que é MobileNet?

MobileNet é uma simplificação de redes neurais para possibilitar o seu uso em aplicações web, com isso podemos criar rapidamente uma aplicação de reconhecimento de images. Inicialmente com um propósito mobile-first MobileNet passou a ser utilizada pelo tensorflow.js e ml5.js

Em mais detalhes, MobileNets são uma classe de convolução de redes neurais projetadas por pesquisadores do Google. Eles foram inicialmente projetados para facilitar o usos de recursos de seu aparelho móvel onde parte da informação é processada na nuvem assim economizando recursos computacionais de seu celular.

Convolução???

Na convolução as imagens em pixels são convertidas em dados numéricos, por exemplo, a imagine que você possui 512 por 512 pixels abaixo:

Foto fellyph cintra

Nós seres humanos classificamos da seguinte forma:

  1. Homem feio
  2. Barba falha
  3. Camisa listrada
  4. Sentado numa cadeira preta

No exemplo acima fazemos a convolução da imagem de 512×512 em 4 dados. Da mesma forma com machine learning essa image será divida em pequenos recortes e esses recortes serão analisados por um grupo de pequenas rede neurais, após esse processo as imagens será traduzida em números (lista de arrays) que classificam essa imagem.

Esse processo é repetido para cara bloco por várias redes neurais até chegar um grupo de números que definem a imagem.

O nível de precisão de uma MobileNet é menor que as redes neurais tradicionais, para agilizar o tempo de processamento. mas isso é compensado pela quantidade de amostras que a MobileNet possui na nuvem.

Por padrão MobileNet utilizar o dataset ImageNet com mais de 1500.000 de imagens divididas em 1.000 categorias. Mas Google fez o código fonte MobileNet aberto com 16 pontos de verificação, com isso podemos treinar o nosso próprio modelo reutilizando a estrutura da mobileNet.

Processo de identificação com ml5.js por exemplo é bem simples, podemos passar o dataset a partir de uma webcam e as imagens pode ser para infinitas finalidades:

  • Objetos
  • Expressões faciais
  • Cores
  • Letras
  • Posições de um corpo humano

Para o modelo não importa a finalidade os objetos serão classificados em números. Assim precisamos das imagens e as labels para classifição dessas imagens

Após o treinamento podemos dizer através de uma porcentagem o que a imagem se trata.

No próximo post iremos falar mais sobre como utilizar o nosso próprio dataset com ml5.js, se ainda não conferiu o post sobre ml5.js aqui vai o link: https://blog.fellyph.com.br/javascript/introducao-ao-ml5-js/

Categorias
JavaScript Tutoriais

Machine Learning descomplicado com ML5.js

Conhecida como uma biblioteca amigável para machine learning, ml5.js é uma das alternativas mais acessíveis para você que deseja se aventurar no mundo do Machine Learning. Meses atrás eu descobri esta biblioteca web através do canal coding train.

O que é machine Learning?

Antes de entramos em detalhe se você nunca ouviu falar em Machine Learning, algo que entrou no hype na computação com uma serie de recursos possíveis graça a computação na nuvem e a infinidade de dados que possuímos atualmente. Mas machine learning existe na computação desde a década de 40.

Quando umas das definições mais clássicas foram criadas por Arthur Samuels:

É o campo de estudo onde são dados aos computadores a capacidade de aprender algo sem ser explicitamente programado.

Uma ótima definição feita no canal coding train com uma simples comparação na programação clássica temos o seguinte algoritmo:

if(mouseX > 200) {
  console.log("lado direito");
} else {
  console.log("lado esquerdo");
}

Já com machine learning passamos uma série de dados:

  • 300 – direita
  • 401 – direita
  • 210 – direita
  • 100 – esquerda
  • 87 – esquerda
  • 24 – esquerda

A partir dessa série de dados o Machine Learning vai analisar esses dados e tentar fazer uma previsão de dados futuros nesse caso a quantidade de amostra é importante para o sucesso da nossa aplicação.

Dentro dos tutoriais sobre ML5.js vamos falar muito sobre três items:

  1. Redes neurais – os algoritmos responsáveis por processar tarefas de Machine learning, o de temos uma entrada de dados e fazemos uma série de cálculos para ter uma saída esperada. Para identificar padrões específicos.
  2. modelos pré-treinados – modelos pre-treinados é a parte que iremos abordar 90% dos casos por que são os items em mais evidência do momento, utilizado pelas grandes empresas para identificar usuários, moderação de texto, reconhecimento de voz entre outras funcionalidades.
  3. data sets – são os grupos de dados que utilizamos para treinar os nossos modelos.

Baseado nessa rápida de alguns pontos chaves, agora vamos falar sobre ML5, a idéia é criar mais posts sobre o assunto assim quando alguns pontos dos Machine learning forem abordados traremos mais descrições

ML5.js

Ml5.js foi construída em cima do tensorFlow.js que possibilita o uso machine learning na web com o processamento de dados através da GPU, geralmente utilizado para o processamento gráfico, Mas o tensorFlow.js utiliza desse recurso para não afetar o processamento da CPU.

Com ml5.js visa atingir uma audiência que trata machine learning em mais alto nível desenvolvedores web e artistas. A biblioteca possui algoritmos e modelos que realizam a classificação de três tipos da dados imagem, sons e textos.

Para cada grupo temos umas série de funções com diferentes funcionalidades, por exemplo, a função imageClassifier() através de redes neurais conseguimos reconhecer o conteúdo da image retornando um objeto com informações sobre a imagem vindo de um modelo pre-treinado

Mas com a função imageClassifier podemos treinar o nosso próprio modelo. Outra função interessante é poseNet(), com ela conseguimos identificar poses humanas, ela pode identificar uma única pose ou múltiplos integrantes.

No geral temos 10 funções para classificação de images e 2 funções para classificação de som e 4 funções para identificação de texto.

Tensorflow.js

É uma biblioteca criada pelo Google para trabalhar machine learning no JavaScript, foi construído baseado no TensorFlow biblioteca escrita em Python. Com tensorFlow.js podemos utilizar modelos pré-treinados, para classificação de imagens, detecção de objetos, detecção de texto tóxico e reconhecimento de comandos por voz.

Ou treinar o nosso próprio modelo, ele é uma biblioteca base do ML5.js possui uma estrutura mais complexa que o ML5.js

Exemplo prático

Agora que temos uma introdução desses três items chaves vamos fazer o nosso primeiro exercício com ML5.js, quando escrevi esse tutorial a lib estava na versão 0.3.1, agora vamos escolher uma foto para testar com ml5.js, sinta-se a vontade para escolher a sua foto:

Escolhi essa imagem para realizar meu teste

Agora temos a nossa imagem vamos criar o nosso primeiro classificador de imagens:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>ML5JS project</title>
    <script src="https://unpkg.com/ml5@0.3.1/dist/ml5.min.js"></script>
</head>
<body>
    <img src="./assets/dublin.jpg" id="foto" />
    <script>
        // Passo 1: Criar uma classificador de imagems com mobileNet
        const classifier = ml5.imageClassifier('MobileNet', onModelReady);

        function onModelReady() {
            // Passo 2: Selecionar uma image
            const img = document.querySelector("#foto")

            // Passo 3: Fazer a predicção
            let prediction = classifier.predict(img, gotResults);
        }

        // Passo 4: Fazer algo quando tivemos o resultado!
        function gotResults(err, results) {
            console.log(results);
            // e aqui acontece toda a mágica
        }
    </script>
</body>
</html>

No código acima temos exemplo fazemos a classificação da imagem que escolhemos acima, primeiramente fazemos o carregamento da lib em uma CDN, após adicionamos a imagem com uma tag img em nosso markup, temos uma tag script com o código que irá analisar nossa imagem.

Dentro da tag script o primeiro comando faz a chamada de uma função imageClassifier dentro da biblioteca ML5 passando dois parâmetros:

  • modelo – nesse caso vamos utilizar o mobileNet esse modelo pre-treinado está na nuvem ele possui mais de 14 mil imagens em seu dataset
  • função de callback – o segudo parâmetro a função de callback que iremos chamar quando nosso classificador de imagens estiver pronto.

Quando nosso modelo estiver pronto vamos chamar a função onModelReady dentro dela selecionamos a imagem que queremos analisar e com o nosso classificador de imagens(classifier) requisitamos a previsão da imagem. novamente passando dois parâmetros a imagens que iremos analisar e a função de callback.

Quando executamos o nosso código em um browser o resultado será o seguinte:

screenshot to console do browser

Um resultado meio estranho se traduzirmos o resultado temos label como “mastro” ou “poste” com confidência de 0.76 ou seja 76%. Como podemos ver temos uma farbrica no fundo com duas chamines.

A escolha da imagem foi proposital para a gente entender como funciona a analise de images, como falamos anteriormente MobileNet é um modelo pré-treinado mas ele tem uma base de 14 mil imagens o problema nessa caso será que o dentro dessas 14 mil imagens não treinamos o nosso modelo para identificar fábricas.

Se fizermos um segundo teste com essa imagem:

Segunda tentativa

O resultado será o seguinte:

Agora temos o resultado classificado como “beer glass”(copo de cerveja) com uma confidência de 94%, então como podemos ver não existe uma mágica por trás do Machine Learning.

Com isso entendemos que precisão é baseada na quantidade de informação em que meu dataset detém. Por isso empresas que detem uma grande base de informação conseguem aplicar o tecnologia a várias soluções.

Caso queira conferir mais tutoriais sobre JavaScript aqui confira o link: https://blog.fellyph.com.br/category/javascript/

Para esse post vamos ficando por aqui a idéia que em breve estarei postando um vídeo em meu canal. Se ainda não segue o canal aqui está o link: https://www.youtube.com/user/fdangellys