# Generatiivinen brändäys: identiteetti järjestelmänä

[Canonical HTML page](https://gradiently.design/fi/guide/generative-branding)

Yhden logon ja taustan sijaan suunnittelet niitä tuottavat säännöt. Generatiivinen brändäys muuttaa identiteetin reseptiksi, josta syntyy tuore versio joka kerta.

## The short version

- Generatiivisessa brändäyksessä suunnittelija määrittelee usein koodilla säännöt, joiden pohjalta järjestelmä tuottaa brändin kuvat.
- Lopputulos vaihtelee joka kerta, mutta säännöt pitävät kaikki versiot tunnistettavasti saman identiteetin osina.
- Norjan Visit Nordkyn on usein mainittu esimerkki: logon muoto ja väri muuttuvat reaaliaikaisen säädatan mukaan.
- Generatiivinen järjestelmä tarvitsee kiinteät rajat, muutaman hallitun muuttujan ja vaihtelun lähteen, kuten siemenluvun, datan tai tuotettavan muodon.
- Generatiivinen brändäys eroaa tekoälykuvien luomisesta: brändi kirjoittaa säännöt itse, joten tulokset ovat ennakoitavia ja toistettavia.

**Generatiivinen brändäys** määrittelee identiteetin sääntöjoukkona valmiiden kuvien sijaan. Suunnittelijat päättävät ehdot, värit, muodot, materiaalit ja rajat. Järjestelmä, usein pieni koodinpätkä, tuottaa uuden logo- tai taustaversion aina tarvittaessa. Jokainen tulos on erilainen, mutta kaikki ovat selvästi samaa brändiä, koska ne syntyvät samasta reseptistä.

## Miten generatiivinen brändäys toimii

Jokaisessa generatiivisessa identiteetissä taidekoulun logosta säähän reagoivaan tunnukseen on samat kolme osaa. Kun osaat nimetä ne, voit suunnitella sellaisen.

| Osa | Mitä se tarkoittaa | Esimerkki |
| --- | --- | --- |
| Rajat | Mikä ei koskaan muutu | Violetin sävyperhe lähes mustalla pohjalla, yksi kirjaintyyppi |
| Muuttujat | Mitä järjestelmä saa muuttaa rajoissa | Valon paikka, hallitseva sävy |
| Lähde | Mikä ohjaa muutosta | Siemenluku, reaaliaikainen data, muoto, päivämäärä |

Rajat kantavat tunnistettavuutta, muuttujat tuoreutta ja lähde ratkaisee jokaisen yksittäisen tuloksen.

Lähde merkitsee enemmän kuin näyttää. **Siemenluku** antaa toistettavaa vaihtelua: sama luku tuottaa aina saman tuloksen, joten suunnitelma voidaan luoda tarkasti uudelleen. **Data** yhdistää identiteetin todelliseen asiaan, kuten säähän tai aikaan. **Muoto** antaa järjestelmän sommitella tarinaan tai banneriin rajaamisen sijaan.

## Esimerkkejä generatiivisista identiteeteistä

- **Visit Nordkyn, 2010:** Pohjois-Norjan alueen matkailubrändin logon muoto määräytyy reaaliaikaisesta tuulen suunnasta ja väri lämpötilasta, joten se kuvastaa senhetkistä säätä.
- **MIT Media Lab, 2011:** algoritmi tuotti jokaiselle laboratorion jäsenelle oman logon yhteisestä päällekkäisten muotojen ruudukosta.
- **OCAD University, 2011:** kiinteä mustavalkoinen kehys täytetään yliopiston opiskelijoiden taiteella, joten identiteetti uusiutuu jatkuvasti.
- **Google Doodles:** ei koodilla tuotettu, mutta pitkäikäinen järjestelmä yhdellä kiinteällä säännöllä: nimi pysyy luettavana, ja sen ympärillä on loputtomasti vaihtelua.

Yhteistä on pidättyvyys. Jokainen järjestelmä muuttaa yhtä tai kahta asiaa ja pitää jonkin täysin paikallaan: kehyksen, ruudukon, nimen tai muodon. Vaihtelu huomataan, vakio muistetaan. Nämä liittyvät [dynaamiseen brändi-identiteettiin](https://gradiently.design/fi/guide/dynamic-brand-identity), joka käsittelee muuttuvia identiteettejä yleisesti. Generatiivinen brändäys on sen osa, jossa muutokset syntyvät järjestelmästä eivätkä suunnittelijan käsin tekemistä yksittäisversioista.

## Generatiivinen tausta muutamalla koodirivillä

Idea näkyy pienessä esimerkissä. Brändin rajat ovat pohja ja kolmen violetin perhe. Muuttuja on valon paikka, joka pysyy kuvan oikealla puolella eikä osu vasemmalle tasatun tekstin taakse. Lähde on siemenluku.

```js
// A small seeded random generator: the same seed always gives the same numbers.
function mulberry32(seed) {
  return function () {
    seed = (seed + 0x6d2b79f5) | 0;
    let t = Math.imul(seed ^ (seed >>> 15), 1 | seed);
    t = (t + Math.imul(t ^ (t >>> 7), 61 | t)) ^ t;
    return ((t ^ (t >>> 14)) >>> 0) / 4294967296;
  };
}

// Constraints: these never change.
const brand = {
  ground: '#120d24',
  family: ['#4c1d95', '#7c3aed', '#c084fc'],
};

// Variables: light position and which tone leads, within limits.
function background(seed) {
  const rand = mulberry32(seed);
  const x = Math.round(60 + rand() * 30); // light stays on the right
  const y = Math.round(10 + rand() * 40);
  const lead = brand.family[1 + Math.floor(rand() * 2)];
  return `radial-gradient(circle at ${x}% ${y}%, ${lead} 0%, ${brand.family[0]} 40%, ${brand.ground} 80%)`;
}

document.body.style.background = background(2026);
```

Vaihda siemenluku ja saat uuden taustan. Käytä samaa uudelleen ja saat täsmälleen saman takaisin. Jokainen tulos pysyy brändin perheessä.

- Siemen A: lila johtaa ylhäällä: `radial-gradient(circle at 78% 18%, #c084fc 0%, #4c1d95 40%, #120d24 80%)`
- Siemen B: violetti keskellä oikealla: `radial-gradient(circle at 64% 44%, #7c3aed 0%, #4c1d95 40%, #120d24 80%)`
- Siemen C: violetti oikeassa reunassa: `radial-gradient(circle at 88% 30%, #7c3aed 0%, #4c1d95 40%, #120d24 80%)`
- Siemen D: lila johtaa yläosassa: `radial-gradient(circle at 70% 12%, #c084fc 0%, #4c1d95 40%, #120d24 80%)`

Neljä tulosta, jotka yllä oleva koodi voisi tuottaa. Vaihtelevia, mutta kukaan vieras ei erehtyisi luulemaan niitä neljäksi eri brändiksi.

## Generatiivisen brändin sääntöjen kirjoittaminen

1. **Aloita valmiista ilmeestä** Suunnittele käsin yksi versio, josta pidät. Säännöt kuvaavat, mikä siinä toimii, joten tarvitset ensin tavoitteen.
2. **Erota kiinteä vapaasta** Listaa, mikä ei saa koskaan muuttua. Yleensä pohja, väriperhe, materiaali ja typografia.
3. **Valitse yksi tai kaksi muuttujaa** Valon paikka, hallitseva sävy tai kuvion tiheys. Jokainen lisämuuttuja moninkertaistaa brändistä poikkeavan tuloksen mahdollisuuden.
4. **Suojaa sanat** Tee luettavuudesta sääntö: levottomin ja kirkkain alue ei saa koskaan osua tekstin taakse. [Teksti liukuvärillä](https://gradiently.design/fi/guide/text-on-gradient) selittää miksi.
5. **Tarkista ääripäät** Tuota monta tulosta ja katso oudoimpia. Jos jokin tuntuu väärältä, kavenna vaihteluväliä.

### Heikot säännöt

- Mikä tahansa väri laajasta valikoimasta
- Sattumanvarainen sijoittelu myös tekstin taakse
- Useiden materiaalien vapaa sekoittaminen
- Kukaan ei tarkista tuloksia

### Vahvat säännöt

- Kiinteä perhe ja yksi valinnainen korostus
- Valo pois sanojen paikalta
- Yksi materiaali aina mukana
- Ääripäät tarkistettu ennen julkaisua

## Generatiivinen brändäys ja tekoälykuvien luominen

Nämä sekoitetaan helposti. Tekoälyn kuvamalli tuottaa kuvia kehotteesta, ja sama kehote voi palauttaa hyvin erilaisia tuloksia. Generatiivinen identiteetti toteuttaa **itse kirjoittamiasi** sääntöjä, joten vaihteluväli tiedetään ja tulos voidaan toistaa siemenluvusta. Voit käyttää tekoälyä sääntöjen suunnitteluun tai sanojen kirjoittamiseen, mutta identiteetti elää reseptissä. Se myös helpottaa luovutusta: uusi suunnittelija, toimisto tai avustaja seuraa kirjoitettuja sääntöjä luotettavammin kuin jäljittelee tunnelmataulua. [Tekoälysuunnittelun omaperäisyys](https://gradiently.design/fi/guide/ai-design-originality) käsittelee laajemmin tekoälytuloksen alkuperää.

## Markit ovat reseptejä

Gradiently-Mark toimii samalla periaatteella. Se on värien, enintään kolmen materiaalin, valon, rakeisuuden, liikkeen ja typografisen äänen resepti, joka piirretään reaaliajassa kuvatiedoston sijaan. Se sommittelee itsensä joka suunnittelukokoon ja lukee sanojen paikan, jotta rauhallisin alue tulee niiden taakse. Jokaisella Markilla on julkinen koodi, kuten `GR·K7Q2·MX`, ja täsmälleen yksi omistaja kerrallaan, joten ilmeesi resepti kuuluu sinulle. [Markin materiaalit](https://gradiently.design/fi/guide/mark-materials-explained) näyttää sen sisällön.

Lauantain viikonlopputorista kertova julkaisu elävällä liukuvärireseptillä, rauhallinen alue sanojen takana

Yksi resepti syötejulkaisuna. Sama resepti piirtyy eri tavoin, mutta oikein, tarinaan tai banneriin.

## FAQ

### Mitä generatiivinen brändäys on?

Identiteetti määritellään usein koodilla säännöiksi, jotka tuottavat uudet brändinmukaiset kuvat joka kerta yhden kiinteän logon tai taustan sijaan.

### Mikä on esimerkki generatiivisesta brändäyksestä?

Visit Nordkynin logo muuttuu reaaliaikaisen tuuli- ja lämpötiladatan mukaan. Vuoden 2011 MIT Media Lab -identiteetti tuotti eri logon jokaiselle jäsenelle.

### Onko generatiivinen brändäys sama kuin tekoälysuunnittelu?

Ei. Generatiivinen brändäys toteuttaa brändin kirjoittamia sääntöjä, joten tulokset ovat ennakoitavia ja toistettavia. Tekoälykuvatyökalut tuottavat kehotteista huomattavasti vähäisemmällä hallinnalla.

### Pitääkö osata koodata generatiivista brändäystä varten?

Ei välttämättä. Työkalut, jotka piirtävät ilmeen reseptinä joka kokoon, antavat keskeisen hyödyn ilman omaa koodaamista.
