A tarefa MediaPipe Face Stylizer permite aplicar estilizações de rostos a rostos em uma imagem. Use essa tarefa para criar avatares virtuais em vários estilos.
O exemplo de código descrito nestas instruções está disponível em GitHub. Para mais informações sobre recursos, modelos e opções de configuração, desta tarefa, consulte a Visão geral.
Exemplo de código
O código de exemplo do Estilizador de rostos fornece uma implementação completa desse em JavaScript para sua referência. Esse código ajuda a testar a tarefa a criar seu próprio app de estilização facial. Você pode exibir, executar e editar o exemplo de Estilizador de rostos código usando apenas seu código da navegador.
Configuração
Esta seção descreve as principais etapas para configurar seu ambiente de desenvolvimento especificamente para usar o Estilizador de rosto. Para informações gerais sobre como configurar sua ambiente de desenvolvimento da Web e JavaScript, incluindo a versão da plataforma consulte o Guia de configuração para a Web.
Pacotes JavaScript
O código do Estilizador de rostos está disponível no MediaPipe @mediapipe/tasks-vision
NPM (em inglês). Você pode encontrar
faça o download dessas bibliotecas seguindo as instruções no artigo de Configuração
guia.
Instale os pacotes necessários pelo NPM usando o seguinte comando:
npm install @mediapipe/tasks-vision
Se você quiser importar o código da tarefa com uma rede de fornecimento de conteúdo (CDN) adicione o seguinte código no cabeçalho <head> no seu arquivo HTML:
<!-- You can replace JSDeliver with another CDN if you prefer -->
<head>
<script src="https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision/vision_bundle.js"
crossorigin="anonymous"></script>
</head>
Modelo
A tarefa MediaPipe Face Stylizer exige um modelo treinado que seja compatível com esse tarefa. Para mais informações sobre os modelos treinados disponíveis para o Estilizador de rostos, consulte na seção de visão geral da tarefa Modelos.
Selecione e faça o download de um modelo e armazene-o no diretório do projeto:
<dev-project-root>/app/shared/models/
Criar a tarefa
Use uma das funções createFrom...() do Estilizador de rostos para preparar a tarefa.
e executar inferências. Use a função createFromModelPath() com um objeto relacionado
caminho absoluto para o arquivo do modelo treinado. Se o modelo já tiver sido carregado
na memória, use o método createFromModelBuffer().
O exemplo de código abaixo demonstra o uso da função createFromOptions() para
para configurar a tarefa. A função createFromOptions permite personalizar
Estilizador de rostos com opções de configuração.
O código a seguir demonstra como criar e configurar a tarefa com comandos opções:
const vision = await FilesetResolver.forVisionTasks(
// path/to/wasm/root
"https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision@latest/wasm"
);
const facestylizer = await FaceStylizer.createFromOptions(
vision,
{
baseOptions: {
modelAssetPath: "https://storage.googleapis.com/mediapipe-models/face_stylizer/blaze_face_stylizer/float32/latest/face_stylizer_color_sketch.task"
},
});
Preparar dados
O Estilizador de rostos pode estilizar rostos em imagens em qualquer formato compatível com o host navegador. A tarefa também lida com o pré-processamento de entrada de dados, incluindo redimensionamento, rotação e normalização de valores.
Executar a tarefa
O Estilizador de rostos usa o método stylize() para acionar inferências. A tarefa
processa os dados, tenta estilizar os rostos e relata os resultados.
As chamadas para o método stylize() do Estilizador de rostos são executadas de forma síncrona e bloqueiam a
thread da interface do usuário.
O código a seguir demonstra como executar o processamento com o modelo de tarefas:
const image = document.getElementById("image") as HTMLImageElement;
const faceStylizerResult = faceStylizer.stylize(image);
Gerenciar e exibir resultados
O Estilizador de rostos retorna um objeto MPImage com uma estilização da maior
um rosto proeminente na imagem de entrada.
Confira abaixo um exemplo dos dados de saída desta tarefa:
O resultado acima foi criado com a aplicação do modelo Color sketch para a seguinte imagem de entrada:
