Tutorial i spritesheets med GPT Image 2.5: fra karakterreference til transparent PNG med 16 billeder og GIF

Det vigtigste (kortversionen): Med GPT Image 2.5's native transparente baggrund og konditionering ud fra en visuel reference kan indie-spiludviklere generere prototypeklare 2D-spritesheets til karakterer med 16 billeder på få minutter. Denne tutorial gennemgår, hvordan du opretter en original "urværkskurér"-karakter, genererer et spritesheet i et 4×4-gitter med verificeret ægte RGBA-alfatransparens på 63,9 %, skærer cellerne ud matematisk, fastlåser omdrejningspunkter til jordplanet og samler 4 animerede GIF'er - alt sammen for blot 14,73 kreditter ($0.073 USD).

👉 Opret transparente spritesheets på PoYo.

---

Det endelige resultat

Det genererede ark indeholder 4 forskellige handlingssekvenser på et lærred på 1024 × 1024 px, der er delt jævnt op i seksten transparente celler på 256 × 256 px:

• 📥 Download det originale transparente PNG-ark i 1024 × 1024
• 📦 Download det komplette spritekit (16 enkelte PNG'er, 4 GIF'er, atlas-JSON)

---

Trin 1: Fastlæg et karakterdesign med høj kontrast

Før du genererer handlingsbillederne, skal du låse et umiskendeligt visuelt referencebillede af karakteren.

Bedste praksis for design af 2D-sprites:

1. Kraftig farveblokering: Marineblå kasket, petrolblå overfrakke, rustorange halstørklæde, beige taske og brune støvler. Skarpe farvegrænser hjælper diffusionsmodeller med at forankre assets på tværs af små stillinger.
2. Minimér mikrostøj: Undgå mikroskopisk filigran eller fine kæder, der forfalder til visuel flimren ved lav spilopløsning.
3. Helfigur i profil: Sørg for, at begge fødder har fast kontakt med jorden, så der etableres en stabil visuel basislinje.

---

Trin 2: Bed om et fast gitterlayout med native transparens

I din prompt skal du præcist angive antal celler, stillingens retning og forbudte artefakter.

Promptskabelon:

Create a 4 by 4 sprite sheet with exactly sixteen evenly sized cells.
Use the attached character as the identity and costume reference.
Consistent right-facing side view, same character scale and ground
baseline, full body and generous transparent margins in every cell.

Row 1: four phases of a walking cycle.
Row 2: four phases of a running cycle.
Row 3: crouch, takeoff, airborne jump, landing.
Row 4: reach into satchel, hold a letter, extend letter, return to neutral.

No grid lines, floor, drop shadows, frame numbers, or labels.
1024x1024 canvas, 256x256 cells.

PoYo API-anmodningens payload:

{
  "model": "gpt-image-2.5-sunburst",
  "input": {
    "prompt": "Your complete character and sprite-sheet instructions",
    "image_urls": ["https://storage.poyo.ai/blog/gpt-image-25-p0-20260910/courier-reference-b8f920940d88.webp"],
    "size": "1:1",
    "resolution": "1K",
    "quality": "high",
    "background": "transparent",
    "output_format": "png"
  }
}

Nøglefunktion: Med "background": "transparent" får du GPT Image 2.5 til at rendere ægte RGBA-alfakanaler direkte, så du slipper for manuelle værktøjer til fjernelse af baggrund.

---

Trin 3: Kontrollér den ægte alfatransparens

Mange AI-værktøjer leverer falske hvide baggrunde eller efterlignede skakternsmønstre. Vi udførte en verifikation på pixelniveau af den returnerede PNG:

• Måling af alfakanalen: Præcis 63,9 % af alle pixels er fuldt transparente (Alpha = 0);
• Anti-aliasing: Karakterens konturer har bløde alfagradienter på subpixelniveau, hvilket fjerner kantstøj, når de lægges over lyse eller mørke baggrunde;
• Regel for filformat: Kun PNG og WebP bevarer alfatransparens. Hvis du gemmer som JPEG, mister du alfalaget for altid.

---

Trin 4: Matematisk opdeling og fastlåsning af omdrejningspunkt

1. Matematik bag opdeling af gitteret

For et 4×4-ark på 1024 × 1024 px:

$$\text{Cellestørrelse} = 256 \times 256\text{ px}$$

$$\text{X} = \text{Kolonneindeks (0 til 3)} \times 256, \quad \text{Y} = \text{Rækkeindeks (0 til 3)} \times 256$$

2. ⚠️ Kritisk advarsel: centrér aldrig afgrænsningsrammer automatisk!

En almindelig fejl i scripts er at centrere hvert billedes synlige afgrænsningsramme automatisk:

• Hvis hoppebillederne centreres automatisk, ødelægges den lodrette bevægelse, og karakteren vrikker på stedet;
• Hvis løbeskridtene centreres automatisk, vingler det vandrette momentum uregelmæssigt.

Den rigtige fremgangsmåde: Behold et fast koordinatsystem, og fastlås omdrejningspunktet til basislinjen nederst i midten (for celler på 256×256 bruges X: 128, Y: 250). Hoppehøjder repræsenteres helt naturligt af karakterens lodrette forskydning i cellen.

• 📥 Download de komplette metadata for opdeling af spriteatlasset (JSON)

---

Trin 5: Forhåndsvisning af animationer og kontrol i engine

Når de udskårne billeder samles med 8 FPS (125 ms pr. billede), får du fire responsive animationsløkker:

1. Gå-cyklus

Gangart med fire billeder og fodnedslag på jorden:

2. Løbe-cyklus

Dynamisk forlæns hældning med langstrakte skridt:

3. Hoppesekvens

Forventning på hug, bane gennem luften og landingens sammenpresning:

4. Interaktiv overrækkelse af brev

Række ned i tasken, holde konvolutten, aflevere og vende tilbage til hvilestilling:

---

6. Samlede produktionsomkostninger

---

Ofte stillede spørgsmål (FAQ)

Eksporterer GPT Image 2.5 animerede GIF-filer direkte?

Nej. Den leverer statiske RGBA-PNG-filer. Opdeling i animationsbilleder og kodning af GIF'er eller Unity Animation Clips håndteres lokalt via spilmotorer eller scripts.

Hvorfor generere alle 16 billeder i ét 4×4-gitter i stedet for 16 separate API-kald?

Når du genererer i ét ark, udnytter du modellens globale selvopmærksomhed til at holde kostumedetaljer, hovedproportioner og kunststil ensartede i hver stilling, og det til en lavere pris.

Kan dette spritesheet importeres direkte i Unity eller Godot?

Ja. I Unity indstiller du Sprite Mode til Multiple, åbner Sprite Editor, vælger Grid by Cell Size (256×256), indstiller Pivot til Bottom og skærer ud på få sekunder.