Organiske former i design: blobs, kurver og bløde former

Organiske former er uregelmæssige, flydende former: blobs, småsten, blade, vandpytter, krusninger og bløde buer. I modsætning til geometriske former, som følger regler (et kvadrat har fire lige lange sider), ser de ud, som om de er vokset frem eller hældt ud. I design giver de blødhed og varme, og de er især nyttige som fotorammer, baggrundsformer og beholdere til kort tekst. Kunsten er at få dem til at se valgte ud og ikke tilfældige.

Organiske former kontra geometriske former

Geometriske former opleves som præcise, konstruerede og rationelle. Organiske former opleves som naturlige, afslappede og menneskelige. Ingen af dem er bedre; de siger forskellige ting. Mange gode identiteter bruger begge: et stramt geometrisk design-gitter til tekst og layout med én organisk form for varmens skyld.

Hvor organiske former virker bedst

Wellnessstudier, hudplejemærker, bagerier, blomsterhandlere, terapeuter og børnebrands læner sig op ad disse former, fordi de blødgør alt omkring sig. Branddesign til hudpleje er et godt eksempel på kategorien, hvor en enkelt sten bag en flaske kan bære hele looket.

Sådan tegner du en blob, der ser bevidst ud

1. 1

   Start fra en cirkel eller et afrundet kvadrat

   En blob er en cirkel, der er blevet skubbet til. Starter du rundt, forbliver den samlede masse i balance.

2. 2

   Skub tre eller fire punkter

   Flyt nogle få kantpunkter ind og ud med forskellige afstande. Tre til fem buler er det ideelle; flere ligner en klat.

3. 3

   Varier kurvernes størrelse

   Én lang, blid kurve, én strammere og én midt imellem. Ens buler ser mekaniske ud, som en blomst eller et tandhjul.

4. 4

   Fjern skarpe spidser og små vrid

   Hver kurve skal være jævn nok til, at du langsomt kan følge den med en finger. Små knæk ligner fejl på afstand.

5. 5

   Genbrug den

   Gem din bedste blob, og brug den samme, roteret eller skaleret, på tværs af brandet. En genkendelig form bliver en del af identiteten.

Hold blobs store og få. En enkelt form, der fylder en tredjedel af billedet, ser selvsikker ud; ti små blobs ligner pynt, der er tilføjet i sidste øjeblik.

Organiske fotorammer: blobs og buer

At beskære et foto til en blød form er den letteste måde at få almindelige billeder til at se designede ud. En bue føles arkitektonisk og rolig, en cirkel føles personlig, og en blob føles afslappet og venlig. Brug én rammeform konsekvent, så et gitter af opslag opleves som et sæt.

• Buerammer passer til indretning, keramik, bryllupper og alt, der skal føles fredfyldt.
• Cirkelrammer passer til ansigter: teamsider, anbefalinger, talerkort.
• Blobrammer passer til mad, planter, kæledyr og produkter med uregelmæssige omrids.
• Hold baggrunden omkring rammen rolig, så formen kan læses.

Studio i Gradiently kan beskære ethvert foto til en bue, cirkel eller blob og tone det i baggrunds-Markens farver som mono, duotone eller en blød lavering, så fotoet og fladen bag det hører sammen. Duotonefoto forklarer toningsmulighederne.

Organiske gradienter og bløde former

Former behøver ikke hårde kanter for at føles organiske. Overlappende radiale gradienter med blød udtoning opleves som pøler af farve, som blæk, der breder sig i vand. Det er idéen bag mesh-gradienter, og du kan efterligne det med lagdelte radiale gradienter.

En CSS-blob, du kan kopiere

På nettet bruger den enkleste blob border-radius med otte værdier: fire vandrette radier, en skråstreg og så fire lodrette. Animerer du mellem to sæt værdier, ånder formen langsomt. MDN’s reference til border-radius forklarer syntaksen.

.blob {
  width: 320px;
  aspect-ratio: 1;
  background: radial-gradient(circle at 35% 30%, #f4a99a, #d9776a);
  border-radius: 42% 58% 63% 37% / 41% 44% 56% 59%;
  animation: breathe 12s ease-in-out infinite alternate;
}

.blob img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
}

@keyframes breathe {
  to { border-radius: 58% 42% 38% 62% / 55% 61% 39% 45%; }
}

@media (prefers-reduced-motion: reduce) {
  .blob { animation: none; }
}

Til mere komplekse omrids tegner du formen som en SVG-sti og bruger den med clip-path. Hold stien til en håndfuld jævne kurver af samme grunde som ved tegning i hånden. Har brandet også brug for varme i farver og typografi, passer legende branding naturligt sammen med bløde former.