Fotografering är en av dina mest kraftfulla resurser som designer. Här ska vi titta på några kloka och unika sätt att skapa fotocentriska mönster med flera bilder.
Använda flera foton
Det är alltid trevligt att hålla ditt innehåll till ett minimum för att behålla en ren, lätt att skanna sida. Att använda en primärbild med någon åtföljande text är en enkel modell som fungerar för många ändamål, men när du utformar för verkliga världskunder har du ofta en hel mapp full av resurser som du förväntas använda.
Som designer kan det vara ganska svårt att räkna ut ett attraktivt sätt att blanda olika bilder till en sammanhängande layout, speciellt om du arbetar med utskrift istället för ett obegränsat interaktivt utrymme. Spara dina timmar med att fiska genom att snabbt läsa igenom våra exempel. Känn dig fri att stjäla dessa idéer och använda dem som din egen!
Stack 'Em
Fullblösta fotografier kan göra en mycket attraktiv och iögonfallande sida. Ofta lämnar designers tanken och den allmänna layouten av ett enda helt blöderfoto när det visar sig att de måste ha två bilder eller mer.
Det är dock ganska lätt att skapa en layout som maximerar två bilder. Till att börja med, försök att dela sidan halvvägs och ge lika utrymme till var och en.
Som du kan se hade texten varit svårt att placera direkt på bilderna, så jag ritade helt enkelt en rand som hållare för rubriken. För att förhindra att en hårddisk visas visar jag de två bilderna tillsammans under textområdet.
Denna effekt är utmärkt för att visa inte bara relaterade bilder utan även teman med en konceptuell dualitet: mjuka och hårda strukturer, dag och natt, etc.
Var inte en fyrkant
Med samma allmänna idé i åtanke kan du uppnå många olika effekter. Till exempel, i designen nedan skapade jag diagonala streck av innehållet ganska typiska horisontella linjer.
Observera att jag har hållit hela mitt innehåll vid normala rotationer. Varken texten eller bilderna är diagonala, bara de former som de har satts in har denna egenskap. Detta håller allt gott och lätt att läsa / tolka samtidigt som du kan utnyttja en mer unik layout.
Foto galler
Ett extremt populärt och mycket praktiskt sätt att arbeta massor av bilder på en enda sida är att ordna dem i ett rutnät.
I exemplet nedan började jag med att skapa guider i Photoshop som motsvarar ett ungefärligt kvadratiskt rutnät. Detta är ett viktigt steg för att se till att du får proportionerna rätt och sparar dig mycket krångel i längden. Härifrån faller du bara i några bilder och maskerar dem till olika former inom ramen för din övergripande rutnät.
Som du kan se fyllde jag utrymmena med fasta färger, som jag grep med ögonbrynaren från de omgivande bilderna. Du vill alltid se till att alla fyllnadsfärger som du använder i en design går bra med fotograferingen och ett av de bästa sätten att göra detta är att fånga dina färger direkt från bilderna.
Skapa rutnät
Den grundläggande rutnätlayouten som du ser ovan kommer i en miljon olika variationer. Prova att röra med storleken på enskilda celler, förhållandet mellan färgfyllningar och bilder etc.
En mycket vanlig teknik är att accentuera de enskilda bilderna genom att skapa tydliga separationer. I grund och botten gör du bara en tjock vit linje runt kanten av varje foto och du får en annan men lika attraktiv effekt.
Redaktionell
För ett mer redaktionellt utseende, försök layouten nedan. Här har vi en bild i första hand och sedan tag en relaterad bild för att följa den med texten. Det är inte till skillnad från en mycket enkel version av gallret ovan, du använder bara färre bilder.
En snabb anteckning om att använda flera foton i en enda design: Se alltid till att färgerna går bra tillsammans. När jag skapade layouten ovan togs den primära bilden i svartvitt och den sekundära bilden var i färg och hade en väldigt cool vitbalans. Det blåaktiga ljuset var helt enkelt förödande på min färgschema så jag desaturerade bilden och plötsligt såg de två bilderna ut som om de var från en enda skott.
Fotografisk text
Jag är en stor fan av maskerande bilder till text och har gjort det i ett par senaste artiklar. Här ser vi det som ett sätt att arbeta i ett annat relaterat foto på ett subtilt sätt.
Eftersom den primära bilden är av en träbro, tog jag en trästruktur för texten. Resultatet knyter verkligen texten snyggt med fotografiet under det, även mer än en enkel eyedroppered färgfyllning skulle ha.
Klä av sig
Vårt sista förslag använder en vertikal remsa layout, perfekt för när du försöker skapa en övergripande miljö eller humör och behöver inte nödvändigtvis visa de fullständiga bilderna.
Denna effekt kan vara överväldigande om du går för långt med den. Vidare kan det vara svårt att placera text ovanpå så många olika bilder. Av dessa skäl och mer är det bra att skilja ut en bild och presentera den mer framträdande än resten.
Återigen märker att mina proportioner är mycket avsiktliga. Först delar jag sidan i hälften och splittrar sedan höger sida i tredjedelar.
lektioner
Vi gick mycket över väldigt snabbt. Viktigare än de enskilda exemplen är de lektioner som varje lär oss. För det första kan du ibland ta med två bilder på en fullständig sida som om de var en enda bild. Tänk på att du inte alltid behöver utforma helt horisontella eller vertikala linjer.
När du använder ett galler av bilder, se till att du tar dig tid att lägga ut dina guider så att de relativa proportionerna är korrekta (om du inte går för en organisk layout). Fyll i några luckor med enkla färgfyllningar genom att extrahera framträdande färger från de omgivande bilderna. Experimentera med att maximera rastlinjens utseende eller gömma dem helt.
Slutligen, när du jobbar med flera bilder, är det nästan alltid en bra idé att fortfarande ha en framträdande bild som skiljer sig från resten. Du kan se detta på jobbet i de flesta exemplen ovan. Skapa alltid en visuell hierarki och försök att undvika att ge allt på din sida samma visuella vikt och vikt.
Slutsats
Jag hoppas att exemplen och lektionerna i detta inlägg har satt din hjärna att spinna och tänka på nya sätt att integrera flera fotografier i dina mönster.
Det är alltför lätt att få bäras och skapa en upptagen, överbelastad sida så var försiktig med att använda lite begränsning och sträva efter klarhet över kaos. När du fortsätter att lägga till visuella element på sidan, kom ihåg att det finns en punkt med minskande avkastning där du faktiskt sänker effekten av designen.