Cyber Monday-grafik: et udtryk til det rene onlinesalg

De bedste Cyber Monday-grafikker ser umiskendeligt digitale ud og peger et sted hen: en kold, elektrisk palet på mørk bund, én kort linje og et link. Cyber Monday er onlinesalget, så arbejdet er ikke kun opslag på sociale medier. Det er banneret hen over din hjemmeside, headeren i den mail, der lander om morgenen, og den linkforhåndsvisning, folk ser, når de deler. Lav dem alle ud fra ét udtryk, så føles dagen som en begivenhed frem for en gentagelse af fredagen.

Hvordan Cyber Monday adskiller sig fra Black Friday

Black Friday begyndte som en dag i butikkerne, og dens visuelle udtryk låner stadig fra butiksvinduer: varme farver, store skilte. Cyber Monday er opkaldt efter onlineshopping, og det meste af grafikken ses på en telefon et sekund, før nogen trykker. Det ændrer tre ting.

Hvis du kørte en Black Friday-serie, så behold typen, layoutet og stemmen, og skift temperaturen. Folk skal genkende dig med det samme og stadig se, at noget nyt er begyndt. Black Friday-opslag til sociale medier sætter den første halvdel op.

Cyber Monday-farver og paletter

Digitalt behøver ikke kredsløbskort, glitch-effekter eller binær kode i baggrunden. Farven klarer det alene. Lys, der ser ud til at komme fra en skærm, i blå, cyan eller violet mod en dyb blækfarvet bund, læses straks som online. Hold dig til én accent og lad resten forblive mørkt.

Neon ser spændende ud på en mørk telefon og forfærdeligt ud, når det vibrerer mod sig selv. Neon-gradienter dækker, hvordan du holder klare farver rene, og cyberpunk-farvepaletter går videre, hvis dit brand kan bære det.

Cyber Monday-banner til din hjemmeside

Et webbanner læses på vej til noget andet, så det får én kort linje og en deadline. Den tynde stribe over navigationen er den mindst påtrængende version og virker på hver side. Her er et i almindelig CSS, med en reservefarve, hvis gradienten ikke indlæses, og tekst, der forbliver lys på hver del af den.

<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>

Til en hel hero i stedet for en stribe designer du i 1920×1080 og holder ordene i venstre eller midterste tredjedel, hvor de overlever beskæring på mindre skærme. Hero-baggrunde til websites dækker størrelser og ydeevne.

Cyber Monday-maildesign

For mange butikker er Cyber Monday-mailen dagens vigtigste grafik. Headeren er 1200×600, og på en telefon viser den første skærm af en mail ofte lidt mere end det, så tilbuddet hører til i den øverste halvdel. Hold ordene som levende tekst i mailen, hvor du kan, og brug headerbilledet til stemning og overskrift.

• Emnelinjen og headeren skal sige det samme med de samme ord.
• Sæt én knap under headeren, ikke fem.
• Skriv deadline med en tidszone, især hvis du sælger til udlandet.
• Tjek headeren i mørk tilstand, hvor nogle indbakker ændrer farverne omkring den.

Mailheader-design har mere om størrelser og særheder i mørk tilstand.

Cyber Monday-opslag og stories

På sociale medier er Cyber Monday kort, så to eller tre opslag er rigeligt: en lancering om morgenen, en påmindelse i en story midt på dagen og en sidste chance om aftenen. Hvert skal sende folk til linket, så lad der være plads i stories til linkstickeren.

Lav alt det her ugen før, ikke mandag morgen. På dagen vil du følge ordrer og besvare beskeder, og den eneste designændring, der bør være tilbage, er at skifte »Seks timer tilbage« ud med »Én time tilbage« i den sidste story.

Linkforhåndsvisningen er den, folk glemmer. Når nogen deler din udsalgsside, er det billedet, deres venner ser, så sæt det til dagen. Open Graph-billedstørrelse viser hvordan. Med Pro ændrer Gradiently størrelsen på ét færdigt design til alle disse formater i ét trin, og baggrunden holder sit roligste område bag ordene i hver størrelse.