Jornada do Dynamic Media: Noções básicas, Parte I

Última atualização em 2023-11-21
  • Criado para:
  • User
    Admin

Bem-vindo à Jornada do Dynamic Media.

Esta jornada aborda as noções básicas do Dynamic Media, como ele funciona, o que ele pode fazer por você e qual o valor que ele oferece ao seu trabalho e aos seus clientes.

Pré-requisitos

  • Compreensão básica de formatos de imagem e vídeo
  • Noções básicas sobre HTML e CSS
  • Noções básicas sobre ferramentas de design, como Adobe Illustrator, Adobe Photoshop, Adobe XD
  • O acesso ao Dynamic Media no Experience Manager é útil, mas não é necessário

O que você pode esperar para aprender

Parte I

  • O que é o Dynamic Media e como ele pode ajudá-lo?
  • Casos de uso do Dynamic Media
  • Como um ativo flui pelo sistema da Dynamic Media

Parte II

  • Anatomia de um URL do Dynamic Media e como o Dynamic Media fornece conteúdo
  • Princípios básicos da criação de predefinições de imagens para renderizar ativos
  • Conjuntos de imagens, conjuntos de rotação e conjuntos de mídia mista

Público
Os públicos-alvo que melhor se adaptam aos leitores dessa jornada são os seguintes, que são novos no Dynamic Media no Experience Manager:

  • Administrador
  • Analista de negócios
  • Arquiteto de conteúdo
  • Autor de conteúdo
  • Designer
  • Desenvolvedor
  • Marketing
  • Gerente/proprietário do produto
DICA

Para obter melhores resultados, a Adobe recomenda que você leia e visualize esta Jornada do Dynamic Media em um computador desktop.

O que é o Dynamic Media e como ele pode ajudá-lo?

O Dynamic Media ajuda você a fornecer ativos avançados de merchandising e marketing visuais sob demanda. Ele também ajuda a criar e fornecer experiências de visualização interativa, incluindo zoom, rotação de 360 graus e vídeo. Seus ativos são dimensionados dinamicamente para consumo em sites da Web, móveis e sociais. Usando um conjunto de ativos de origem primária, como imagens, vídeo e 3D, o Dynamic Media gera e fornece várias variações desse conteúdo avançado, em tempo real, por meio de sua CDN (Content Delivery Network, rede de entrega de conteúdo) global, escalável e otimizada para o desempenho.

A Dynamic Media incorpora os fluxos de trabalho da solução de gerenciamento de ativos digitais da Adobe Experience Manager Assets para simplificar e simplificar o processo de gerenciamento de campanhas digitais.

Um arquivo com infinitas possibilidades

Um dos principais pontos para entender sobre o Dynamic Media é o conceito de Um arquivo de ativo principal com infinitas possibilidades.

Para entender melhor esse conceito, pense na maneira como você trabalha tradicionalmente com um único ativo, como uma imagem ou vídeo. Normalmente, você cria um ativo principal. Em seguida, você cria manualmente versões desse mesmo ativo para cada experiência, cada dispositivo necessário, cada página da Web e cada propriedade onde é usado. Com o tempo, esse único ativo pode crescer para 20, 30 ou mais versões, sem nenhum histórico de versões anexado a ele. Agora, imagine fazer isso para cada imagem ou vídeo que você tem. O número de versões de ativos rapidamente se tornaria enorme para manter e atualizar, sem mencionar o aumento nos custos de armazenamento.

No entanto, o Dynamic Media é fundamentalmente diferente de outros sistemas, pois você o usa para fornecer sua mídia dinamicamente de ativos únicos e principais e de chamadas de URL. Os caminhos de URL do Dynamic Media solicitados incluem instruções que informam ao servidor de publicação do Adobe como exibir o ativo quando ele é entregue à tela de um cliente. Por exemplo, usando o mesmo único ativo principal, você pode fornecê-lo instantaneamente em representações ilimitadas, alterando o tamanho, o formato, a resolução, o peso, a cor, o recorte e os efeitos, como uma exibição de zoom.

Esse método de entrega exclusivo garante que experiências de qualidade consistentes sejam enviadas para qualquer tela, independentemente do tamanho ou da largura de banda. Vídeos em tamanho normal também são otimizados para todos os tipos de tela e transmitidos de maneira adaptável para garantir uma experiência do usuário consistente e de qualidade.

O Adobe Dynamic Media fornece a mesma imagem principal a mídias diferentes em tamanhos e formatos diferentes
O Adobe Dynamic Media garante experiências consistentes e de qualidade em qualquer tela, independentemente do tamanho ou da largura de banda.

À medida que você lê, aprenderá mais sobre por que esse conceito de "um arquivo de ativo principal, infinitas possibilidades" é importante.

A rede de entrega de conteúdo

Quando estiver pronto para entrar em funcionamento com um ativo de imagem ou de vídeo, ele será suportado pelo backbone da Dynamic Media, que consiste em uma rede de entrega avançada e de nível superior. A rede atende centenas de clientes em todo o mundo todos os dias. Os ativos são distribuídos na Rede de entrega de conteúdo - ou CDN - hospedada pela Akamai. A CDN é um sistema de serviços de computação em rede que cooperam de forma transparente para fornecer conteúdo, especialmente grandes conteúdos de mídia avançada, aos usuários finais.

No sistema CDN, o conteúdo da Web é armazenado em caches da Web na Internet. Em seguida, ele é entregue do cache da Web aos usuários finais para agilizar a entrega. Assim, na primeira vez que alguém baixa uma página da Web, os ativos que ele vê são entregues a um cache CDN. Eles são armazenados no servidor para que na próxima vez que alguém na mesma área acessar a página da Web, o mesmo conteúdo de cache seja entregue mais rapidamente. O conteúdo é entregue mais rápido porque está localizado mais próximo do usuário. Um CDN possibilita exibições mais rápidas da página da Web, além de diminuir as demandas de largura de banda do servidor central, pois o conteúdo é entregue a partir de uma rede de cache, não de um servidor central em cada instância. Esse fluxo otimizado significa uma melhor experiência do usuário, resultando em aumento das vendas.

Historicamente, a CDN fornece 3,5 petabytes de tráfego para os clientes, todos os meses. O sistema pode entregar 52 bilhões de ativos em um único dia. Esse número equivale a 864.000 imagens e vídeos entregues com sucesso aos clientes, a cada segundo.

Imagem inteligente

A Dynamic Media já faz um excelente trabalho de otimização de ativos e garantia de que cada ativo seja carregado rapidamente em sistemas móveis e desktop, por meio da CDN. Para fazer isso, as predefinições de imagem são usadas no Dynamic Media para definir a qualidade da sua imagem. Elas também definem o tipo de imagem que você está enviando, sua nitidez e outras partes para várias partes das suas experiências ou páginas.

Mas, para adicionar valor ao Dynamic Media além das predefinições de imagem, há Imagem inteligente.

A Imagem inteligente oferece um desempenho ainda melhor do delivery de ativos de imagem, otimizando automaticamente o formato e o tamanho do arquivo de uma imagem com base no recurso de navegador do cliente. Ela funciona com suas predefinições de imagem existentes (as predefinições de imagem são discutidas na Parte II desta jornada) e usa inteligência no delivery.

Essa inteligência reduz ainda mais o tamanho do arquivo de imagem com base na velocidade do navegador e da conexão de rede. Como os ativos de imagem compõem a maior parte do tempo de carregamento de uma página, a melhoria no desempenho pode ter um impacto completo nos principais indicadores de negócios, como:

  • Maior conversão
  • Tempo no site
  • Menor taxa de rejeição do site

Em geral, com a geração inteligente de imagens, você pode esperar uma melhoria de desempenho de 22% a 47%, dependendo das configurações de predefinição de imagem existentes e das características específicas do usuário final. Tudo isso mantendo a qualidade da imagem como se ela nunca tivesse sido tocada.

Imagem inteligente
A Smart Imaging otimiza automaticamente o formato e o tamanho do arquivo de uma imagem com base no recurso de navegador do cliente e na velocidade da rede.

A geração inteligente de imagens não está ativada por padrão porque requer um esforço coordenado entre você e o suporte técnico do Adobe Dynamic Media. Além disso, a ativação do Smart Imaging requer a limpeza completa do cache da CDN, que é então reabastecido com tempo. Se você estiver interessado em usar Imagem inteligente, poderá trabalhar com o Adobe para ativá-la enviando um tíquete de suporte técnico. O suporte técnico fornece um parâmetro de URL que permite experimentar, antecipadamente, imagens inteligentes. Você pode experimentá-lo em qualquer uma de suas páginas da web ou imagens para que você possa ver o desempenho que você tem, e a economia. Você pode ativar a geração inteligente de imagens para seu site completo.

Conjuntos de vídeos adaptados

Quando há um vídeo em uma página ou na página principal, seus clientes tendem a se envolver com esse conteúdo por mais tempo e permanecer na página por mais tempo, o que geralmente é uma boa coisa. Esse comportamento foi exibido por meio de análises realizadas pelo Adobe. No entanto, o vídeo pode ser complexo. Por um lado, você geralmente tem um arquivo principal grande. É complicado determinar o tamanho e o delivery do vídeo, tudo para garantir que a experiência seja executada sem problemas, independentemente do dispositivo no qual está sendo visualizada e da largura de banda.

Para resolver esse problema, o Dynamic Media oferece a capacidade de criar Conjuntos de vídeos adaptados.

Conjunto de vídeos adaptados
Um Conjunto de vídeos adaptados agrupa versões do mesmo vídeo codificadas em taxas de bits e formatos diferentes.

Você começa com seu vídeo original, o qual você carrega no sistema. o Dynamic Media dimensiona automaticamente ou transcodes, esse vídeo em vários vídeos. Em seguida, no momento do delivery, ele determina de forma inteligente qual tela de vídeo, qual qualidade e qual formato usar, além de fornecê-la ao telefone, tablet ou computador desktop.

Por exemplo, em um dispositivo móvel iOS, ele detecta uma largura de banda como 4G, 5G ou Wi-Fi. Em seguida, ele seleciona automaticamente o vídeo codificado correto entre as várias taxas de bits de vídeo no Conjunto de vídeos adaptados. O vídeo é transmitido para dispositivos móveis, tablets ou computadores de mesa.

Além disso, a qualidade do vídeo é comutada automaticamente de modo dinâmico se as condições da rede forem alteradas. E, se um cliente entrar no modo de tela cheia em um desktop, o Conjunto de vídeos adaptados responderá usando uma resolução melhor, melhorando a experiência de visualização do cliente.

O uso dos Conjuntos de vídeos adaptados oferece uma reprodução suave e de alta qualidade para clientes que reproduzem vídeos do Dynamic Media em várias telas e dispositivos. Isso realmente elimina a complexidade do vídeo.

Casos de uso do Dynamic Media

Veja a seguir problemas comuns de casos de uso e soluções com as quais a Dynamic Media pode ajudá-lo a impulsionar um envolvimento positivo do cliente, fidelidade, conversão e aumento do ROI.

Caso de uso: abordagem de arquivo principal

Um dos casos de uso mais importantes do Dynamic Media também é um dos mais óbvios. Ou seja, reduzindo o peso das páginas e experiências e o tamanho do conteúdo, seja uma imagem ou um vídeo, que está sendo entregue.

Veja a seguir uma experiência típica ou uma página da Web. Cerca de 90% de uma página é composta de mídia avançada, como imagens e vídeos, que geralmente são arquivos muito mais pesados.

Peso da página de conteúdo
Peso da página de conteúdo de uma página da Web típica.

Os 10% restantes são HTML, código CSS e tags específicas. Você deseja otimizar o peso de 90% dessa página, e a Dynamic Media ajuda nesse esforço. Anteriormente, você leu sobre o conceito de um arquivo principal de ativos com inúmeras possibilidades. Essa abordagem é significativa na redução do peso geral da página. A capacidade de pegar um ativo principal e usá-lo em uma página de detalhes do produto, uma página de miniatura, seu carrinho de compras e sua grade de pesquisa economiza tempo. E também garante a consistência entre as experiências.

Abordagem de arquivo principal
O observador é um arquivo de ativo principal, mas com várias representações dele, não cópias, criadas em tempo real.

Vamos analisar mais detalhadamente os problemas que a Dynamic Media está resolvendo com um arquivo e algumas das soluções para essa abordagem.

Problema Solução da Dynamic Media
Crie e armazene cada ativo. Use um único arquivo de imagem, criando automaticamente as representações necessárias somente no momento do delivery.
Altos custos de armazenamento. Elimina a necessidade de criar e armazenar várias cópias de um ativo.
Dificuldade em manter a cadeia de custódia. Garante a entrega de experiências consistentes e otimizadas para dispositivos.
Nenhum histórico de versões.
Experiências de marca inconsistentes entre dispositivos.
Custo desnecessário da criação de ativos duplicados.

Ao pensar em um arquivo, você está criando um ativo para cada tipo de experiência. Você pode ter uma imagem inicial e, em seguida, criar 20, 30 ou 40 variações dessa imagem, que você terá que armazenar e pagar por esse armazenamento.

Em seguida, verifique se a imagem correta está sendo usada e se isso pode afetar sua capacidade de ter consistência entre as marcas. E, se não conseguir encontrar uma imagem, você terá que voltar no e duplicar esses ativos.

O Dynamic Media permite criar variações de imagens, de forma instantânea, a partir dessa imagem inicial. Ele permite que você seja criativo com esse ativo principal e não precise ir e voltar com seu artista de design gráfico ou estúdio de fotos para criar conteúdo adicional. E isso é dinheiro e tempo economizado.

Com a abordagem de um arquivo, você usa um único arquivo principal. Em seguida, crie as versões ou representações necessárias nos sites, propriedades e experiências, somente no momento em que forem entregues ou visualizadas por um cliente. Essa eficiência pode diminuir bastante a quantidade de armazenamento necessário para seus ativos e reduzir a complexidade geral do fluxo de trabalho. E com o sistema de entrega da Dynamic Media, ele garante que todas as imagens e vídeos sejam otimizados, carregados rapidamente e tenham uma ótima aparência em todas as telas e dispositivos.

Caso de uso: Vídeo

Outro caso de uso para o qual o Dynamic Media resolve é o vídeo. O vídeo é complexo. É difícil de gerenciar. Os arquivos de vídeo são desafiadores para armazenar e movimentar-se por causa de seus tamanhos de arquivo inerentes.

Problema Solução da Dynamic Media
Difícil de gerenciar e fornecer vídeo otimizado para vários dispositivos. Use um único vídeo que seja dimensionado automaticamente para todos os dispositivos.
Os vídeos são interrompidos ou reproduzidos em baixa qualidade devido à largura de banda disponível do usuário. Envie vídeos por meio de um reprodutor de HTML que detecta automaticamente a largura de banda disponível e adapta a qualidade para garantir alta fidelidade e reprodução sem problemas.
Inviável e demorado criar manualmente todas as versões de um vídeo, apenas para garantir uma boa exibição e reprodução entre dispositivos. Elimine horas de trabalho entediante de transcodificação com um fluxo de trabalho simplificado.
Libere tempo para um trabalho de maior valor.

Os clientes chegam à Dynamic Media com o seguinte problema que esperam resolver:

"Nós temos o vídeo, e gastamos uma grande quantia de dinheiro criando-o. Mas evitamos colocá-lo nas páginas, ou distribuí-lo, porque com nossos testes, não podemos garantir a qualidade do vídeo, ou se ele vai realmente ser reproduzido. E, em última análise, isso afeta nossas marcas e, potencialmente, nossa função até mesmo na conversão."

A solução da Dynamic Media é pegar esse arquivo de vídeo principal e permitir que a Dynamic Media faça todos os tamanhos através de seu processo de transcodificação. Em seguida, combine-o com o player de vídeo inteligente da Dynamic Media. Esse fluxo de trabalho garante que você esteja usando esse vídeo na sua página de aterrissagem principal ou em uma categoria ou página de detalhes do produto, ele seja consistente e entregue com alta qualidade.

Estes são vários outros casos de uso a serem considerados.

Caso de uso: única fonte da verdade

Problema Solução da Dynamic Media
Ativos digitais espalhados pela organização, em silos em diferentes equipes ou unidades de negócios. Armazene e gerencie todos os ativos digitais em um local central.
Os membros da equipe baixam e criam versões locais. Os membros da equipe usam um único arquivo principal para criar e O fornece todas as versões necessárias em vários tamanhos de tela e dispositivos.
Ativos de uso único criados para cada experiência e dispositivo. Elimina ativos de uso único, economizando tempo e dinheiro para criá-los.

Caso de uso: corte inteligente alimentado por IA para mídia avançada

Problema Solução da Dynamic Media
É demorado e trabalhoso desenhar, medir e cortar manualmente imagens ou vídeos para destacar o ponto focal e exibir adequadamente em todos os tamanhos de tela e dispositivos. O usa o Corte inteligente no Dynamic Media, um recurso de IA do Adobe Sensei, para detectar automaticamente o ponto focal em qualquer imagem ou vídeo e recortar para mantê-lo.
Tempo perdido que poderia ser mais bem gasto na criação de experiências de alto impacto. Registra o ponto de interesse pretendido, independentemente do tamanho da tela.
Ativos de uso único criados para cada experiência e dispositivo. Elimina tarefas manuais tediosas e fornece imagens e vídeos de alta qualidade e carregamento rápido que ficam bem em qualquer dispositivo ou tela.

Caso de uso: criação de mídia interativa

Problema Solução da Dynamic Media
Experiências estáticas e planas do cliente que não envolvem, geram fidelidade ou impulsionam a conversão. Permite que usuários não técnicos adicionem elementos interativos de maneira fácil e contínua, como pontos de acesso, carrosséis e conjuntos de rotação, para proporcionar experiências mais dinâmicas e envolventes.
Retorno limitado sobre o investimento de ativos digitais e experiências de cliente pouco atraentes. Impulsiona a conversão e o retorno sobre o investimento de experiências de mídia avançada.

Como um ativo flui pelo sistema da Dynamic Media

A seguir, é mostrado um fluxo de trabalho típico do Dynamic Media.

Fluxo de trabalho do Dynamic Media
Como um ativo flui pelo sistema da Dynamic Media.

Você começa com a fase de criação com a meta principal de ter seu ativo principal no final. Esses ativos principais podem vir de sessões de fotos, de fornecedores de vídeo ou de alguns arquivos de áudio que você criou. Você pode usar os aplicativos de Creative Suite do Adobe, como o Adobe InDesign, Adobe Photoshop e Adobe Illustrator para ajudar a trabalhar o conteúdo.

Quando a parte de criação for concluída, você colocará o ativo na solução de criação carregando o ativo no Dynamic Media. No Dynamic Media, você garante que tenha as predefinições de imagem e os visualizadores corretos alinhados para suas várias páginas da Web no site.

E, finalmente, você otimiza todo esse conteúdo e o publica nos servidores da Dynamic Media para que ele fique disponível para Web, impressão, e-mail, desktops e dispositivos móveis.

Upload de ativos no Dynamic Media

Ao terminar de criar um ativo principal, faça upload dele para o Dynamic Media. O tipo de arquivo que você faz upload e o formato e tamanho do arquivo são atributos importantes para o Dynamic Media. É no momento do upload que você deseja garantir que obtenha o valor máximo de um arquivo compatível.

Por exemplo, a imagem do relógio abaixo tem 4560 x 3020 pixels. E mesmo que você nunca use uma imagem desse tamanho, você ainda pode carregá-la. Quanto maior a imagem, melhor a qualidade que o Dynamic Media pode oferecer, mesmo que seja uma representação em miniatura. Lembre-se: você pode facilmente diminuir a resolução de uma imagem existente. Mas se você tentar aumentar Na resolução de uma imagem, o resultado provavelmente não será satisfatório.

Formatos recomendados para upload no Dynamic Media
Considerações para uploads de ativos.

A Adobe recomenda que você faça upload de ativos em um formato sem perdas. Geralmente, é melhor evitar o JPEG, pois quando você fornece o JPEG ou quando continua a salvar o JPEG, começa a perder a qualidade da imagem com o tempo. Você deseja começar com as imagens de maior resolução em um formato sem perdas com o qual possa viver. Normalmente, esse formato é um arquivo TIFF ou PNG.

Em relação ao espaço de cores, ao pensar em um canal digital ou visualização da Web, você normalmente pensa em RGB (vermelho, verde, azul).

A maioria nunca pensaria em fornecer algo em CMYK ou por que você poderia querer fornecer em CMYK. Isso ocorre porque esse espaço de cor é usado com mais frequência para entregar itens impressos. Mas o Dynamic Media pode oferecer em ambos os espaços de cores.

Há muitos clientes que ainda fazem impressão, como clubes de atacado de armazém. E há supermercados que muitas vezes imprimem folhetos semanalmente. Esses clientes exigem que suas imagens estejam em ambos os espaços de cores. Tradicionalmente, isso exigiria duas imagens diferentes: uma em RGB e outra em CMYK. No entanto, você pode fazer upload de ativos CMYK diretamente no Dynamic Media e fazer com que o Dynamic Media forneça ativos RGB por meio de uma predefinição de imagem ou por meio de um perfil de cores, automaticamente. Não há necessidade de criar várias versões de um arquivo, mantendo assim o conceito de um arquivo principal de ativos com inúmeras possibilidades.

Publicar e visualizar ativos

Depois de fazer upload de ativos para o Dynamic Media, é uma boa prática publicar selecionando os ativos e clicando em Publish ou Publicação rápida no Dynamic Media. A publicação de ativos é necessária se você pretende usá-los em qualquer experiência. Após a publicação, os ativos ficam disponíveis para inclusão em uma página da Web usando um URL gerado pela Dynamic Media que você copia ou por meio da incorporação de código na página.

Além de publicar ativos manualmente, você pode configurar o Dynamic Media para publicar ativos instantaneamente, sem qualquer intervenção do usuário, no momento do upload.

Após o upload, há diferentes maneiras de pré-visualizar as representações de um ativo no Dynamic Media. Visualizar representações pode ajudar a fornecer uma ideia do que um cliente vê. Um método de visualização comum é selecionar um ativo e, em seguida, visualizar suas representações selecionando um predefinição de imagem como visto a seguir.

Pré-visualização de uma representação de um ativo com base na predefinição Imagem grande
Pré-visualização de uma representação de um ativo com base na predefinição de imagem "Grande" selecionada. O botão URL foi clicado. O caminho do URL resultante contém o nome da predefinição de imagem "Grande" e pode ser usado em uma página da Web.

O URL acima está ativo. Experimente.

Outro método para visualizar um ativo é selecionar o ativo de imagem e depois selecionar um Visualizadores como visto a seguir.

Visualização de um ativo com base na predefinição do visualizador Zoom vertical claro
Visualizar um ativo com base na predefinição do visualizador "ZoomVertical_light" selecionada. O ponteiro do mouse (+) foi movido sobre o relógio para ampliar. Observe os botões URL e Incorporar.

A representação acima está ativa. Experimente.

Opcional - Saiba mais

A parte I desta jornada abordou as noções básicas de uma variedade de tópicos do Dynamic Media. Se você quiser saber mais sobre o que acabou de ler, use os materiais abaixo para explorar os conceitos com mais detalhes. Caso contrário, você pode continuar com a Parte II da sua jornada. Consulte O que vem a seguir nesta Jornada do Dynamic Media.

Tópicos da Ajuda do Dynamic Media

Tutoriais do Dynamic Media

Visualizadores do Dynamic Media

O que vem a seguir nesta Jornada do Dynamic Media

Na parte II desta jornada, você examina os URLs do Dynamic Media um pouco mais perto para entender melhor o que está acontecendo quando um ativo é entregue. Você também aprenderá mais sobre os fundamentos da criação de predefinições de imagens para renderizar ativos e sobre conjuntos de imagens, conjuntos de rotação e conjuntos de mídia mista, e como eles são criados.

Leve-me para Jornada do Dynamic Media: Noções básicas, Parte II.

Nesta página