Så skapar du en enkel pixelkonst-gångcykel utan att kunna anatomi
Om anatomi fortfarande känns främmande kan du bygga upp gångrörelsen som en loop med enkla former och fyra poser som går att upprepa. Börja med en figur sedd från sidan, blockera ut benen och överkroppen i kontrasterande färger och animera åtta bildrutor: kontakt, ned, passerande och upp, följt av samma sekvens med det andra benet främst. Kontrollera loopen i liten storlek innan du lägger till kläder, skuggor eller detaljer. Då ligger fokus på en tydlig rörelse snarare än en polerad teckning.
Börja med en liten, fast utgångspunkt
Välj en arbetsyta som passar figuren du redan har; 32 × 32 pixlar är ett praktiskt exempel från en handledning om gångcykler i pixelkonst, inte en obligatorisk storlek. Håll arbetsytan och figurens övergripande bredd och höjd konsekventa mellan bildrutorna. Lägg en horisontell marklinje under fötterna och notera en stabil referenspunkt, till exempel överkroppens mitt. Med dessa riktlinjer blir det enklare att upptäcka oönskad förflyttning.
Representera huvudet som en oval eller ett block, överkroppen som en kompakt form och varje arm och ben som en tjock linje eller smal form i det första utkastet. Använd olika tillfälliga färger för de närmaste och bortre lemmarna så att du kan skilja dem åt när de överlappar. Det här är ett arbetsschema, inte ett påstående om exakta proportioner. Pixelkonstnären Raymond Schlitter beskriver hur man använder en färgkodad skissfigur för att skilja huvud, hals, överkropp, armar och ben åt innan man förfinar en större sprite. SLYNYRD: ”Pixelblog - 50 - Human Walk Cycle”
Planera de fyra poserna innan du ritar detaljer
En användbar modell för en gångcykel har fyra poser: kontakt, ned, passerande och upp. Rita dem för ett steg och upprepa sedan mönstret med det motsatta benet främst. Vid kontakt sträcks den främre foten framåt och den bakre foten bakåt. I ned-posen tar den främre foten figurens vikt och kroppen sänks. I den passerande posen korsas benen i projektionen när den bakre foten förs fram, och kroppen höjs. I upp-posen svänger steget framåt mot nästa kontakt.
För en loop med åtta bildrutor ordnar du teckningarna så här: vänster kontakt, ned, passerande, upp, höger kontakt, ned, passerande, upp. I den andra halvan är det det andra benet som leder; den ska kännas som den första halvans motsvarighet, inte som en kopierad bild. Ett detaljerat exempel i pixelkonst märker ut dessa nyckelögonblick och använder åtta bildrutor som en balans mellan enkelhet och mjuk rörelse; andra antal bildrutor kan passa andra sprites-stilar. SLYNYRD: ”Pixelblog - 50 - Human Walk Cycle”
Bygg upp benen som enkla former
Rita den första kontaktposen med tillräckligt avstånd mellan benen för att de ska synas tydligt i spritens faktiska visningsstorlek. Håll fötterna på marklinjen. I nästa bildruta böjer du det viktbärande benet lite och sänker överkroppen en aning. I den passerande posen för du fötterna närmare varandra och flyttar den svängande foten under kroppen. I upp-posen lyfter du hälen eller foten som rör sig framåt, medan det andra benet stöder figuren. Skapa sedan motsatt kontaktpose och fortsätt sekvensen.
Behandla varje lem som en sammanhängande form från höften till foten. Du behöver inte avbilda varje ben i pixlar: håll benlängden någorlunda konsekvent och gör knäböjen synlig genom en riktnings- eller konturförändring. På en mycket liten sprite kan det innebära att bara flytta en eller två pixlar. Om benen blir ett enda oläsligt block kan du öka avståndet mellan dem eller använda de tillfälliga färgerna för det främre och bakre benet för att tydliggöra vilket som passerar framför. En handledning för sprites med låg upplösning påpekar att gångcykler med fyra bildrutor kan fungera för små figurer, och att växlande skuggning av benen kan göra att en fyrbilderscykel skiljer mellan de två främre benen. Manning Leonard Krull: ”Tutorial: Walking animation for low-res sprites”
Håll överkropp och armar tydliga
Förankra överkroppen och huvudet ungefär kring samma mittpunkt från bildruta till bildruta. Låt kroppen sänkas i ned-posen och höjas under den passerande eller uppåtgående delen av steget, men håll rörelsen återhållsam: en förändring på en pixel kan redan synas tydligt på en liten arbetsyta. För armarna kan du prova att svänga armen motsatt det främre benet. Om höger ben leder kan vänster arm föras framåt; byt riktning i nästa kontaktpose. Håll händer och fötter tillräckligt enkla för att de ska kunna urskiljas från lemmarna.
Det här är utgångsformer att testa, inte universella mått. En påbyltad figur, en mycket liten sprite eller en starkt stiliserad design kan kräva mindre avstånd mellan lemmarna eller en diskretare armsvängning. En praktisk handledning i pixelkonst rekommenderar också att förenkla händer och fötter, variera tonen på den bakre lemmen för att antyda djup och välja proportioner som passar figurens avsedda stil. Clip Studio Tips: ”Tips and Configuration for Creating a Walking Cycle - PixelArt”
Lägg till pixeldetaljer när rörelsen fungerar
Spela upp den grova loopen innan du lägger till ett ansikte, veck, högdagrar eller accessoarer. Leta efter en tydlig skillnad mellan de två kontaktposerna, en läsbar passage av benen under överkroppen och ett huvud som håller sig på linje i stället för att hoppa i sidled. Om det ser ut som att figuren marscherar på stället eller sparkar, justera de grova formerna på lemmarna först. Detaljer kan dölja rörelseproblemet och göra varje korrigering långsammare.
När siluetterna fungerar återställer du figurens färgpalett och förfinar en detalj i taget. Håll ändringarna lokala: om bara det bakre benet byter djup ändrar du dess färg eller överlappning utan att flytta huvudet och överkroppen. Hår, en lös ärm eller en liten accessoar kan röra sig lite med kroppen, men det är valfritt. I en fyrbildersövning i pixelkonst visar Pinnguaq hur man lägger till små rörelser i lätta detaljer som hår och en hattdekoration efter att ha skapat den grundläggande cykeln. Pinnguaq: ”Pixel Art 4A: Animation Basics In GraphicsGale”
Kontrollera loopen och justera sedan tajmingen
Förhandsgranska animationen kontinuerligt och gå igenom den en bildruta i taget. Jämför först bildruta åtta med bildruta ett: överkroppen, huvudet, markläget och den övergripande siluetten ska övergå utan ett synligt hopp. Kontrollera sedan att de två kontaktposerna är motsatta steg och att den planterade foten inte verkar hoppa till en annan höjd. Om figuren guppar för mycket minskar du den vertikala rörelsen; om benen flyter ihop förbättrar du avståndet eller överlappningen.
Ändra en sak åt gången och spela sedan upp animationen igen. Tidslinjens bildrutefördröjning styr hur länge varje teckning visas, så testa hastigheten under uppspelningen i stället för att bara bedöma teckningarna som stillbilder. Pinnguaqs genomgång rekommenderar att kontrollera både den animerade förhandsvisningen och enskilda bildrutor samt att ändra bildrutefördröjningen för att justera hastigheten. Pinnguaq: ”Pixel Art 4A: Animation Basics In GraphicsGale”
När du ska använda fler eller färre bildrutor
Med åtta bildrutor får du plats att visa de fyra huvudposerna för båda sidor. Om spriten är extremt liten kan en cykel med två eller fyra bildrutor fungera bättre eftersom det finns färre små förändringar att rita; om övergångarna känns abrupta och arbetsytan räcker till kan du lägga till bildrutor mellan nyckelposerna. Det finns inget enda antal bildrutor som passar alla sprites. Adafruits guide beskriver enkla gångcykler i spel med omkring sex bildrutor och mjukare varianter med upp till omkring tolv, medan handledningen för låg upplösning tar upp alternativ med två, fyra och åtta bildrutor. Adafruit: ”Pixel Art for LED Matrix Displays”, Manning Leonard Krull: ”Tutorial: Walking animation for low-res sprites”
Avsluta när gången är tydlig i sin avsedda storlek och övergången från sista till första bildrutan känns jämn. Spara den grova versionen innan du lägger till fler bildrutor eller sekundära rörelser; då har du en tydlig utgångspunkt att återgå till om extra detaljer gör rörelsen svårare att läsa.
