Share
Om du är på Twitter och läser den här bloggen, är chansen att du redan har anpassat din profil med en cool twitter-bakgrund. I denna handledning skapar vi en egen kring en central maskot: en mycket detaljerad twitterfågel, som du måste rita dig själv! Gör dig redo att göra mycket mer än att klicka i den här artistiska handledningen!
När du skapar en Twitter-bakgrund finns det olika saker att ta hänsyn till. Det största problemet är att du inte kan centrera en bild i din Twitter-profil. Så ge upp några idéer du kan ha om inslagning av grafik runt kroppen. Du kan antingen skapa en plattformsbar design eller vänster justera bilden. Eftersom kroppstorleken inte förändras enligt den upplösning den ses på måste du också oroa dig för att hålla huvudinnehållet synligt över flera skärmstorlekar och bleka ut din bild sömlöst.
Om texten går för långt till höger kan det hända att många inte kan läsa den. Om din illustration är mycket detaljerad och slutar efter bara 250 pixlar, kommer den att se ud på stora skärmar, eftersom det inte bleknar ut till höger och botten. Och äntligen arbetar du i webbformat så tänk på din filstorlek när du utformar den.
För att klara alla dessa krav skapar vi en relativt liten bakgrund som kommer att rikta sig mot vänster sida och blekna ut mot botten och höger. Och genom att blekna ut, menar jag inte att radera hälften av bilden, utan gradvis med färre och färre element. Det är en vanlig praxis för Twitter-bakgrund att inkludera en kort bio och länkar till var personen kan hittas online.
Min egen bakgrund har inte dessa, eftersom jag tycker att profilfilmen är synlig ändå till höger och du får också välja en länk som människor kan använda. Jag länkar till min portfölj, där det finns flera länkar i min online-närvaro, om någon är intresserad. Hur som helst, för att göra det mer praktiskt, finns det en kort bio (i detta fall totalt falsk på grund av brist på inspiration) och ett par länkar.
Ta en titt på bilden vi ska skapa. Du kan se den sista bilden förhandsvisning nedan eller fullstorleksbilden här.
Det första att göra här är att dra mascoten, en twitterfågel. Det finns massor av söta, ljusa och glänsande twitterfåglar där ute så jag ville ha en som inte bara var annorlunda, men det representerade min stil. När allt kommer omkring handlar en twitterprofil om ägaren.
Processen som ses nedan är väldigt utsträckt men kan förkortas. Jag vill inte att du ska tro att det här är bara sättet du ska göra det, men om du inte har mycket erfarenhet av linjekonst är det bra att ta dig tid och få varje steg rätt. Med tiden, efter att ha blivit mer erfaren, kan en enkel klotter vara tillräckligt för att komma igång i Photoshop.
För att börja med, börja med att få en vanlig papper och rita ut några grundläggande skisser av fågeln. Fokusera på att få hållning rätt och oroa dig inte för detaljerna. de kommer att täckas senare.
Som du kanske märker är positionen på benen i skärmdumpen nedan inte identisk med slutresultatet. Faktum är att jag ändrade dem i alla skeden eftersom det är lite svårt att få dem att se dem naturligt och estetiskt samtidigt. Bara spåra en grov bild av din fågel i detta första skede.
Nu behöver du lite spårpapper. Det är i grunden ett halvt transparent papper som gör att du kan rita något ovanpå en referensbild, i detta fall vår grova skiss. Jag använde två pennor: en 2B och en 8B. Ju högre antal, ju mjukare spetsen. Jag använde 2B för att spåra konturerna och 8B för att rita skuggor. Suddgummi skärs i halva, så att du kan använda den skarpa kanten för att radera små områden. Det är bra för att lägga till höjdpunkter.
Jag slängde också ett extra ark spårpapper inuti för att göra den grova skissen mindre synlig. Om din bild har för mycket kontrast, är det en bra idé att blekna det mer så att du inte blir förvirrad.
Använd blyertspenna för att spåra fuglens kontur. Nu kan du börja oroa sig för detaljerna.
Du borde nu ha fyllt i den allmänna beskrivningen av varje del av fågeln.
Börja lägga till skuggning, så att fågeln ser 3D ut. Observera att skuggorna är väldigt grundläggande och behöver inte se väldigt realistiska ut. Det här är bara en del av hela processen, och inte en slutlig bild så oroa dig inte om att det ser bra ut. Allt du behöver göra är att tydligt definiera former och belysning.
Den här delen är viktig eftersom alla skuggor blir kontinuerliga linjer i framtida steg. Tomma utrymmen är höjdpunkter och parallella linjer är skuggor. Gör linjerna mer avlägsna och kortare, och det mänskliga ögat kommer att uppfatta det som en gradient. Detta är i grunden en handritad halvtonskärm.
Ta en annan bit av spårpapper och placera den över penna skiss du gjorde. Den här gången använder vi den här som en referens för den slutliga, linjekonstfågeln.
Allt du behöver göra är att dra parallella linjer över skuggorna. För att blekna dem ut, dra bara linjerna kortare och kortare.
Kom ihåg att du kan tona ut konturerna, inte bara skugglinjerna.
Denna gång, var mycket försiktig med alla detaljer. Gör dessa former som riktiga fjädrar, inte enkla kurvor.
Fortsätt denna process över huvudet och kroppen. Se till att du lämnar tillräckligt många höjdpunkter.
Som jag sa gick fötterna under en sista ändring. Jag ville ha något mellan en attackposition och låg nivåflygning.
Jag gjorde den andra vingen i allmänhet mörkare än den första. Det gör att ritningen ser mer dynamisk och realistisk ut. Att kasta lika ljus över hela fågeln kan göra det ser mindre intressant ut. Även om hållningen är för symmetrisk kan du alltid lita på belysning för att krydda det lite.
Och där är allting gjort. Kanske lite för lång och sträckt, men det spelar ingen roll eftersom du inte kan se allt i twitter bakgrunden ändå.
Skanna det eller ta ett foto av det och sätt det i Photoshop. Gå till Bild> Justeringar> Nivåer och öka upp kontrasten betydligt. Mörk ut linjerna, men ta upp några av höjdpunkterna också.
Gå till Välj> Färgområde. Inne i fönstret klickar du på ett svart område på fotot så att du har ett urval av de svarta linjerna. Tryck på OK och kopiera valet (Command + C).
Skapa ett nytt Photoshop-dokument som är 750 px i bredd och 700 px i höjd och med 72 dpi. Klistra in fågeln (Command + V), dubbelklicka på dess lager och lägg till en färgöverläggseffekt. Välj en mörkblå (# 387ebc) och tryck på OK. Skapa ett nytt tomt lager (Command + Shift + N), klicka på båda lagren i lagmenyn och slå ihop dem (Command + E). Det kommer att platta lagstilen.
Nu i ett nytt tomt lager under linjekonst, använd Pen Tool (P) för att ge fågeln en bakgrundsfärg (# 33ccff).
För den här delen är det bäst att ha en pennplatta, men det är inte helt nödvändigt. Du kan antingen använda en vanlig borste eller pennverktyget för att skapa höjdpunkter och skuggor. Jag gjorde det med en tablett. I det här steget, spåra de första få höjdpunkterna med vit och gör det till en klippmask så det syns bara inuti fågeln.
Dra nu större slag av en ljus cyan (# 7ff4fe). Skapa ett separat lager för var och en av dessa.
Under den föregående, målar du ännu större höjdpunkter med en något mörkare cyan (# 4de2ff).
En slutlig höjdfärg kommer att vara några gråa accenter (# ddded9).
Använd nu en ljusgul (# f5e456) för att färga näbben och lägga till några skuggor med en mörkare gul (# bcb833).
För att slutföra fågeln, fyll i näbben med samma mörkblå och dra ögat. Använd vit, och samma mörkgul.
Du måste gå tillbaka till ritbordet nu för att måla några moln. Jag använde flera typer av kommentarfält för detta. Detta är ett socialt nätverk, comic style shout-outs är rätt på cue. Spåra konturen med en grå färg (# d0cdbe).
Ge bakgrunden en ljusare nyans (#edeedb).
Dra bara några tunna linjer för skuggor (# dfe0d0) och höjdpunkter (#ffffff).
Upprepa denna process för att skapa några andra typer av kommentarfält. Kombinerade uttrycker dessa enkla uttalanden, tankar och utrop. Jag försöker att inte skrika för mycket på min profil, så oroa dig inte, det här är rent dekorativt. Jag skriker inte på mina följeslagare :)
Det är dags att lägga till bio och länkar. Den enkla lilla texten är Calibri Regular och rubrikerna är i Rockwell Std Bold. Ampersand är Fru Eaves Medium Kursiv. Använd samma färger som fågeln.
Kom alltid ihåg att prova olika antialiasingmetoder när du arbetar med typ, speciellt vid låga upplösningar. I det första exemplet är ordet i skarpläge. Lägg märke till att de mellansta bokstäverna tycks spänna och släppa sig under bottenlinjen. Det kan vara subtilt, men det är ett misstag.
Inte bara det, men bokstäverna är inte ens parallella. Varje verkar ha sin egen orientering. För att åtgärda detta, prova en alternativ metod för antialiasing, i detta fall stark. Nu har bokstäverna en gemensam orientering och en jämn grundlinje.
Medan den föregående kan vara en subtil fix, är nästa ett mycket vanligt misstag. Ojämn spårning kan leda till att vissa bokstäver överlappar varandra och andra är för långt från varandra. Medan du inte brukar märka dessa buggar vid vanliga små textlinjer kommer stor text att avslöja dessa inkonsekvenser.
För att åtgärda detta måste du manuellt ändra mellanslag mellan varje bokstav. Välj typverktyget (T), klicka inuti en textrad och dra ett urval av de två första bokstäverna. Ange ett lämpligt nummer i spårningsfältet. När du har hittat precis rätt utrymme, välj det andra och tredje bokstaven och gör detsamma. Gå igenom varje mellanslag med två-till-två bokstäver tills hela spårningen är korrekt. Du kan se skillnaden mellan anpassad och standardspårning i ovanstående och underexemplet av ordet.
Hitta det vektorformiga lagret där du spårade fågeln. Klicka på miniatyrbilden för vektormasken för lagret för att få fram banan. Använd sökvägsverktyget (svart pil) för att välja sökvägen och kopiera den (Command + C). Öppna illustratör, klistra in sökvägen (Command + V) och tryck enter i fönstret som öppnas i Illustrator (Compound Shape). Välj strokefärgen och välj vit (den är svart här bara så att du kan se den). Ställ in strokevikt till 2 pt.
Ta upp Stroke-panelen (Fönster> Stroke) och använd följande inställningar. Kom inte ihåg den grå bakgrunden.
Kopiera det (Command + C) och klistra in det (Command + V) i Photoshop-filen som ett smart objekt. Upprepa processen med kommentarsrutorna också.
Använd samma typsnitt, skapa några typografiska accenter runt kommentaren. Vi använder också en mängd olika fåglar från Birds 2 Vector Pack i Go Media's Arsenal. Klistra in dem bara som smarta objekt och ge dem ett färgöverlägg med vilken färg du vill.
Använd olika fåglar med olika färger. Försök att inte överdriva det, eller överlappa dem.
Jag ville också ge idén om fåglar som bär meddelanden, så jag lade bokstäver runt, i närheten eller innehas av de faktiska fåglarna. De är alla med en av de tre tecknen vi använde tidigare.
Upprepa motivet i övre hörnet också. Gör det inte vetenskapligt. Håll orienteringen slumpmässig, och inte nödvändigtvis alla i en riktning.
Och sprida bara fåglarna över hela duken. Kom ihåg att tona dem ut men till höger och botten genom att placera färre och färre.
Det är allt! Vår twitter bakgrund är komplett. Du kan se den sista bilden förhandsvisning nedan eller fullstorleksbilden här.
Detta är den version jag har på min Twitter-profil.
Accentsconagua