Packs de interfaz
Oak Casillas de inventario — rejilla de 72px
13 casillas de inventario roble cálido de 72×72: vacía, hover, seleccionada, bloqueada, vetada, destino; equipo redondo y hexagonal, hotbar, tres marcos de rareza.

Sobre este pack
La pieza que un inventario de fantasía necesita de verdad: un cuadrado que repita. Setenta y dos píxeles es lo bastante grande como para que un borde de marco doble deje aún sitio al objeto, que es el tamaño en el que la mayoría de los kits de inventario dejan de funcionar.
Una rejilla de inventario no necesita un panel, necesita un cuadrado que tesele. Cada casilla aquí mide 72×72 con los mismos límites exteriores; la única excepción es la casilla de dos celdas para objetos grandes, de 144×72, que es un archivo aparte y no una casilla estirada, porque estirar algo que no es nine-slice deforma sus esquinas. Sepáralas 76 px y los bordes se leen como una sola rejilla en lugar de una fila de cajas sueltas.
Los estados se dibujan como estructura, no como color. La casilla seleccionada recibe marcas de esquina, la bloqueada un rayado diagonal, la de hover eleva su borde un escalón, la vetada lleva un aspa y el destino de soltado un marco discontinuo de acento. Es deliberado: la pantalla de inventario es la superficie más ruidosa de casi cualquier juego, está bajo arte de objetos en todos los tonos a la vez, y un estado que solo es un color de borde desaparece en cuanto hay una espada roja en la casilla.
Vetada y bloqueada son sprites distintos a propósito. Una casilla bloqueada puede abrirse más tarde; una vetada está rechazando el objeto que llevas en el cursor. Dibujarlas igual es como un inventario acaba enseñando al jugador la regla equivocada. Las casillas de equipo rompen el cuadrados por el mismo motivo: la de accesorio es redonda y la de gema hexagonal, así que la forma dice qué va ahí antes que cualquier tooltip.
Los tres marcos de rareza reutilizan los colores de vida, maná y aguante del resto de la familia, cada uno con una marca en la esquina además del borde de color — así que quien ordena por rareza está leyendo dos señales, y ninguna compite con el arte del objeto en el centro de la casilla.
Todo se incluye como SVG editable y como PNG plano transparente en 1x, 2x y 4x. Los interiores de las casillas son transparentes, así que lo que renderices detrás de la rejilla se ve a través en vez de un color de fondo horneado.
Descarga
Enlace directo · sin registro · sin página de esperaConjunto completo — fuentes SVG, exportados PNG en 1x/2x/4x, licencia y readme
Cómo se usa
- Coloca las casillas con un paso de 76 px — el sprite de 72 px más 4 px de separación — y los bordes quedarán a un píxel en vez de duplicarse.
- Dibuja el icono del objeto centrado en la casilla a unos 50 px; el hueco interior es de 66 px, así que cualquier cosa mayor toca el borde y se come el marco.
- Cambia el sprite entero de la casilla para los estados seleccionada y bloqueada en vez de superponer un tinte, porque las marcas de esquina y el rayado forman parte del sprite.
- Los marcos de rareza sustituyen directamente a la casilla vacía — mismos límites, mismo hueco — así que un cambio de rareza es un solo cambio de textura sin tocar el layout.
- La casilla de 72 px está dimensionada para un icono de objeto de 48 px con aire alrededor; a 64 px el marco doble empieza a apretar el objeto y el borde de rareza deja de leerse.
Licencia
Creative Commons Atribución 4.0 — Gratis para uso comercial. Atribución obligatoria. Términos completos · Qué significa en la práctica
"Oak Casillas de inventario — rejilla de 72px" by Oğuzhan Girgin, licensed under CC BY 4.0 — https://www.colorosse.com/assets/2d/ui/oak-inventory-slots


