Terminado

Creación de skins de interfaz de usuario para Flulpycrea

Publicado el 21 Junio, 2017 en Diseño y Multimedia

Sobre este proyecto

Abierto

Contamos en la actualidad con una aplicación de gestión de LAN-Houses orientado a juegos (cibers), y necesitamos que un artísta gráfico y de maquetación le haga nuevas skins a su interfaz.

sobre la app

nuestra aplicación (los .Exe) por sí solos carece de interfaz, estos leen un archivo de texto llamado "skin.dat", que describe las posiciones, colores y tamaños de todos los elementos que en su conjunto forman la interfaz que ve el usuario, y allí también se define que imágenes .Png usa el objeto.

una skin

entonces para nuestra aplicación, una skin = una carpeta llena de .PNGs, y un archivo de texto descriptivo de la interfaz misma.

Cabe destacar, que por ejemplo, un simple botón, puede ser conformado por 4 o 5 PNGs, uno para cada estado, por ej: modo normal, modo con el mouse arriba o siendo el componente activo, modo siendo clickeado, modo función ya activada (en el caso de los botones que son de doble estados). En fin, esos efectos de visualizar la acción del usuario se ven muy bien en cualquier interfaz.

Por lo tanto al crear los PNGs, el artista tiene que trabajar con plantillas y distintos layers (capas), para no procesar todo el trabajo repetitivo una y otra vez, cuando se hacen conjuntos de botones todos coherentes, o iconosgrafía de herramientas, etc.

Una contra, es que los EXEs no trabajan el canal alpha de los PNG (está hecha en Vb6), los controles usan una máscara de bits (un archivo .bmp de 1 bit per pixel), el color de cada pixel blanco o negro indica si es 100% transparente o 100% opaco, no hay intermedios, para que un botón se vea con un borde suavizado (anti-alias), o un área semi-transparente, hay que simularlo, en el png de la imagen mezclar incorporando la imagen del fondo y dibujarle arriba.

Por eso en la skin primero se diseña el fondo de la ventana, y luego las imágenes de cada control en ellas. Cabe destacar que de acuerdo al Login ciertos controles pueden no mostrarse, y por eso el fondo de la ventana tiene que ser dibujado por completo, y no pretender dejar huecos vacíos donde normalmente van los controles.

partir modificando en su totalidad skin ya hecha

ya contamos con varias skins hechas, de las que se puede estudiar pngs y partir desde allí, como para ir modificando pngs y hacer una skin completamente nueva, pero también queremos, en lo posible, re-maquetar la interfaz en la medida de que sea más intuitiva al usuario final, de hecho, uno de los objetivo es mejorar la usabilidad.

(Adjuntamos archivo skin.dat (texto), y una captura de carpeta skin ya hecha).

tiempo necesario para hacerlo bien en todos sus detalles

creemos, que a un verdadero artista de cualquier programa de dibujo relevante, le tomaría solo dos semana de trabajo intermitente y relajado armar una skin, no le vamos a mentir, es un bodrio la repetición una vez que ya hiciste el tema gráfico a usar, pero por eso se paga y no lo hago yo mismo.

OBJETIVOS:

Nuestro objetivo es tener varias skins nuevas.

Tengo en mente, skins con gráficas del tipo vectoriales (tal vez estilo TRON Legacy) u otros estilos vectoriales, o skins muy vistosas que vuelvan locos a los gamers de esos establecimientos (los juegos más populares son dota2, League of Legends y cs:go, como para tener una idea de que puede ir las gráficas). Realmente queremos que la skin denote tecnología, que genere ventas, deben ser coherentes (uniformes) y usables, que impresionen pero a su vez que no estén muy cargadas de gráfico ni colores fuertes o perderán usabilidad e intuitividad!.

plataforma de trabajo

la única forma de que el artista vaya probando la skin que estará creando, es instalar el software, simular ser un ciber, requerirá de instalar un servidor y luego un puesto cliente, recomendamos usar un virtual machine para eso. Pero no quedará otra que usar el software o no podrá ver que es lo que hace su skin, y probarla en todas sus posibilidades.

También eso va a requerir familiarizarse con el uso del software, abrir varias cuentas con diferentes privilegios de acceso, para ir viendo como que visualiza la skin en las diferentes modalidades. (No se preocupe es fácil).

Adjunto una imagen, para que vean una skin pre-existente en uso.

El sitio web oficial del software es http://www.flulpycrea.com.ar

El precio a invertir sería por cada skin a entregar.

Categoría Diseño y Multimedia
Subcategoría Ilustraciones
¿Cuál es el alcance del proyecto? Crear nuevas ilustraciones
¿Es un proyecto o una posición? No lo sé aún
Disponibilidad requerida Según se necesite

Plazo de Entrega: No definido

Habilidades necesarias

Otros proyectos publicados por G. R. F.