Det är ett obestridligt faktum: Användning av suddiga bilder är en trendig webbdesignteknik år 2015. Det verkar som om du ser ut överallt, finns det någon del av suddighet.
Men det här är inte en lösning på några av dina fotoproblem. Det är en distinkt teknik som kräver övning till perfekt och uppmärksamhet på detaljer för att få det rätt. Så innan du hoppar på trenden, tänk på alternativen för att använda suddiga bilder för att bestämma om det är rätt för dig och hur du kan utnyttja denna teknik optimalt i dina projekt.
Suddiga bilder är trendiga
Vi kunde ägna hela sidorna till antalet webbplatser med hjälp av suddiga bilder. Trenden är en stor sak just nu.
Det är det första du behöver tänka på när du går vidare med en idé som innehåller suddig bild.
- Vill du vara en del av trenden?
- Kan du använda trenden på ett sätt som är lite annorlunda än andra webbplatser där ute?
- Är det din stil eller lite för överanvändd för din smak?
- Kommer du att vara OK med webbplatsdesignen efter trenden går sin kurs? Eller behöver du en omkonstruktion?
Det är absolut inget fel med att skapa något som är trendigt. Men det är ett beslut som du bör överväga från början. Att skapa en webbplats med suddiga bilder - beroende på önskad stil och användning - kan vara ett tidskrävande åtagande och om du inte är erfaren i fotoredigering, kan det behövas ytterligare utbildning.
Oskärpa är en teknik att använda med bra bilder
Detta kan vara den viktigaste meningen du ska läsa när du tänker på suddiga bilder. Det fungerar bara om du har bra bilder att börja med. Blur är inte ett sätt att? Fixa? en dålig bild.
Att säga det på ett annat sätt. Om du får ett suddigt fotografi och berättade för att göra en hemsida ur den, är det inte trendigt. Det är ett dåligt foto. Om det är din situation, så är det inte tekniken för dig. (Du kanske vill börja tänka på att skapa ett konstelement med typografi eller letar efter bilder.)
Men om du har en fin bild som du vill få några miles från eller använda på ett nytt sätt, är den suddiga tekniken en möjlighet. Det finns flera sätt att tänka på suddning (vi fokuserar på vardera nedan) men det första steget är att förstå hur man faktiskt skapar suddning. Adobe har en ganska fin handledning för att komma igång i Photoshop.
Blur hela bilden
En av de saker som har bidragit till den suddiga bildutvecklingen är en annan trend: Användning av hjältehuvuden. Designers sätter teknikerna tillsammans för att skapa fullskärmsstil, suddiga bilder som dominerande visuella bilder på sidor på webbplatser.
Webbplatsen för Trellis Farm använder en ikonisk bild av en gård för att ge dig en känsla av plats för sin webbplats. För extra intresse är fotot svart och vitt - för att förmedla den gammaldags känslan - och skiktad med en stor typsnitt för att fånga din uppmärksamhet. Rullningen fortsätter den känslan samtidigt som färg läggs till blandningen. Oskärpa är trevligt för att du vet vad som finns på bilden, och det hjälper användaren att fokusera på texten och nästa åtgärd för att ta på skärmen.
Varför det fungerar:
- En suddig bakgrund kan ge fokus till lager ovanpå bilden, till exempel text. Var noga med att välja en omfattande typsnitt.
- Det kan skapa nytt intresse med en bild som du använder regelbundet, till exempel ett standardmallfoto.
- Den kan användas med nästan vilken typ av innehåll som helst i nästan vilket färgschema som helst för universell överklagande.
Bakgrund och lagrade bilder
Oskärpa är inte en fullbilds-teknik. Specifika delar av en bild kan vara suddiga för påverkan. Medan det är vanligare att se suddiga bakgrunder med ett skarpt förgrundsfokus, tar vissa konstruktörer motsatt tillvägagångssätt för ett nytt alternativ som har en suddig förgrund med en in-focus bakgrund.
Anchour-byrån använder oskärpa i bilder på landningssidan. Tekniken som används i bilden kan vara en del av den faktiska fotograferingen eller du kan skapa samma effekt i bildredigeringsprogram. Tricket här när du skapar denna oskarpa stil är att du inte kan berätta att den var? Skapad? och det ska se naturligt ut som om fotot togs på det sättet. (I bildredigeringsprogrammet kan du uppnå detta med hjälp av Gaussian Blur-verktyget med små, stegvisa justeringar.)
Varför det fungerar:
- Oskärpa skapar visuell kontrast och kan tona upp den upptagna känslan av en bild.
- Det ändrar bildperspektivet och användarens syn på det visuella.
- Den lägger till dimension till en bild som annars annars kan vara platt för en nästan 3D-rendering.
Dramatisk suddighet för abstrakt konst
När du behöver en bakgrundsbild för din webbplats men kan hitta ett mönster eller en färg som gör tricket, kan ett foto med en dramatisk suddning vara den perfekta fixen. Tänk på en dramatisk suddighet för att vara allt som gör att fotoinnehållet inte kan ses, och det kan göra bilden helt oigenkännligt.
Detta är ett populärt alternativ för webbplatser som lanserar eller marknadsför ett digitalt projekt med en abstrakt oskarp bildbakgrund bakom en telefon som visar produkten. Piction använder samma bild i bakgrunden och i telefonen med olika nivåer av zoom och oskärpa för en ganska iögonfallande design.
Varför det fungerar:
- Tar fokus på den presenterade produkten.
- Skapar en anpassad bakgrund istället för att använda ett mönster som kan vara på andra webbplatser.
- Ger designern kontroll över färg och känsla när det gäller hur den abstrakta oskärpa fungerar från skärpa till mjuka färger och former för att läsa bakgrundsbilden och ansluta till varumärket.
Subtila oskärpa för vilken bild som helst
En liten grad av suddighet kan också fungera i många andra typer av foton och behöver inte användas enbart för en helskärmsbild. Designers kan lägga en ledtråd av oskärpa till en bild som behöver lite förgrundsfokus för att hjälpa användarna att titta på de rätta delarna av en bild, att stylera en logotyp eller bara för att skapa en mer komplex visuell.
Zeo logotyp använder en subtil men fin oskärpa i den runda designen. Oskärpet tvingar dig att titta på logotypen närmare på grund av den intressanta formen och kantningen på den ena sidan av logotypen har i jämförelse med skärpan på den andra sidan. Tekniken framhävs ytterligare, eftersom webbdesignen som helhet använder oskärpa på andra ställen, till exempel i bakgrunden av den dominerande bilden på målsidan.
Varför det fungerar:
- Små oskärpa kan skapa ett överraskningselement.
- Den drar fokus på specifika delar av ett foto, med visuell fokusering. (Ta en titt på några av kampanjerna på Zeo-webbplatsen för andra användningar av subtila sudd för fotofokus.)
- Det kan ge dig rätt mängd kontrast till lager andra element på en sektion av en bild, till exempel text, på samma sätt som en helskärmsläckning kan fungera med en hjältehuvud.
Använd det för video, för
Du kan para trumbenstrenden med ett annat varmt designelement också - video. Du kan använda den precis som du skulle med någon annan bildteknik. Det fungerar på samma sätt (även om redigeringsverktygen och processen är lite annorlunda).
Nivå 2 Design använder blå och en skärmtypseffekt för att lägga intresserade till en helskärmsfilm. (Uppdatera webbläsaren för att se mer suddiga videor.) Effekten är rolig och frisk och fungerar med video som ska ha en gammal skola känsla. De snabba videoslingorna är läsbara och uppmärksamhetsfulla.
Slutsats
Det finns många sätt att använda oskärpa effektivt för webbdesignprojekt. Hemligheten - om det verkligen finns en - är att skapa en suddig effekt som smidigt integreras i resten av designen. Och du kan göra det nästan genom att tänka på oskärpa i ytterligheter.
Använd mycket oskärpa för stor påverkan och en abstrakt känsla. Använd en minimal oskärpa för att skapa subtil kontrast och ställa in fokus. Som med vilken design som helst, testa det på några användare innan lanseringen och se vad de tycker. Märker de suddigheten? (De flesta icke-designers kommer inte att tänka på det.)