Charcoal Inventar-Slots — 76px-Raster

Inventar-Slots bei 76px mit schraffiertem Inneren. Ein Horrorspiel zeigt wenige Gegenstände und zeigt sie groß; das Raster ist hier nicht der Punkt, sondern das einzelne Objekt, und der Slot ist für Grafik bemessen statt für Dichte.

Ein Inventarraster braucht kein Panel, sondern ein eckigen, das kachelt. Jedes Feld hier ist 76×76 mit denselben Aussenmassen — die einzige Ausnahme ist das zweizellige Feld für grosse Gegenstände mit 152×76, und das ist eine eigene Datei statt eines gedehnten eckigen, weil das Dehnen eines nicht nine-slice-fähigen Felds seine Ecken verzerrt. Setze sie 80 px auseinander, dann lesen sich die Ränder als ein Raster statt als Reihe einzelner Kästen.

Die Zustände sind als Struktur gezeichnet, nicht als Farbe. Das ausgewählte Feld bekommt Eckmarken, das gesperrte eine Diagonalschraffur, das Hover-Feld hebt seinen Rand eine Stufe, das blockierte trägt ein Kreuz und das Ablageziel einen gestrichelten Akzentrahmen. Das ist Absicht: der Inventarbildschirm ist in den meisten Spielen die unruhigste Fläche, liegt unter Gegenstandsgrafik in allen Farbtönen zugleich, und ein Zustand, der nur eine Randfarbe ist, verschwindet in dem Moment, in dem ein rotes Schwert im Feld liegt.

Blockiert und gesperrt sind absichtlich getrennte Sprites. Ein gesperrtes Feld lässt sich später öffnen; ein blockiertes weist den Gegenstand ab, der gerade am Cursor hängt. Beide gleich zu zeichnen ist der Weg, auf dem ein Inventar dem Spieler die falsche Regel beibringt. Die Ausrüstungsfelder brechen aus demselben Grund mit dem eckigen — ein Accessoire-Slot ist rund, ein Edelstein-Slot sechseckig, sodass die Form vor jedem Tooltip sagt, was dorthin gehört.

Die drei Seltenheitsrahmen greifen die Farben für Leben, Mana und Ausdauer aus dem Rest der Familie wieder auf, jeder mit einer Eckmarkierung zusätzlich zum farbigen Rand — wer nach Seltenheit sortiert, liest also zwei Signale, und keines davon konkurriert mit der Item-Grafik in der Mitte des Slots.

Alles ist als bearbeitbares SVG und als flaches transparentes PNG in 1x, 2x und 4x enthalten. Die Slot-Innenflächen sind transparent, was du hinter dem Raster renderst, scheint also durch, statt von einer eingebrannten Hintergrundfarbe verdeckt zu werden.

Creative Commons Namensnennung 4.0 — Kostenlos für kommerzielle Nutzung. Namensnennung erforderlich. Vollständige Bedingungen · Was das in der Praxis heißt