Oak Kit de paneles — paneles de marco doble y botones

Un marco de madera cálida para el tipo de juego que tiene rejilla de inventario y registro de misiones. Dos bordes concéntricos con un hueco entre ellos le dan aspecto tallado en vez de rectángulo marrón plano, y los botones con forma de pestaña se apoyan en una línea base de latón para que una fila de ellos se lea como un juego de páginas y no como una fila de controles sueltos. Todo aquí es una talla más grande que un kit estándar, porque un menú de fantasía suele mirarse, no ojearse.

Dos paneles nine-slice — un marco de ventana de marco doble con esquinas de 32 px y un marco interior rehundido con esquinas de 20 px — cubren casi cualquier caja que necesite un menú: diálogos, rejillas de inventario, fondos de lista, tooltips y paneles de estadísticas. Dos bordes concéntricos con un hueco entre ellos se leen como tallados y no como dibujados, y eso es lo que separa una interfaz trabajada de un rectángulo con un trazo. Los dos se estiran limpiamente a cualquier tamaño porque las esquinas nunca escalan y el centro es un relleno plano.

Sobre los paneles se apoyan cuatro estados de botón de pestaña: normal, hover, pulsado y desactivado. Están dibujados sobre la misma base de 160×48 con esquinas de 16 px, así que cambias la textura en un único widget de botón y obtienes todo el ciclo de interacción sin mover un rectángulo. El estado pulsado baja su cara dos píxeles y quita el brillo superior en vez de solo oscurecerse, y eso es lo que hace que un botón se sienta pulsado y no simplemente recoloreado.

Todo viene dos veces. Las fuentes SVG son los archivos en los que se dibujó el kit — ábrelos, cambia los seis tonos de marrón madera o el único acento de latón pulido y vuelve a exportar. Los exportados PNG son planos, transparentes y preescalados a 1x, 2x y 4x para motores que quieren bitmaps, sin alfa premultiplicado y sin sombra horneada fuera de los límites del sprite.

Creative Commons Atribución 4.0 — Gratis para uso comercial. Atribución obligatoria. Términos completos · Qué significa en la práctica