Grundrichtung entschieden: B. Pixel Art wird eine eigene Asset-Art, so wie Vector Art. Die Pixel liegen im Projekt, dazu kommen Ebenen, Palette und Frames. Der Tab rastert das Ergebnis zu einem Bild, das Sprites, Animationen und Tilemaps verwenden können. Eine vorhandene Textur lässt sich als Startpunkt importieren.
Zu jeder Frage steht mein Vorschlag dabei. Ein „passt“ pro Punkt reicht.
1. Wo liegen die Pixeldaten?
Ein Projekt wird heute als ein ganzes JSON per PUT gespeichert, und nginx lässt höchstens 1 MB pro Request durch. Ein einziges 256x256-Bild in RGBA sind roh 256 kB, und mit Ebenen und Frames wird das schnell ein Vielfaches davon.
a) Im Projekt-JSON, je Ebene und Frame als PNG in Base64. Das ist einfach, stößt aber bald an die 1-MB-Grenze.
b) Als eigene Dateien auf dem Server, inhaltsadressiert wie Texturen. Das Projekt hält dann nur die Hashes. Beim Speichern werden geänderte Ebenen zuerst hochgeladen.
Vorschlag: b. Undo bleibt lokal im Tab (Pixel-Diffs), und hochgeladen wird erst beim Speichern.
2. Farben: indiziert oder frei?
a) Indiziert: Jeder Pixel ist ein Index in die Palette. Wenn du eine Palettenfarbe änderst, ändert sich das ganze Bild mit. Damit gehen später auch Palette-Swaps (Gegner in anderer Farbe).
b) Frei (RGBA): Die Palette ist nur eine Farbauswahl.
Vorschlag: a, mit Transparenz als Index 0. Beim Import werden die Farben auf höchstens 256 reduziert.
Außerdem: Palette je Asset oder je Projekt (mehrere Assets teilen sich eine)? Vorschlag: je Projekt als eigenes kleines Asset, und das Pixel-Art-Asset verweist darauf.
Größe ändern mit Anker (oben links / Mitte / …). Was übersteht, wird abgeschnitten, und das ist ein Undo-Schritt.
4. Ebenen
Vorschlag für die erste Fassung: Ebenen anlegen, löschen, umbenennen, umsortieren, sichtbar/unsichtbar, Deckkraft, nach unten zusammenführen. Keine Blend-Modi außer Normal. Soll noch etwas dazu, oder ist das schon zu viel?
5. Frames / Animation
Die Frames gehören zum Asset, und jeder Frame hat dieselben Ebenen (wie in Aseprite).
Das Ergebnis ist ein Sheet mit Frames wie bei einer geschnittenen Textur, sodass ein bestehendes Animation-Asset die Frames direkt verwenden kann.
Frame-Dauer: bleibt im Animation-Asset (Vorschlag) oder kommt auch in den Pixel-Tab?
Eine Vorschau, die im Tab abspielt? Vorschlag: ja, klein in einer Ecke.
6. Werkzeuge der ersten Fassung
Vorschlag: Stift, Radierer, Füllen (zusammenhängend oder alle Pixel gleicher Farbe), Pipette (Alt+Klick), Linie, Rechteck, Ellipse (Umriss/gefüllt), Rechteckauswahl samt Verschieben / Kopieren / Einfügen, Spiegeln der Auswahl oder Ebene. Pinselgröße 1 bis 8 px.
Später als eigenes Issue: Symmetrie-Zeichnen, Lasso, Dithering-Pinsel, Farbe ersetzen. Passt diese Aufteilung?
7. Import aus Textur
Importiert werden eine ganze Textur oder nur ihre geschnittenen Frames. Aus einem Sheet werden dann Pixel-Art-Frames.
Was passiert mit der Original-Textur? Vorschlag: Sie bleibt unberührt. Ein Knopf „Verwendungen umhängen“ tauscht die Textur in Sprites/Animationen gegen das neue Asset. Oder soll das automatisch passieren?
Bilder mit mehr als 256 Farben: reduzieren (Vorschlag) oder ablehnen?
8. Wo man Pixel Art verwenden kann
Vorschlag: überall, wo heute eine Textur oder Vector Art geht (Sprite, Animation, Tileset, Texturfüllung aus #186), über denselben Bildpfad wie Vector Art. Dazu ein Export als PNG zum Herunterladen. Fehlt noch ein Ort?
9. Ansicht und Bedienung
Zoom in ganzen Stufen (1x bis 32x), Pixelraster ab 8x, Schachbrett-Hintergrund für Transparenz.
Kachelvorschau (das Bild 3x3 nebeneinander) für Tiles? Vorschlag: ja, schaltbar.
Tastenkürzel wie in Aseprite: B Stift, E Radierer, G Füllen, I Pipette, L Linie, U Rechteck/Ellipse, M Auswahl, X Farben tauschen, [ ] Pinselgröße. Passt das, oder kollidiert etwas mit bestehenden Kürzeln im Editor?
Undo: ein Strich ist ein Schritt.
10. Aufteilung
Das ist zu viel für ein einziges Issue. Vorschlag:
#130: Asset-Art, Leinwand, Palette, Werkzeuge aus Punkt 6 ohne Auswahl, Verwendung als Bild. Eine Ebene, ein Frame.
Ebenen
Frames, Onion Skin, Vorschau
Import aus Textur und Verwendungen umhängen
Auswahl, Kopieren/Einfügen, Spiegeln
Die Folge-Issues lege ich an, sobald du die Aufteilung bestätigst. Sie landen in keiner Spalte, bis du sie einplanst.
**Grundrichtung entschieden: B.** Pixel Art wird eine eigene Asset-Art, so wie Vector Art. Die Pixel liegen im Projekt, dazu kommen Ebenen, Palette und Frames. Der Tab rastert das Ergebnis zu einem Bild, das Sprites, Animationen und Tilemaps verwenden können. Eine vorhandene Textur lässt sich als Startpunkt importieren.
Zu jeder Frage steht mein Vorschlag dabei. Ein „passt“ pro Punkt reicht.
## 1. Wo liegen die Pixeldaten?
Ein Projekt wird heute als **ein ganzes JSON per PUT** gespeichert, und nginx lässt höchstens **1 MB** pro Request durch. Ein einziges 256x256-Bild in RGBA sind roh 256 kB, und mit Ebenen und Frames wird das schnell ein Vielfaches davon.
- **a)** Im Projekt-JSON, je Ebene und Frame als PNG in Base64. Das ist einfach, stößt aber bald an die 1-MB-Grenze.
- **b)** Als eigene Dateien auf dem Server, inhaltsadressiert wie Texturen. Das Projekt hält dann nur die Hashes. Beim Speichern werden geänderte Ebenen zuerst hochgeladen.
- **Vorschlag: b.** Undo bleibt lokal im Tab (Pixel-Diffs), und hochgeladen wird erst beim Speichern.
## 2. Farben: indiziert oder frei?
- **a) Indiziert:** Jeder Pixel ist ein Index in die Palette. Wenn du eine Palettenfarbe änderst, ändert sich das ganze Bild mit. Damit gehen später auch Palette-Swaps (Gegner in anderer Farbe).
- **b) Frei (RGBA):** Die Palette ist nur eine Farbauswahl.
- **Vorschlag: a**, mit Transparenz als Index 0. Beim Import werden die Farben auf höchstens 256 reduziert.
- Außerdem: **Palette je Asset oder je Projekt** (mehrere Assets teilen sich eine)? Vorschlag: je Projekt als eigenes kleines Asset, und das Pixel-Art-Asset verweist darauf.
## 3. Leinwand
- Standardgröße? Vorschlag **32x32**, höchstens **512x512**.
- Größe ändern mit Anker (oben links / Mitte / …). Was übersteht, wird abgeschnitten, und das ist ein Undo-Schritt.
## 4. Ebenen
Vorschlag für die erste Fassung: Ebenen anlegen, löschen, umbenennen, umsortieren, sichtbar/unsichtbar, Deckkraft, nach unten zusammenführen. **Keine Blend-Modi** außer Normal. Soll noch etwas dazu, oder ist das schon zu viel?
## 5. Frames / Animation
- Die Frames gehören zum Asset, und jeder Frame hat dieselben Ebenen (wie in Aseprite).
- Das Ergebnis ist ein Sheet mit Frames wie bei einer geschnittenen Textur, sodass ein bestehendes **Animation-Asset** die Frames direkt verwenden kann.
- **Frame-Dauer:** bleibt im Animation-Asset (Vorschlag) oder kommt auch in den Pixel-Tab?
- **Onion Skin** (vorheriger/nächster Frame halbtransparent)? Vorschlag: ja, schaltbar.
- Eine Vorschau, die im Tab abspielt? Vorschlag: ja, klein in einer Ecke.
## 6. Werkzeuge der ersten Fassung
Vorschlag: **Stift, Radierer, Füllen** (zusammenhängend oder alle Pixel gleicher Farbe), **Pipette** (Alt+Klick), **Linie, Rechteck, Ellipse** (Umriss/gefüllt), **Rechteckauswahl samt Verschieben / Kopieren / Einfügen**, **Spiegeln** der Auswahl oder Ebene. Pinselgröße 1 bis 8 px.
Später als eigenes Issue: Symmetrie-Zeichnen, Lasso, Dithering-Pinsel, Farbe ersetzen. Passt diese Aufteilung?
## 7. Import aus Textur
- Importiert werden eine ganze Textur oder nur ihre geschnittenen Frames. Aus einem Sheet werden dann Pixel-Art-Frames.
- **Was passiert mit der Original-Textur?** Vorschlag: Sie bleibt unberührt. Ein Knopf „Verwendungen umhängen“ tauscht die Textur in Sprites/Animationen gegen das neue Asset. Oder soll das automatisch passieren?
- Bilder mit mehr als 256 Farben: reduzieren (Vorschlag) oder ablehnen?
## 8. Wo man Pixel Art verwenden kann
Vorschlag: überall, wo heute eine Textur oder Vector Art geht (Sprite, Animation, Tileset, Texturfüllung aus #186), über denselben Bildpfad wie Vector Art. Dazu ein **Export als PNG** zum Herunterladen. Fehlt noch ein Ort?
## 9. Ansicht und Bedienung
- Zoom in ganzen Stufen (1x bis 32x), Pixelraster ab 8x, Schachbrett-Hintergrund für Transparenz.
- **Kachelvorschau** (das Bild 3x3 nebeneinander) für Tiles? Vorschlag: ja, schaltbar.
- Tastenkürzel wie in Aseprite: B Stift, E Radierer, G Füllen, I Pipette, L Linie, U Rechteck/Ellipse, M Auswahl, X Farben tauschen, [ ] Pinselgröße. Passt das, oder kollidiert etwas mit bestehenden Kürzeln im Editor?
- Undo: ein Strich ist ein Schritt.
## 10. Aufteilung
Das ist zu viel für ein einziges Issue. Vorschlag:
1. **#130:** Asset-Art, Leinwand, Palette, Werkzeuge aus Punkt 6 ohne Auswahl, Verwendung als Bild. Eine Ebene, ein Frame.
2. Ebenen
3. Frames, Onion Skin, Vorschau
4. Import aus Textur und Verwendungen umhängen
5. Auswahl, Kopieren/Einfügen, Spiegeln
Die Folge-Issues lege ich an, sobald du die Aufteilung bestätigst. Sie landen in keiner Spalte, bis du sie einplanst.
vorschlag hat schon ein riesige pattern, wenn du das so hinbekommst, sehr gerne
import kann man einstweilen komplett weglassen, eigenes issue
vorschlag passt, export als png => eigenes issue
vorschlag passt, aber tastenkürzel kann man weglassen
1, 2 und 3 in ein issue (das hier), 4 eigenes issue, 5 eigenes issue
1. dein vorschlag (b)
2. indiziert klingt gut, passt
3. vorschlag passt
4. vorschlag passt
5. vorschlag passt perfekt
6. vorschlag hat schon ein riesige pattern, wenn du das so hinbekommst, sehr gerne
7. import kann man einstweilen komplett weglassen, eigenes issue
8. vorschlag passt, export als png => eigenes issue
9. vorschlag passt, aber tastenkürzel kann man weglassen
10. 1, 2 und 3 in ein issue (das hier), 4 eigenes issue, 5 eigenes issue
#200 weitere Werkzeuge (Symmetrie, Lasso, Dithering, Farbe ersetzen)
**Umfang festgelegt** (nach den Antworten oben):
In diesem Issue:
- Asset-Art **Pixel Art**. Die Pixeldaten liegen als eigene Dateien auf dem Server, inhaltsadressiert wie Texturen. Das Projekt hält nur die Hashes.
- **Indizierte Farben**, Index 0 = transparent. Die Palette ist ein eigenes Asset, auf das mehrere Pixel-Art-Assets verweisen können.
- Leinwand 32x32 als Standard, höchstens 512x512, Größe ändern mit Anker.
- **Ebenen**: anlegen, löschen, umbenennen, umsortieren, sichtbar, Deckkraft, nach unten zusammenführen.
- **Frames** mit denselben Ebenen, Ergebnis als Sheet für Animation-Assets, Onion Skin schaltbar, kleine Vorschau.
- Werkzeuge: Stift, Radierer, Füllen (zusammenhängend / gleiche Farbe), Pipette, Linie, Rechteck, Ellipse (Umriss/gefüllt), Pinselgröße 1 bis 8.
- Zoom 1x bis 32x, Raster ab 8x, Schachbrett, Kachelvorschau 3x3. **Keine Tastenkürzel.** Undo: ein Strich ist ein Schritt.
- Verwendung überall, wo heute ein Bild geht (Sprite, Animation, Tileset, Texturfüllung).
Abgetrennt:
- #197 Import aus Textur und Verwendungen umhängen
- #198 Auswahl, Kopieren/Einfügen und Spiegeln
- #199 Export als PNG
- #200 weitere Werkzeuge (Symmetrie, Lasso, Dithering, Farbe ersetzen)
admin
removed the question label 2026-09-21 16:25:06 +02:00
Zwei neue Asset-Arten: Pixel art und Palette. Die erste Pixel Art eines Projekts bekommt im selben Undo-Schritt eine Palette mit den 16 PICO-8-Farben. Jedes Pixel ist ein Index in die Palette, 0 ist transparent. Eine geänderte Palettenfarbe ändert jedes Bild mit, das die Palette nutzt.
Pixeldaten als eigene Dateien: Jede Ebene auf jedem Frame liegt als data/pixels/<sha256>.px auf dem Server, das Projekt hält nur die Namen. Hochgeladen wird vor dem Speichern des Projekts (neue Route POST ?r=pixels).
Werkzeuge: Stift, Radierer, Füllen (zusammenhängend oder alle Pixel dieser Farbe), Pipette, Linie, Rechteck und Ellipse (Umriss oder gefüllt), Pinsel 1 bis 8 px.
Ebenen: anlegen, löschen, umbenennen, umsortieren, ausblenden, Deckkraft, nach unten zusammenführen.
Frames: anlegen, duplizieren, löschen, umsortieren, Onion Skin und eine kleine Vorschau, die abspielt.
Ansicht: Zoom 1x bis 32x in ganzen Stufen, Raster ab 8x, Kachelvorschau 3x3, Resize… mit 3x3-Anker.
Verwendung: Alle Frames liegen nebeneinander in einem Bild, jeder Frame ist ein Ausschnitt wie bei einer geschnittenen Textur. Die Texture-Zeile bietet „Asset / Frame 2“ an, im Kontextmenü gibt es Create animation from frames.
Entscheidungen
Beim Zusammenführen geht die Deckkraft der oberen Ebene verloren, indizierte Farben kennen keine Mischfarben.
Nur die letzte Palettenfarbe ist löschbar, sonst verrutschen die Indizes in allen Bildern.
Undo speichert je Strich die ganze Ebene statt Pixel-Diffs.
Alt+Klick als Pipette gibt es trotzdem, weil es eine Maus-Geste ist und kein Tastenkürzel.
Die Palette wird nur im Pixel-Tab bearbeitet.
Folge-Issues
#197 Import aus Textur, #198 Auswahl/Kopieren/Spiegeln, #199 PNG-Export, #200 weitere Werkzeuge.
Tests
./check.sh: 136 Dateien, 2049 Tests (vorher 135 / 2011), davon 34 neu in tests/core/pixel-art.test.ts.
e2e-Modul 48 frisch: ALL PASSED, 29 Checks, Konsole leer.
Gegenproben greifen: fünf an den Unit-Tests, die Reihenfolge Hochladen vor Speichern, und im Browser nicht hochgeladene Zellen.
Check-Summe 1259 ist gerechnet (1232 in CI gemessen + 27), gemessen wird sie im nächsten CI-Lauf.
Umgesetzt in 66d6aaf, Doku im Wiki unter [Pixel Art](https://git.nockal.com/meleki/game-maker/wiki/Pixel-Art).
## Was dazukommt
- **Zwei neue Asset-Arten: Pixel art und Palette.** Die erste Pixel Art eines Projekts bekommt im selben Undo-Schritt eine Palette mit den 16 PICO-8-Farben. Jedes Pixel ist ein Index in die Palette, 0 ist transparent. Eine geänderte Palettenfarbe ändert jedes Bild mit, das die Palette nutzt.
- **Pixeldaten als eigene Dateien:** Jede Ebene auf jedem Frame liegt als `data/pixels/<sha256>.px` auf dem Server, das Projekt hält nur die Namen. Hochgeladen wird vor dem Speichern des Projekts (neue Route `POST ?r=pixels`).
- **Werkzeuge:** Stift, Radierer, Füllen (zusammenhängend oder alle Pixel dieser Farbe), Pipette, Linie, Rechteck und Ellipse (Umriss oder gefüllt), Pinsel 1 bis 8 px.
- **Ebenen:** anlegen, löschen, umbenennen, umsortieren, ausblenden, Deckkraft, nach unten zusammenführen.
- **Frames:** anlegen, duplizieren, löschen, umsortieren, Onion Skin und eine kleine Vorschau, die abspielt.
- **Ansicht:** Zoom 1x bis 32x in ganzen Stufen, Raster ab 8x, Kachelvorschau 3x3, **Resize…** mit 3x3-Anker.
- **Verwendung:** Alle Frames liegen nebeneinander in einem Bild, jeder Frame ist ein Ausschnitt wie bei einer geschnittenen Textur. Die Texture-Zeile bietet „Asset / Frame 2“ an, im Kontextmenü gibt es **Create animation from frames**.
## Entscheidungen
- Beim Zusammenführen geht die Deckkraft der oberen Ebene verloren, indizierte Farben kennen keine Mischfarben.
- Nur die letzte Palettenfarbe ist löschbar, sonst verrutschen die Indizes in allen Bildern.
- Undo speichert je Strich die ganze Ebene statt Pixel-Diffs.
- Alt+Klick als Pipette gibt es trotzdem, weil es eine Maus-Geste ist und kein Tastenkürzel.
- Die Palette wird nur im Pixel-Tab bearbeitet.
## Folge-Issues
#197 Import aus Textur, #198 Auswahl/Kopieren/Spiegeln, #199 PNG-Export, #200 weitere Werkzeuge.
## Tests
- `./check.sh`: 136 Dateien, 2049 Tests (vorher 135 / 2011), davon 34 neu in `tests/core/pixel-art.test.ts`.
- e2e-Modul 48 frisch: ALL PASSED, 29 Checks, Konsole leer.
- Gegenproben greifen: fünf an den Unit-Tests, die Reihenfolge Hochladen vor Speichern, und im Browser nicht hochgeladene Zellen.
- Check-Summe 1259 ist gerechnet (1232 in CI gemessen + 27), gemessen wird sie im nächsten CI-Lauf.
Blocking a user prevents them from interacting with repositories, such as opening or commenting on pull requests or issues. Learn more about blocking a user.
Eine vorhandene Texture bearbeiten, Pixel für Pixel. Pipette darf natürlich nicht fehlen.
Grundrichtung entschieden: B. Pixel Art wird eine eigene Asset-Art, so wie Vector Art. Die Pixel liegen im Projekt, dazu kommen Ebenen, Palette und Frames. Der Tab rastert das Ergebnis zu einem Bild, das Sprites, Animationen und Tilemaps verwenden können. Eine vorhandene Textur lässt sich als Startpunkt importieren.
Zu jeder Frage steht mein Vorschlag dabei. Ein „passt“ pro Punkt reicht.
1. Wo liegen die Pixeldaten?
Ein Projekt wird heute als ein ganzes JSON per PUT gespeichert, und nginx lässt höchstens 1 MB pro Request durch. Ein einziges 256x256-Bild in RGBA sind roh 256 kB, und mit Ebenen und Frames wird das schnell ein Vielfaches davon.
2. Farben: indiziert oder frei?
3. Leinwand
4. Ebenen
Vorschlag für die erste Fassung: Ebenen anlegen, löschen, umbenennen, umsortieren, sichtbar/unsichtbar, Deckkraft, nach unten zusammenführen. Keine Blend-Modi außer Normal. Soll noch etwas dazu, oder ist das schon zu viel?
5. Frames / Animation
6. Werkzeuge der ersten Fassung
Vorschlag: Stift, Radierer, Füllen (zusammenhängend oder alle Pixel gleicher Farbe), Pipette (Alt+Klick), Linie, Rechteck, Ellipse (Umriss/gefüllt), Rechteckauswahl samt Verschieben / Kopieren / Einfügen, Spiegeln der Auswahl oder Ebene. Pinselgröße 1 bis 8 px.
Später als eigenes Issue: Symmetrie-Zeichnen, Lasso, Dithering-Pinsel, Farbe ersetzen. Passt diese Aufteilung?
7. Import aus Textur
8. Wo man Pixel Art verwenden kann
Vorschlag: überall, wo heute eine Textur oder Vector Art geht (Sprite, Animation, Tileset, Texturfüllung aus #186), über denselben Bildpfad wie Vector Art. Dazu ein Export als PNG zum Herunterladen. Fehlt noch ein Ort?
9. Ansicht und Bedienung
10. Aufteilung
Das ist zu viel für ein einziges Issue. Vorschlag:
Die Folge-Issues lege ich an, sobald du die Aufteilung bestätigst. Sie landen in keiner Spalte, bis du sie einplanst.
Umfang festgelegt (nach den Antworten oben):
In diesem Issue:
Abgetrennt:
Umgesetzt in
66d6aaf, Doku im Wiki unter Pixel Art.Was dazukommt
data/pixels/<sha256>.pxauf dem Server, das Projekt hält nur die Namen. Hochgeladen wird vor dem Speichern des Projekts (neue RoutePOST ?r=pixels).Entscheidungen
Folge-Issues
#197 Import aus Textur, #198 Auswahl/Kopieren/Spiegeln, #199 PNG-Export, #200 weitere Werkzeuge.
Tests
./check.sh: 136 Dateien, 2049 Tests (vorher 135 / 2011), davon 34 neu intests/core/pixel-art.test.ts.