Håll det enkelt, dumt. Detta begrepp går från 1960 när US Navy genomförde KISS-principen, vilket hävdar att de flesta system fungerar bäst om de är enkla, snarare än komplicerade. Detsamma gäller för stort sett alla designprojekt.
De flesta grafiska designers lär sig om KISS tidigt i sin karriär. Så hur kan du göra det? Att skapa en enkel design är lite mer komplicerad än du kanske tror. Här är sju regler att utforma av, som hjälper dig att skära bort alla röran och skapa ett vackert enkelt konto.
1. Ange ett mål per sida
Inledningen av en enkel design börjar med ett mål för projektet och specifika mål för varje sida på webbplatsen. Varje sida borde leda användarna till en åtgärd, med undantag för navigering och sidfot.
Det här kan vara allt från att klicka på en länk, ange information i en form, titta på en video eller spela ett spel. Men varje sida bör fokusera på en enda användaraktivitet eller konvertering.
För många saker att göra kan överväldiga användare. De kan förlora synen på vilka åtgärder som bör genomföras och kanske göra det mindre önskvärda valet. Planera designen så att varje sida leder användarna till ett enda mål. Varje användbar knapp ovanför rullningen och under rullningen på samma sida ska göra samma sak. Denna konsistens hjälper användarna att förstå varför de är på din webbplats och vad de ska göra, enkelheten i dessa val gör designen lätt och engagerande.
2. hålla sig till två typfamiljer
Det finns så många designriktlinjer som rekommenderar tre teckensnitt för ett projekt. Du kan effektivisera det ännu mer med två robusta typfamiljer.
Leta efter en typfamilj som innehåller flera vikter med mycket kontrast mellan de vanliga och djärva eller svarta alternativen. För ännu mer känsla väljer du ett visningsalternativ som innehåller några alternativa tecken som du kan använda i stora rubriker.
Sedan är allt du behöver göra att mixa och matcha från en kroppstyp och ett teckenfönster för att få bra kombinationer av bokstäver för hela designen. Använd två typfamiljer precis som du skulle om du valde fler alternativ med specifika användningsområden för vissa vikter eller stilar.
Du kommer att upptäcka att det här kan hjälpa dig att skapa en lättläst och lättanvänd typografipalett som är lätt att hantera och har visuell konsistens.
3. Använd konsekvent anpassning
Vänster, mitten eller till höger - oavsett inställning du gillar, håll dig fast vid hela konstruktionen. Detta inkluderar anpassning som objekt, till exempel textrutor och element som inte är lika men passar ihop i grupperingar.
Anpassningsbar gör ett bra jobb med detta med texten på startsidan. Trots text med olika antal rader på bilden, raderar varje rubrik upp med anropsknappen. Avståndet mellan element är också konsekvent.
Det är dessutom att denna konsekventa anpassning genomförs på rullningen med andra rubrik- och CTA-par.
Anpassningen matchar flödet av glidreglaget, som också rör sig i en komplementär riktning. Vänster- och mittinriktningar är de vanligaste alternativen när det gäller textelement eftersom de är läsbara. Med längre text är vänsterjustering det föredragna alternativet.
4. Skapa hierarki
Användare borde inte behöva tänka på vad man ska titta på eller hur man flyttar över en design. Även de enklaste visuella kompositionerna borde ha en distinkt hierarki.
Det börjar med en dominerande visuell. Det kan vara en bild- eller video- eller textvisning eller något annat som gör ett första intryck.
Då borde det finnas någon typ av text som berättar användaren vad designen och webbplatsen försöker kommunicera. Detta är typiskt i form av en enkel rubrik som fungerar med den dominerande visuella.
Tredje är en sekundär bit av text eller åtgärd för användarna att slutföra. Det slutliga visuella elementet är en navigeringsmeny. Användare förväntar sig att hitta alla dessa element och ögat är utbildat för att flytta igenom elementen i i princip denna ordning. Gör det enkelt för dem genom att utforma på det sättet.
5. Ge delar mycket utrymme
Om du inte vet det nu, begå det här till minnet: Vitt utrymme är din vän.
Ge varje element i designen gott om utrymme. Rymden kommer att bidra till att uppmärksamma enskilda element, ta upp? Utrymme? så du är inte frestad att röra på duken och hjälpa till att skapa en övergripande design som har fokus.
Tricket att använda utrymme väl är konsistens. Ställ in regler för mängden utrymme som kommer att omge enskilda element eller passa mellan textrader. Om designen slutar se ut för barren kanske du behöver dra tillbaka på avståndet bara lite. Du vet att avståndet är rätt när du öppnar designen fräsch och går direkt till de platser du vill att användarna ska se först. (Är du osäker på vad de är? Gå tillbaka till Nr. 4 - Skapa hierarki.)
6. Amp Up Contrast
Designelement med hög kontrast - från färgval till storlek på element - kan ge ett projekt precis rätt mängd visuell finess det behöver, även i de minimala ramarna.
För ett trendigt alternativ, försök en ljus kontrast färgpalett för att fånga användarens uppmärksamhet. Fet färger gör att en enkel design känner sig mer komplex och intressant att ett svartvitt alternativ. För att få ut det mesta av kontrastfärg väljer du nyanser från motsatta positioner på färghjulet med liknande mättnader. Om det alternativet är för mycket för din smak, kan du prova andra färghjulsbaserade par. (Du kan till och med hitta en oväntad ny favorit, till exempel lila och kricka kombinationen ovan.)
7. Använd konsekventa ikoner och element
Konsistens i design är en av de bästa (och värsta) bevarade hemligheterna av mördare design. Det är en av de saker som blir bortglömd alltför ofta, eftersom designprojekt är fyllda med flera knappar eller sociala medier som inte bara matchar resten av webbplatsens ikonografi.
Användargränssnittet bör inte vara en eftertanke.
Det är viktigt att skapa en ikon och ett användargränssnittelement och regler och användar dem genom hela projektet på samma sätt. (Du kan till och med köpa eller hämta ett ikonfontsnitt eller användargränssnittskonfigurationssats om du inte vill skapa dessa från början.)
Välj en färg för element, använd samma svängverkan eller effekten för varje (en för element som är klickbara och en annan för element som inte är) och storlekarelement baserat på användningen. (Det är acceptabelt att ha både en ikonstorlek och ett överdimensionerat alternativ för element som är lite mer grafiska.)
Praticca-försäljningsautomater använder överdimensionerade ikoner, till exempel för att cue användare genom att det finns mer information. A + ligger i en färgad ikon. Alla tre ikoner är identiska bortsett från färgen. De gör samma sak på svävar och alla fungerar på samma sätt när en användare klickar. Samma ikon används mindre på hela webbplatsen för att starta nya bitar av innehåll och hjälpa användare att skanna kopian.
Slutsats
En enkel design behöver inte vara helt minimal eller saknar roliga element eller användargränssnitt. En enkel design är en som är mycket användbar och intuitiv, vilket gör det möjligt för användare att engagera sig utan problem eller komplicerade instruktioner.
Även om det finns plats för mer komplexa webbplatser eller användarinteraktioner, kan de flesta webbdesigner dra nytta av KISS-strategin. Tänk inte över det, och användarna behöver inte heller.