Hvorfor Pixel Art kan være en perfekt træningsgrund til grafisk design

Selvom du ikke var ude for at opleve vidundere ved klassiske videospil fra 1970'erne til 1990'erne, er det aldrig for sent at udvikle en påskønnelse af den distinkte kunstform, der udviklede sig for at imødekomme disse spil behov. Det er en kunstform, vi i dag kender som pixelkunst, og det er en af ​​de bedste måder at tjene dine striber i 2D-computerstøttet grafisk design.

Årsagen til dette er, at pixelkunst stiller store krav til kunstneren. Det kræver mere disciplin og er mere stift end de fleste andre kunstformer. Pixel-kunst tvinger dig til at fokusere og isolere det, der er vigtigst i et billede, og kun bruge det uden at give den finere kontrol, du kan anvende i en mere detaljeret tegningsstil. Det er en “mindre er mere” tilgang til tegning, og det gør dig bedre til at tegne.

Pixel-kunst tager tid at mestre. Når alt kommer til alt opretter du dine billeder en pixel ad gangen, og hvert billede kræver omhyggelig planlægning. Du bliver nødt til at lære at arbejde med en begrænset palet og uden fordel for naturlige kurver. Du arbejder også udelukkende i et 2D-miljø, hvor hvis du har brug for et 3D-look, skal du oprette det ved hjælp af tricks såsom isometrisk perspektiv og parallax-rulning.

At lære at animere sprites og baggrunde er også en fremragende måde at øge dine programmeringsevner på, hvis du selv håndterer et helt spilprojekt. Nu hvor mobile enheder er mere tilsluttet og stadig mangler evnen til vedvarende 3D-spil, 2D-spil gør en genopblussen, og du kan faktisk bruge disse færdigheder til at arbejde for at tjene nogle ekstra penge, når designarbejde ikke flyder frit til din dør.

Pixel-kunst kræver ingen speciel software. Du kan oprette pixelkunst i ethvert grundlæggende tegneprogram. Mange pixelartister startede deres håndværk i enkle værktøjer som MS Paint, men det er bedre at bruge mere sofistikeret software, der bruger lag og brugerdefinerede gitre, så du virkelig kan finjustere dine designs til perfektion. Inkscape er virkelig god til dette formål. Det er gratis, har indbyggede isometriske gitre og fungerer perfekt til pixelkunst.

doc88img02

Med hensyn til hardware kan du bruge en mus, men jeg finder det nemmere at bruge en grafisk tablet, fordi jeg har tendens til at få "mushænder", når jeg laver detaljeret kunstværk, så jeg vil anbefale at bruge mindst en grundlæggende grafisk tablet.

Hvorfor pixelkunst er ideel

Alt for mange mennesker bruger ordene illustrator og designer om hverandre. Virkelig er en illustrator langt under niveauet for en designer. Illustratorer tegner simpelthen ting i henhold til deres kundes anmodning. Designere designer ting i henhold til deres kundes behov. Det er en massiv forskel.

At lære at skabe pixelkunst betyder at lære at innovere kreative løsninger til at imødekomme meget specifikke behov. Det er meget mere end bare at tegne. Planlægningen, opmærksomheden på detaljer, evnen til at arbejde inden for teknologiens begrænsninger og udarbejde strategi for at overvinde disse begrænsninger er det, der gør en stor pixel-kunstner også til en stor designer.

En verden af ​​pixelkunst

I modsætning til hvad du måske forventer, er markedet for pixelkunst stort, og det vokser. Forventningerne var generelt, at pixelkunst ville dø ud, når teknologien nåede det punkt, hvor det var mere praktisk og muligt at bruge vektorkunst og 3D CGI. I virkeligheden er der stadig en stor efterspørgsel efter pixelkunst, og den har faktisk fået et bredere anvendelsesområde. Hvor pixelkunst engang først og fremmest var begrænset til spil, bruges den nu i en meget bred vifte af praktiske applikationer.

Nogle af de områder, hvor pixelkunst sælges, inkluderer:

  • Mobilspil og retro-tema spil
  • infografik
  • Website design
  • Grænsefladesign
  • Design der bruges på tøj, nøglemærker osv.
  • Fjernsynsgrafik (f.eks. IT-skarer, godt spil)
  • Pixel art tegneserier (f.eks: Diesel Sweeties, Kid Radd)
  • Film (f.eks: Wreck It Ralph, Pixels)
  • Pixel-kunstudstillinger og private samlinger

Der kan være andre potentielle markeder, der opstår fra tid til anden. På nogle måder kan du endda tænke på Lego-klodser som en slags pixelkunst, og det er faktisk muligt at skabe 3D-pixelkunst med Lego. Men det vil ikke ske, medmindre du først bliver en master pixel-kunstner, så lad os finde ud af mere om, hvordan du gør det.

Kom godt i gang med pixelkunstdesign

Den bedste måde at komme ind i denne verden på er at komme ind i nogle pixelkunstkonkurrencer og lær, mens du går. Selvfølgelig, når vi taler om konkurrencer, mener vi dem, der er gratis at deltage i, og som ikke kommercielt udnytter dit arbejde ved at kræve, at du underskriver alle dine rettigheder til konkurrencearrangørerne.

Gode ​​pixelkunstkonkurrencer sætter udfordringer, der kræver, at du bruger dine evner som en innovativ designer for at nå målet. Nogle gange er det simpelthen at indstille temaet, men det kan også indeholde regler såsom begrænsning af antallet af farver, du kan bruge eller indstilling af et maksimalt pixeltal. Dette er alle begrænsninger, som spilledesignere engang måtte arbejde under. Når du lærer de samme teknikker, under de samme betingelser, udvikler du stærke færdigheder og forhåbentlig en bedre forståelse af hele designprocessen.

Uddannelse

Der er masser af gratis onlinetutorials, og du kan købe bøger om pixelkunst or spil design at få dig i gang. For en mere dybtgående introduktion, kan du overveje at tage en udemy-kursus i pixelkunst. Til kun $ 35 og undervist af en ekspert spilartist (Marco Vale, i øjeblikket Art Director kl Indot Studios), det er meget god værdi.

Processen med pixelkunst

Oprettelse af ethvert værk af pixelkunst følger en lineær proces fra koncept til færdiggørelse:

  • Ideen - du bestemmer, hvad du skal oprette, eller få instruktioner
  • Planlægning - du træffer valg om, hvordan du opretter billedet
  • Valg af gitter - du vælger den rigtige gittertype til det billede, du opretter
  • Valg af palet - du konfigurerer en farvepalet til billedet
  • Prototyping - et valgfrit trin, der giver dig et grundlæggende rammearbejde til konturen
  • Skitsering - du opretter den grundlæggende kontur af de store dele af billedet
  • Udjævning - du retter op på "jaggies" eller uregelmæssigheder for at skabe et bedre omrids
  • Farvning - du tilføjer farver til billedet ved hjælp af den palet, du har oprettet
  • Skygge - du tilføjer højdepunkter og skygger for at gøre dit billede mere realistisk
  • Dithering - et valgfrit trin til at gentage en ægte retrofølelse i en begrænset palettesituation
  • Selektiv oversigt - du anvender solide linjer på udvalgte dele af billedet for at give en definition
  • Anti-aliasing - et sidste udjævningstrin, hvor du bruger farve til at styrke realismen
  • Indstilling - hvis det billede, du oprettede, er en lille del af en større scene, indstilles du i dens indstilling

Nogle trin, såsom dithering og anti-aliasing, håndteres muligvis automatisk af din tegnesoftware. Det afhænger af, hvad du bruger, og hvilke muligheder du vælger.

Ideen

Nogle mennesker betragter dette som det sværeste skridt i oprettelsen af ​​et nyt værk, men det er det sandsynligvis ikke. Dit mål er at beslutte, hvad du vil oprette, eller i nogle tilfælde at tage instruktion fra klienten vedrørende det, de ønsker. Inspiration kan komme fra den virkelige verden omkring dig eller fra film, spil, bøger og alt andet, der kan hjælpe dig med at visualisere de objekter, der vises i din scene. I dette eksempel opretter vi en blomsterpotte, der ville være en rekvisita i en større scene.

Planlægning

I dette trin ved du allerede, hvad du vil oprette, så nu tænker du på, hvordan du skal oprette det. Den første store beslutning vil være, om du vil designe et fladt billede eller give det et 3D-perspektiv. Du bestemmer også, hvor detaljeret eller realistisk billedet skal være, om det har brug for retro-udseende og lignende ting.

Jo mere realistisk du ønsker, at billedet skal være, jo flere pixels og farver skal du bruge, og jo længere tid tager det at oprette. Hvis du designer til en konkurrence, er nogle af disse valg allerede blevet foretaget for dig, men du bliver stadig nødt til at udtænke den bedste måde at opnå resultatet.

En fornuftig ting at gøre ville være at udskrive gitteret, som du arbejder med, og bruge det til at lave en papirkits af det færdige computerbillede. Dette vil fungere som en reference til den bitmap, du opretter, for at hjælpe dig med at holde perspektivet og skalaen konsistent.

Valg af gitter

Dette bestemmes af arten af ​​det arbejde, du opretter. Til flade billeder bruger du et standardnet, hvor alle linierne skærer hinanden i rette vinkler.

doc88img03

I en 3D-scene har du et valg mellem at bruge et isometrisk gitter (det mest almindelige valg) eller et skråt gitter. Et isometrisk gitter har linjer, der skærer hinanden ved 30 grader:

doc88img04

Et skråt gitter har linjer, der skærer 45 grader:

doc88img05

Skrå tegninger er gode, når du vil medtage en masse fine detaljer, men generelt er isometrisk et bedre overblik og føles mere realistisk. Det er den mere udvalgte tegningstil med god grund.

Valg af palet

Du kan forlade dette trin, indtil du er klar til at farve, men faktisk kan hjælpe med resten af ​​processen, hvis du tidligt definerer dine farver.

Prototyping

Blomsterpotten i eksemplet er dybest set en forvrænget kegleform, og som med alle 2D-efterligninger af en kegle skaber vi den grundlæggende form ved hjælp af stablede ellipser. Dette sparer tid og demonstrerer også værdien af ​​at bruge Inkscape, fordi det har algoritmer til at producere glattere linjer på buede kanter end mange andre tegneprogrammer. Vi er bare nødt til at sikre, at ellipserne stemmer overens med gitteret.

doc88img06

Brug derefter nogle lige linjer til at forbinde dem (forsigtigt buede linier er endnu mere realistiske, hvis du har tålmodighed til at tegne dem).

doc88img07

Disposition

I dette trin tegner vi konturen af ​​det billede, vi vil pixelere. Hvis du lavede en prototype af billedet, er denne del let. Opret først et nyt billedlag og stak det oven på det andet lag (i Inkscape har det nye lag automatisk en gennemsigtig baggrund). Lås prototypelaget, vælg derefter det nye lag og brug det til at spore over din prototype med blyantværktøjet. Deaktiver klik på netnettet, når du sporer buede linjer.

doc88img08

Hvis du har problemer med at se dine nye linjer, skal du blot reducere prototypelagets opacitet, indtil det er lettere at se dine konturlagslinjer. Spor ikke alle linjerne, bare dem, der giver mening.

doc88img09

Du kan slette prototypelaget efter færdiggørelse af oversigten, hvis du ønsker det, eller blot gøre det usynligt.

doc88img10

udjævning

Dette er et vanskeligt skridt. Til dette zoomer du ind på kurverne i billedet og prøver at rette eventuelle skæve linjer, der får billedet til at se mindre naturligt ud. Afhængigt af billedets niveau behøver du muligvis ikke dette (hvis dit billede er 32 × 32 pixels eller mindre, er der meget lidt, du kunne gøre for at forbedre det ved at udjævne det.

Måden at gøre dit første udjævningskørsel er at zoome ind på billedet, så du kan se, hvor kurverne ikke er veldefinerede, eller hvor der er pauser (huller) i de solide linjer. Eventuelle huller medfører farveblødning, hvis du bruger en spandfyldning, så det er en god ide at fjerne huller. Husk, at du bare laver en pixel ad gangen, hvilket er, hvor en tablet gør jobbet meget lettere end en mus.

doc88img11

Farvelægning

Dette var, hvad du plejede at gøre for sjov, da du var fem år, undtagen nu er det meget lettere. Du kan fylde store farveområder med en spandfyldning, og mange tegneprogrammer giver dig mulighed for at indstille en gradient, der muligvis giver et realistisk udseende. Ellers er det den samme aftale som udjævning: zoom ind og indstil dine pixels én ad gangen. Lav ikke et separat farvelag, fordi din software muligvis ikke genkender grænser fra et andet lag, når du udfører en spandfyldning.

doc88img12

Skygge

Solide farver er lette, men for at få et realistisk udseende skal du bruge skygge. Det er lettere at skygge på større billeder, fordi de har flere pixels, som du kan arbejde på. Det første trin i skygge er at finde ud af, hvordan lyset rammer dit objekt eller din scene, og derefter anvende højdepunkter og skygger på en realistisk måde. Til at begynde med vil dette være vanskeligt, men med erfaring og feedback fra andre kunstnere får du fat i det. Her skal jeg kun skygge for bagvæggen i gryden, men det ville være bedre at anvende nogle højdepunkter på frontvæggen.

doc88img13

dithering

Med en begrænset palet kan du ikke altid få alle skygger og farver, du ønsker, og det er vanskeligt at foretage subtile ændringer mellem sammenhængende områder uden at trække sig ud. Det er ikke noget, der kræves på moderne hardware, men det bruges ofte i situationer, hvor du ønsker et retro 90'ers look eller hvor du af forskellige grunde er påkrævet at arbejde med en begrænset palet. Nogle software kan håndtere dithering automatisk for dig, eller du skal muligvis oprette din egen dithering. Dette billede er for simpelt til at have brug for dithering, men her er en tutorial der forklarer, hvordan man opretter en falsk dithering-effekt i Inkscape.

doc88img14

Selektiv skitsering

Dette betyder at erstatte sorte konturer på indre områder med en mere naturlig udseende farve og kun skitsere de dele, der skal beskrives til definition. I det virkelige liv er venerne på et blad ikke sorte, så de burde heller ikke være på din tegning.

doc88img15

Anti-aliasing

Dette svarer til udjævning, bortset fra at du ser nærmere på, at farveregioner, der muligvis har brug for "bump" for at blødgøre linjerne lidt, så de virker mere realistiske. Bumping af en farve betyder bare at vælge en farvetone til en pixel mellem farverne på pixels på hver side af den. Forsætlig sløring gør linjer mindre skarpe. Som med dithering kan din software muligvis automatisk anvende anti-aliasing for dig.

Lokal område

At sætte det færdige objekt i en større scene kaldes indstilling. Du behøver ikke at gøre dette med tegnsprites eller genstande, der kan bevæges. Det kan du gøre senere med kode. Brug indstilling til faste objekter, der ikke bevæger sig. Animerede objekter skal konverteres til sprites, som er et emne for en anden dag.

Hvad skal du gøre, hvis dit billede ikke er pixeleret nok

Et af problemerne er, at Inkscape og lignende vektorprogrammer bare gør for godt med et job med spandfyldning, så farver ser virkelig glatte og vectory ud. Hvis du vil have et pixeleret look, skal du eksportere billedet til png, åbne det i GIMP og anvende Pixelize-filteret, som du finder i sektionen Slør. Dette giver dig et resultat som dette (som du muligvis derefter har brug for til anti-alias):

doc88img16

Afsluttende bemærkninger

Pixel-kunst er langt fra død, og gode pixel-kunstnere får stadig en masse respekt i designsamfundet fra dem, der forstår det engagement, det tager for at blive en mester. At lære at konstruere billeder pixel efter pixel gør dig til en bedre designer og muligvis også en bedre ingeniør. Der er stadig en stærk efterspørgsel efter pixelkunst og relativt få talentfulde pixelartister på jorden, der betjener dette behov. Du kan tjene penge i pixelkunst eller bare bruge dem som en måde at øge dine færdigheder på. Uanset hvad, det er sjovt og givende, det er værd at gøre.

Bogdan Rancea

Bogdan er et grundlæggende medlem af Inspired Mag og har akkumuleret næsten 6 års erfaring i denne periode. På fritiden kan han lide at studere klassisk musik og udforske billedkunst. Han er også ganske besat af fixies. Han ejer allerede 5.