Hoe pixelart vergroten zonder vervaging of ongelijke pixels

Hoe pixelart vergroten zonder vervaging of ongelijke pixels

Je hebt uren besteed aan een 16×16 sprite — elke pixel met opzet geplaatst, elke kleur gekozen uit een beperkt palet. Toen heb je het vergroot om het te delen, en er ging iets mis. De randen werden zacht. Het strakke raster dat je had opgebouwd veranderde in een modderige gradient. Je pixelart leek niet meer op pixelart; het leek op een wazige foto van pixelart.

De oplossing is simpel zodra je de regel kent: schaal met gehele vermenigvuldigers (2x, 3x, 4x) met behulp van nearest-neighbor interpolatie. Die combinatie houdt elke pixelrand messcherp en je raster perfect uitgelijnd. Alles anders — bilineair, bicubisch of niet-integer schalen — veroorzaakt vervaging, ghosting of ongelijke pixels die het uiterlijk verpesten waar je zo hard aan hebt gewerkt.

Waarom je Pixelart Wazig Wordt bij Schalen

Wanneer je een afbeelding in de meeste editors van formaat verandert, is de standaard resampling-methode meestal bilineair of bicubisch. Deze methoden zijn ontworpen voor foto’s. Ze werken door de kleuren van aangrenzende pixels te mengen om vloeiende overgangen te creëren. Dat is geweldig voor een foto van een zonsondergang. Voor pixelart, waar elke pixel een bewuste, discrete kleurblok is, is mengen precies wat het uiterlijk vernietigt. Je scherpe 1-pixel lijnen worden modderige halo’s. Je zorgvuldig gekozen palet wordt gemiddeld tot kleuren die je nooit hebt gekozen.

Als je ooit een 16×16 sprite hebt vergroot en de randen zacht en grijzig zag worden, is bilineaire interpolatie bijna altijd de boosdoener. De oplossing is geen betere filter — het is helemaal geen filter.

De video hierboven doorloopt het hele proces in minder dan tien minuten. Het kernidee is hetzelfde in elke tool: vertel je editor om te stoppen met pixels mengen en alleen te schalen met hele getallen.

Integer Schalen: De Enige Veilige Vermenigvuldiger

Integer schalen betekent dat je zowel de breedte als de hoogte van je afbeelding vermenigvuldigt met een heel getal: 2, 3, 4, 5 of 6. Elke originele pixel wordt een perfecte NxN-blok. Een 16×16 sprite, 2x geschaald, wordt 32×32 — elke pixel is nu een 2×2 vierkant. Geschaald met 4x wordt het 64×64, waarbij elke pixel een 4×4 vierkant is. Het raster blijft uniform en geen pixel is groter of kleiner dan zijn buren.

Waarom is dit belangrijk? Omdat niet-integer schalen — zoals 1,5x of 2,3x — de editor dwingt om pixels ongelijkmatig te verdelen. Sommige pixels worden één keer gedupliceerd, andere twee keer. Het resultaat is een raster waarbij bepaalde kolommen of rijen breder zijn dan de rest. Van een afstand kan het acceptabel lijken, maar van dichtbij is de ongelijkheid zichtbaar en storend, vooral op een fysiek pixelscherm.

Hier is een snelle referentie voor veelvoorkomende spritegroottes en hun integer-geschaalde uitvoer:

Originele Grootte 2x Uitvoer 3x Uitvoer 4x Uitvoer
16×16 32×32 48×48 64×64
32×32 64×64 96×96 128×128
64×64 128×128 192×192 256×256

Let op hoe 16×16, geschaald met 4x, precies op 64×64 uitkomt. Dat is geen toeval — het is een van de redenen waarom 64×64 zo'n populaire canvasgrootte is voor pixelart-schermen. Je kunt een kleine sprite nemen, deze met een heel getal schalen, en hij past perfect op een 64×64 scherm zonder overgebleven pixels.

Nearest-Neighbor vs Bilinear vs Bicubic

Voordat je in de programma-specifieke stappen duikt, is het handig te begrijpen wat elke interpolatiemethode eigenlijk met je pixels doet. De methode die je editor gebruikt bepaalt of je geschaalde kunst scherp blijft of een wazige bende wordt.

Methode Hoe het werkt Effect op Pixelart Te gebruiken voor Pixelart?
Nearest-neighbor Kopieert direct de dichtstbijzijnde bronpixelkleur — geen vervaging Elke pixelrand blijft haarscherp; raster blijft uniform Ja — altijd
Bilinear Gemiddelde van de 2×2 buurt pixels rond elk doelpunt Pixelranden vervagen in zachte overgangen; kleuren worden modderig Nee
Bicubic Gebruikt een gewogen gemiddelde van een 4×4 buurt voor soepelere resultaten Nog meer vervaging dan bilinear; kan zichtbare halo’s rond randen veroorzaken Nee

Het verschil is niet subtiel. Nearest-neighbor behandelt elke pixel als een blok kleur en dupliceert het netjes — geen vervaging, geen gokken. Bilinear en bicubic behandelen pixels als monsters op een doorlopende oppervlakte, wat het juiste mentale model is voor een foto maar niet voor pixelart. Wanneer een pixelartiest een rode pixel naast een blauwe plaatst, wil die een scherpe rand, geen paarse overgang.

Hoe Pixelart Schalen in Elk Programma

De onderstaande stappen behandelen de drie meest gebruikte pixelart-editors. Het principe is in elk hetzelfde: zoek het dialoogvenster voor schalen of vergroten, stel de interpolatie in op nearest-neighbor (of het equivalent), en voer afmetingen in die een exact geheel veelvoud zijn van het origineel.

Photoshop

Photoshop noemt nearest-neighbor "Nearest Neighbor" in zijn hersample dropdown. Zo gebruik je het:

Open je pixelartbestand en ga dan naar Afbeelding > Afbeeldingsgrootte. Zoek in het dialoogvenster de Hersample dropdown — deze staat standaard op Automatisch, wat meestal bicubisch betekent. Verander dit naar Nearest Neighbor. Voer vervolgens je doelbreedte en -hoogte in als een geheel veelvoud van het origineel. Bijvoorbeeld, als je sprite 16×16 is en je wilt 4x schalen, voer dan 64 in voor zowel breedte als hoogte. Klik op OK en je pixelart wordt vergroot met elke rand intact.

GIMP

GIMP gebruikt het label "Geen" voor nearest-neighbor interpolatie, wat verwarrend kan zijn. Het betekent niet dat er geen schaling plaatsvindt — het betekent dat er geen interpolatiefilter wordt toegepast, wat precies is wat je wilt.

Open je afbeelding en ga dan naar Afbeelding > Afbeelding Schalen. Stel in het dialoogvenster de Interpolatie dropdown in op Geen. Voer je breedte en hoogte in als gehele veelvouden. Bijvoorbeeld, een 32×32 sprite die 2x wordt geschaald, wordt 64×64. Klik op Schalen en je kunst blijft pixel-perfect.

Aseprite

Aseprite is gemaakt voor pixelart, dus het gebruikt standaard nearest-neighbor in de meeste gevallen. Maar je moet het nog steeds expliciet instellen bij het schalen.

Ga naar Sprite > Spritegrootte. Stel in het dialoogvenster Interpolatie in op Nearest-neighbor. Voer je vermenigvuldiger of doelafmetingen in. Aseprite laat je ook een percentage typen — 200% voor 2x, 300% voor 3x, enzovoort. Klik op OK en je sprite wordt geschaald zonder vervaging.

Snelle checklist voordat je schaalt:

  • Is je vermenigvuldiger een heel getal (2, 3, 4)?
  • Is interpolatie ingesteld op nearest-neighbor (of Geen in GIMP)?
  • Worden breedte en hoogte beide met hetzelfde gehele getal vermenigvuldigd?
  • Exporteer je als PNG en niet als JPEG?

Exportinstellingen die elke pixel behouden

Correct schalen is slechts de helft van het werk. Als je exporteert naar het verkeerde formaat, kunnen compressieartefacten al je zorgvuldige werk tenietdoen. Het formaat dat je kiest bepaalt of je pixelkunst op schijf ongeschonden blijft.

PNG is het beste formaat voor pixelkunst. Het gebruikt verliesloze compressie, wat betekent dat elke pixelkleur precies behouden blijft. Een rode pixel blijft rood. Een transparante pixel blijft transparant. Bestandsformaten zijn redelijk van grootte en elke pixelkunsttool en weergaveplatform ondersteunt PNG zonder problemen.

GIF is ook verliesloos, maar beperkt je tot 256 kleuren. Voor kleine sprites met een beperkt palet is dat meestal prima. Voor grotere stukken met verlopen of veel kleuren veroorzaakt de limiet van 256 kleuren banding.

JPEG moet je vermijden voor pixelkunst. JPEG gebruikt verliesgevende compressie die is ontworpen voor foto’s. Het introduceert zichtbare ruis rond scherpe randen — precies waar pixelkunst schoon moet zijn. Zelfs bij hoge kwaliteitsinstellingen beschadigt JPEG subtiel je pixelgrenzen. Als je ooit een sprite hebt geüpload en vage schaduwen of blokkerige artefacten rond de randen hebt gezien, is JPEG-compressie waarschijnlijk de oorzaak.

De regel is simpel: exporteer pixelkunst altijd als PNG. Als je een kleiner bestand nodig hebt voor webgebruik, verlaag dan het aantal kleuren of gebruik een tool zoals pngquant, die PNG’s verliesloos comprimeert door het palet te verkleinen zonder artefacten toe te voegen.

Toon je geschaalde kunst op een pixelcanvas

Zodra je pixelkunst correct is geschaald en geëxporteerd als PNG, is de volgende vraag waar je het wilt tonen. De meeste makers delen hun werk op sociale media of in game-builds — maar je kunst leeft binnen een browsertabblad of een telefoonscherm, waar het concurreert met ruis, scrollvermoeidheid en algoritmes die het misschien nooit laten zien. Wat als je pixelkunst iets kon zijn dat je elke dag daadwerkelijk ziet?

De Divoom Pixoo-64 is een 64×64 RGB LED-paneel dat speciaal is ontworpen voor het weergeven van pixelkunst. Omdat het scherm zelf een 64×64 raster is, wordt je kunst direct op de fysieke pixels weergegeven — één pixel in je afbeelding is gelijk aan één LED op het scherm. Er is geen schaalvergroting, geen interpolatie en geen vervaging op het weergaveniveau. Wat je hebt getekend, is precies wat oplicht. Een sprite die je hebt gemaakt op 16×16, 4x vergroot naar 64×64, vult het hele paneel pixel-perfect — hetzelfde raster dat je in je editor hebt gebouwd, straalt nu op je bureau.

Dit is het verschil tussen voorbij je kunst scrollen en ermee leven. Een bericht op sociale media verdwijnt in seconden. Een Pixoo-64 op je bureau maakt van je pixelart een deel van je ruimte — altijd aan, altijd zichtbaar en altijd van jou.

Divoom Pixoo-64 toont aangepaste pixelart op een bureau
Een 64×64 pixelart stuk weergegeven op de Divoom Pixoo-64 — elke pixel in de afbeelding correspondeert direct met één LED.

De Pixoo-64 is het meest geschikt voor makers die al pixelart maken en een toegewijd, altijd-aan display willen voor hun werk. Het is geen tekentool — je maakt je kunst in je favoriete editor, schaalt het correct, exporteert als PNG en uploadt het via de app. Als je doel is om een roterende galerij van sprites, game-assets of geanimeerde loops op je bureau te tonen, vervult het die rol zonder te concurreren met je tekenworkflow. Als je een groter canvas of een zelfstandige tekenoppervlakte nodig hebt, is de Pixoo-64 niet de juiste keuze — maar als displaymaatje voor kunst die je al hebt gemaakt, is het moeilijk te overtreffen.

De Pixoo-64 maakt verbinding via Wi-Fi of Bluetooth, en de Divoom-app laat je PNG-bestanden direct vanaf je telefoon of computer uploaden. Voor hulp bij de installatie behandelt de producthandleiding de stappen voor Wi-Fi-verbinding, app-koppeling en bestandsupload.

Veelvoorkomende fouten om te vermijden

Zelfs als je de regels kent, is het makkelijk om in oude gewoontes terug te vallen. Hier zijn de meest voorkomende fouten die wazige of ongelijke pixelart veroorzaken:

Gebruik van de standaard resample-methode. De meeste editors gebruiken standaard bilineair of bicubisch. Als je zonder het interpolatie-instelling te controleren schaalt, krijg je onscherpte. Schakel altijd over naar naaste buur voordat je pixelart schaalt.

Schaalverandering met niet-gehele getallen. Een schaal van 1,5x of 2,7x zal ongelijke pixels opleveren. Sommige rijen worden hoger dan andere en het raster zal inconsistent lijken. Houd je aan 2x, 3x, 4x of hogere gehele getallen.

Exporteren als JPEG. JPEG-compressie introduceert ruis rond scherpe randen. Zelfs bij kwaliteit 100 zal JPEG subtiel je pixelgrenzen beschadigen. Gebruik altijd PNG.

Verkleinen. Het verkleinen van pixelart vernietigt pixelinformatie — zodra je verkleint, kun je die pixels niet terugkrijgen. Als je een kleinere versie nodig hebt, ga dan terug naar je originele bestand of teken opnieuw op de kleinere maat. Als je absoluut moet verkleinen, gebruik dan bilineaire interpolatie — het zal er niet meer uitzien als pixelart, maar het zal tenminste niet in ongelijke fragmenten uiteenvallen.

Vergeten om de beeldverhouding te vergrendelen. Als je editor je toestaat om breedte en hoogte onafhankelijk te wijzigen, zorg er dan voor dat het kettingsymbool vergrendeld is. Anders zal een 16×16 sprite die wordt geschaald naar 64×48 uitrekken en je kunst vervormen.

Veelgestelde vragen

Waarom ziet mijn pixel art er wazig uit als ik het formaat wijzig?

Je editor gebruikt waarschijnlijk standaard bilineaire of bicubische interpolatie. Deze methoden mengen de kleuren van naburige pixels, wat vloeiende overgangen creëert voor foto’s maar de scherpe randen die pixel art definiëren vernietigt. Zet de resample-instelling op nearest-neighbor en schaal alleen met gehele vermenigvuldigers (2x, 3x, 4x).

Kan ik pixel art verkleinen?

Pixel art naar beneden schalen wordt niet aanbevolen omdat het permanent pixelinformatie verwijdert. Zodra je een 64×64 sprite verkleint naar 32×32, kan het verloren detail niet worden hersteld door weer op te schalen. Als je een kleinere versie nodig hebt, teken deze dan opnieuw op de doelformaat vanaf je origineel. Als je toch moet verkleinen, gebruik dan bilineaire interpolatie — het resultaat zal niet op pixel art lijken, maar het voorkomt de ongelijkmatige fragmentatie die nearest-neighbor produceert bij verkleinen.

Wat is het beste exportformaat voor pixel art?

PNG is het beste formaat voor pixel art. Het gebruikt verliesvrije compressie, dus elke pixelkleur wordt exact bewaard. GIF is ook verliesvrij maar beperkt tot 256 kleuren. JPEG moet vermeden worden omdat de verliesgevende compressie ruis en artefacten rond scherpe pixelranden veroorzaakt.

Wat is nearest-neighbor interpolatie?

Nearest-neighbor is de eenvoudigste interpolatiemethode. Voor elke pixel in de geschaalde afbeelding kopieert het de kleur van de dichtstbijzijnde pixel in het origineel. Er is geen mengen, middelen of raden. Dit behoudt de scherpe randen en het uniforme raster waar pixel art van afhankelijk is. In GIMP heet het "Geen"; in Photoshop en Aseprite wordt het "Nearest Neighbor" genoemd.

Hoe toon ik geschaalde pixel art op een fysiek apparaat?

Je kunt pixel art weergeven op een speciaal LED-pixeldisplay zoals de Divoom Pixoo-64, dat een raster van 64×64 RGB-LEDs heeft. Upload je PNG-bestand via de Divoom-app via Wi-Fi of Bluetooth, en elke pixel in je afbeelding wordt direct gekoppeld aan één LED op het scherm. Een 16×16 sprite, 4x geschaald naar 64×64, vult het hele paneel zonder vervaging.

Houd je pixels scherp

Pixel art schalen zonder vervaging komt neer op twee regels: gebruik gehele vermenigvuldigers en gebruik nearest-neighbor interpolatie. Samen garanderen ze dat elke pixel in je originele kunst een uniforme blok wordt in de geschaalde versie — geen mengen, geen spookbeelden, geen ongelijk raster. Exporteer als PNG, vermijd JPEG, en schaal nooit naar beneden tenzij je bereid bent detail te verliezen.

Zodra je kunst is geschaald en geëxporteerd, geeft een canvas van 64×64 pixels zoals de Pixoo-64 je werk een fysieke plek op je bureau. Elke pixel die je hebt getekend, licht op als een enkele LED — hetzelfde scherpe raster dat je in je editor hebt gemaakt, nu stralend in het echt. Geen vervaging, geen interpolatie, gewoon je kunst zoals je het bedoeld hebt.

Alpine nostalgische herfstdecoratie: pixeldisplays voor muren en planken Alpine Nostalgia Fall Decor Alpine nostalgische herfstdecoratie: pixeldisplays voor muren en planken Alpine nostalgie — warm hout, grove breisels en de vintage uitstraling van een berghut ... Worden Divoom-apparaten geleverd met een oplaadkabel? Desk Setup Worden Divoom-apparaten geleverd met een oplaadkabel? Elk Divoom-apparaat wordt geleverd met een USB-oplaadkabel in de doos. Hier leest u wat... Een pixelart-lettertype ontwerpen voor Divoom-displays custom pixel font Een pixelart-lettertype ontwerpen voor Divoom-displays Leer hoe je aangepaste pixelartlettertypen voor Divoom-displays ontwerpt. Stapsgewijze ...
Terug naar de blog