Corte contínuo de pontos de interesse: automatização da extração do foco da imagem

O corte é uma técnica fundamental para melhorar as imagens . Remover informações de fundo desnecessárias ou alterar a proporção de uma imagem pode melhorar muito o foco do visualizador na imagem. O imgix oferece muitos métodos de corte, incluindo detecção de rosto. Este tutorial se concentrará no corte automático de ponto de interesse ( crop=entropy ) e como você pode usá-lo para cortar os aspectos mais salientes ou significativos da imagem. Em particular, as áreas de alto contraste são consideradas as mais salientes.

Corte Básico de Entropia

Suponha que queremos cortar a imagem a seguir para remover uma grande quantidade de fundo preto estático da imagem.

umbrella.jpg?w=640

A primeira etapa é definir os parâmetros w e h e o modo fit=crop . Isso redimensionará a imagem para preencher os limites de largura e altura selecionados e, em seguida, cortará qualquer excesso de dados da imagem.

fit=crop

largura: w = 200
altura: h=200
ajuste: ajuste=corte

umbrella.jpg?w=200&h=200&fit=crop

o recorte padrão do imgix começa no centro da imagem, removendo os dados que estão fora dos parâmetros fornecidos. No entanto, além de cortar a imagem, também queremos que o guarda-chuva fique no centro. Para fazer isso, adicionamos crop=entropy à string de consulta para que o “meio” se torne o aspecto mais saliente da imagem. O guarda-chuva contrasta fortemente com o restante da imagem, tornando-se o foco.

fit=crop&crop=entropy

cultura: cultura = entropia

umbrella.jpg?w=200&h=200&fit=crop&crop=entropy

O objetivo era remover uma grande quantidade do fundo preto estático para centralizar o assunto. Neste exemplo, o assunto da imagem era o guarda-chuva vermelho, e adicionar crop=entropy permitiu que a funcionalidade de corte centralizasse em torno dele. No entanto, o assunto de uma imagem nem sempre é um objeto inanimado.

Uma alternativa ao corte centrado no rosto

Suponha que queremos redimensionar e cortar a imagem a seguir para centralizar no modelo.

womanlandscape.jpg?w=640

A imagem foi tirada usando a regra dos terços, permitindo uma imagem visualmente atraente, mantendo o modelo fora do centro. No entanto, também queremos criar trechos menores da imagem para usar em vários lugares em um site.

fit=crop

womanlandscape.jpg?w=200&h=200&fit=crop

Como a funcionalidade de corte se concentra no centro da imagem e o modelo está fora do centro, ela não aparece totalmente no trecho. Podemos usar a funcionalidade de corte de detecção de rosto para centralizar a imagem em torno de seu rosto.

fit=crop&crop=faces

womanlandscape.jpg?w=200&h=200&fit=crop&crop=faces

O modo de recorte de detecção de rosto detectou com sucesso o rosto dela e centralizou a imagem ao redor dele. No entanto, também estamos interessados em sua roupa, e não está totalmente no quadro. O joelho da modelo está parcialmente oculto, então adicionamos crop=entropy para que toda a roupa seja incluída na cena.

fit=crop&crop=entropy

womanlandscape.jpg?w=200&h=200&fit=crop&crop=entropy

Como funciona o corte de entropia?

Enquanto o modo de corte de rosto procura rostos e os centraliza para cortar, o modo de corte de entropia procura áreas de alto contraste e se concentra nelas.

fit=crop

fit=crop

Na figura acima, modificamos a imagem para destacar as áreas de alto contraste na imagem. A versão modificada demonstra o ponto de interesse da imagem - neste caso, a cabeça da salamandra. O modo de recorte de entropia ignorou a cor estática da imagem, concentrando-se, em vez disso, nas áreas onde o preto e o branco se encontram - as cores brilhantes da salamandra fornecem alto contraste em relação ao fundo.

Nos exemplos abaixo, essa capacidade do modo de corte de entropia de focar em áreas de alto contraste mantém a salamandra centralizada como o assunto da imagem, independentemente da orientação retrato ou paisagem. Supondo que suas imagens tenham áreas de alto contraste de maneira semelhante, isso permite que você direcione a arte de suas imagens automaticamente usando crop=entropy para ajustar vários tamanhos e proporções diferentes para designs diferentes.

fit=crop&crop=entropy

Para saber mais, confira a página de documentação do imgix .

• Para criar uma conta imgix gratuita, clique aqui
• Para solicitar uma demonstração ou tirar alguma dúvida, clique aqui