Artes para Cyber Monday: um visual para a promoção só online

As melhores artes para Cyber Monday parecem inconfundivelmente digitais e apontam para algum lugar: uma paleta fria e elétrica sobre um fundo escuro, uma linha curta e um link. A Cyber Monday é a promoção online, então o trabalho não se resume a posts. É o banner no topo do seu site, o cabeçalho do e-mail que chega naquela manhã e a prévia do link que as pessoas veem quando compartilham. Faça tudo a partir de um só visual e o dia parece um evento, não uma repetição da sexta-feira.

Como a Cyber Monday se diferencia da Black Friday

A Black Friday começou como um dia de lojas físicas, e o visual dela ainda pega emprestado das vitrines: cores quentes, placas grandes. A Cyber Monday ganhou o nome por causa das compras online, e a maior parte das artes dela é vista num celular um segundo antes de alguém tocar. Isso muda três coisas.

Se você fez uma sequência de Black Friday, mantenha a tipografia, o layout e o tom de voz e mude a temperatura. As pessoas devem reconhecer você na hora e ainda perceber que algo novo começou. Posts de Black Friday para redes sociais prepara essa primeira metade.

Cores e paletas para Cyber Monday

Digital não precisa de placas de circuito, efeitos glitch ou código binário no fundo. A cor resolve sozinha. Uma luz que parece vir de uma tela, em azul, ciano ou violeta, contra um fundo cor de tinta profundo, parece online na hora. Mantenha um único destaque e deixe o resto escuro.

O neon fica empolgante num celular escuro e horrível quando vibra contra si mesmo. Gradientes neon mostra como manter cores vivas limpas, e paletas de cores cyberpunk vai além, se a sua marca aguentar.

Banner de Cyber Monday para o seu site

Um banner de site é lido no caminho para outra coisa, então ganha uma linha curta e um prazo. A faixa fina acima da navegação é a versão menos invasiva e funciona em todas as páginas. Aqui está uma em CSS puro, com uma cor de reserva caso o gradiente não carregue e um texto que continua claro sobre todas as partes dele.

<div class="cm-banner" role="region" aria-label="Cyber Monday sale">
  <a href="/sale">Cyber Monday: 25% off everything, today only</a>
</div>

<style>
  .cm-banner {
    background-color: #050b14;
    background-image: linear-gradient(90deg, #050b14 0%, #0c4a6e 50%, #050b14 100%);
    text-align: center;
    padding: 10px 16px;
  }
  .cm-banner a {
    color: #e0f2fe;
    font: 600 15px/1.4 system-ui, sans-serif;
    text-decoration: none;
  }
</style>

Para um hero inteiro em vez de uma faixa, crie em 1920×1080 e mantenha as palavras no terço esquerdo ou central, onde sobrevivem ao recorte em telas menores. Fundos para hero de site trata de tamanhos e desempenho.

Design de e-mail para Cyber Monday

Para muitas lojas, o e-mail da Cyber Monday é a arte mais importante do dia. O cabeçalho tem 1200×600, e num celular a primeira tela de um e-mail muitas vezes mostra pouco mais que isso, então a oferta pertence à metade de cima. Mantenha as palavras como texto no e-mail sempre que puder e use a imagem do cabeçalho para o clima e o título.

• O assunto e o cabeçalho devem dizer a mesma coisa, com as mesmas palavras.
• Coloque um botão sob o cabeçalho, não cinco.
• Escreva o prazo com fuso horário, principalmente se você vende para outros países.
• Confira o cabeçalho no modo escuro, em que algumas caixas de entrada mudam as cores em volta dele.

Design de cabeçalho de e-mail traz mais sobre tamanhos e as manias do modo escuro.

Posts e stories de Cyber Monday

Nas redes, a Cyber Monday é curta, então dois ou três posts bastam: um lançamento de manhã, um lembrete em story ao meio-dia e uma última chamada à noite. Cada um deve levar as pessoas ao link, então deixe espaço nos stories para a figurinha de link.

Faça todas essas artes na semana anterior, não na segunda de manhã. No dia, você vai querer acompanhar pedidos e responder mensagens, e a única mudança de design que deve sobrar é trocar “Faltam seis horas” por “Falta uma hora” no último story.

A prévia do link é a que as pessoas esquecem. Quando alguém compartilha a página da sua promoção, essa imagem é a arte que os amigos dela veem, então ajuste-a para o dia. Tamanho da imagem Open Graph mostra como. Com o Pro, o Gradiently adapta um design pronto a todos esses formatos num passo só, e o fundo mantém a sua área mais calma atrás das palavras em cada tamanho.