5 sätt att öka kontrasten i din webbdesign

Är ditt designprojekt saknat den speciella popen? Det är troligt vad du saknar är tillräckligt med kontrast. Kontrast ger differentiering mellan element, vilket gör att var och en ser mer individuell, framträdande och speciell.

Designkontrast skapas på ett antal sätt och använder alla olika typer av element. Från typografi till färg till rymd kan skapa kontrast ta en design från bleh till wow. Här är fem sätt att göra det.

1. Gör det större (eller mindre)

Symmetri och order kan vara en fälla av sorter när det gäller att skapa en kontaktpunkt i designen. För många element med lika stor vikt kommer äntligen att se ut på samma sätt.

Den enkla lösningen är att göra ett element betydligt större eller mindre.

Objektet som är annorlunda blir den närmaste fölpunkten. Användaren kommer att dras till det området av duken eftersom det är annorlunda.

Att göra ett element, foto eller textblock större eller mindre är mer än bara fysisk storlek; det är också visuell vikt. Det enklaste sättet att förstå detta är med typografi. Titta på bilderna ovan. Båda orden är samma? Storlek? men notera hur mycket mer vikt en av versionerna har. Denna kontrast beror på tjocka mot smala streck i brevformerna.

Du kan även tillämpa samma begrepp på nästan alla andra designelement.

Titta på webbplatsen för Little Flyers ovan. Var särskilt uppmärksam på den textbaserade navigeringen högst upp på sidan och knapparna längst ner på skärmen. Vilken text drar ögat snabbare? Varför? Hela typen är lika stor, men behandlingen med en låda inuti ett färgstarkt foto gör det verkar större.

2. Lägg till lite textur

Med platta och minimala stilar som dominerande förare i designtrender just nu är texturen mindre vanlig än den en gång var. Men du ser det fortfarande på många ställen, kanske utan att ens tänka på det.

Att byta från ett platt element till allt med textur, mönster eller tredimensionell stil hjälper till att skapa ett fokusområde. Och samtidigt som du lägger textur till en bakgrund kan vara den omedelbara lösningen, den kan även användas på andra sätt.

Tänk på ett textelement med en texturerad känsla. (Det här är ganska populärt med många typografiska typografityper.) De primära typerna av textur är grova och smidiga. De kan arbeta med varandra eller isolerat för att bidra till att skapa visuellt fokus. När du arbetar med tryckt design kan du fysiskt lägga till textur baserat på vilken typ av papper som används, bokstäftsalternativ och genom andra publiceringsmetoder.

3. Ändra formen

Titta på bilden ovan. Vad är det första du ser? För mig är det det cirkulära objektet med frågetecknet inuti.

Vet du varför? I en bild full av rektanglar är den enda cirkeln. Skillnaden i objektet är vad som gör att den sticker ut. Att karaktären är upp och ner är också en uppmärksamhetsdrivare. Att ändra formen eller orienteringen av ett element kan lägga till omedelbar påverkan.

Prova det nästa gång ditt design känns lite platt. Runda kanterna på knapparna. Lägg ett foto i en cirkulär ram snarare än rektangulär. Välj ett vertikalt foto. Använd en placering som bara är lite utanför kilter.

Någon av dessa tekniker kan göra dig lite obekväm först. Men fortsätt att experimentera och spela med alternativ tills du förvandlar samma gamla rektangel till något lite mer intressant.

4. Lägg till färg (eller ta bort det)

Färgteori är en av de viktigaste begreppen till ditt förfogande. Genom att ändra nyanser, eller lägga till eller ta bort färg, kan du ändra den övergripande stämningen i en design. Färg kan få saker att verka stora eller små, vågade eller dämpade. Tricket till några av de mest lysande färgpalettarna är genom användning av kontrast.

Den enklaste formen av kontrast börjar med färghjulet. Parning av färger längs ratten resulterar i olika kontrasterande kombinationer:

  • Komplementär: Högintensiva par från motsatta sidor av hjulet
  • triadic: Färger på avstånd i en tredjedel steg längs hjulet.
  • Split-kompletterar varandra: En färg och de två färgerna bredvid komplementär nyans.

Det finns andra färgkontrastalternativ som kan fungera särskilt bra om du redan har en färgpalett och inte har något emot att göra subtila justeringar.

  • Blanda varma, kalla och neutrala färger.
  • Ändra din basfärg genom att lägga till toner och toner så att mättnaden skiljer sig från färg till färg.
  • Intertwine ljus och mörka färger; Tänk på det som yin och yang.
  • Lägg till element utan färg. Svarta eller vita accenter kan lägga tonvikten i utrymmen med mycket färg; och färg kan lägga till kontrast till svartvitt.

5. gör någonting oväntat

En oväntad form eller detalj kan bara lägga till rätt mängd kontrast. En överraskning i designen är något som inte helt matchar allt annat, men fungerar fortfarande i harmoni med det.

Dessa element innefattar:

  • Ett element av asymmetri i en annars symmetrisk design.
  • En visuell signal som leder dig genom konstruktionen, som en intensiv form eller ögonspårningsmönster, som används på webbplatsen för Vibrant, ovan.
  • En ändring i ett mönster eller ett repetitivt element.
  • Ändra orienteringen eller inriktningen av ett element eller en text, som i Anima (med bokstaven? I?) Ovan.
  • Ändra positionen eller storleken på ett element i en rad visuella bilder.
  • Olika bildformat, till exempel byte från foton till en illustration eller en aningstips.
  • Blanda komplexa och enkla visuella eller typografiska stilar.

Slutsats

Det fina med att ändra kontrast mellan element är att det kan ge en omedelbar inverkan i ett designprojekt. Genom att ändra elementets utseende kan du ändra visuellt fokus och hjälpa användarna att fästa in på den del av designen som är viktigast för meddelandet.

Brist på kontrast är ett vanligt problem som ofta är lätt att åtgärda.Så många gånger när du hör de fruktade? Gör det pop? från en klient eller medarbetare, vad de verkligen försöker säga är att de skulle vilja se mer kontrast i designelementen. Nu är du beväpnad med verktygen för att ta ut den utmaningen.