Un nuevo hogar para Hana Games
Reconstruimos la web del estudio desde cero. Un escenario más oscuro para los juegos, un rojo que significa algo y una tipografía que sobrevive a veinte idiomas.

Hana Games tiene una web nueva. No es una capa de pintura: la desmontamos hasta el armazón y la volvimos a montar.
Por qué
¿Sinceramente? Porque la anterior era fea.
Se había vuelto pesada y gris. Parecía una plantilla. No decía nada de los juegos en los que pasamos los días, y llevábamos meses parcheándola en vez de admitirlo. En algún momento lo honesto es empezar de cero.
Los colores
La web es casi negra a propósito. Ink (#08080a) es el fondo en todas
partes, con una surface (#101013) algo más clara detrás de los paneles,
para que la ilustración sea siempre lo más brillante de la pantalla.
Luego hay un rojo: #e20c17. Se usa con cuentagotas y siempre para lo mismo:
una etiqueta de sección, el botón principal, la línea corta bajo un título.
Cuando todo lo que rodea está tranquilo, un rojo basta para decir mira aquí.
El texto es blanco roto, lo llamamos paper (#f4f3f1), en vez de blanco
puro, que deslumbra en una pantalla oscura. El gris secundario se mantiene claro
para que siga siendo legible, porque el texto gris es donde las webs suelen
perder a la gente.
La tipografía
Los titulares son Archivo, en pesos gruesos, en mayúsculas y con las líneas casi pegadas unas a otras. Es una grotesca con algo de filo industrial, que le va bien a quien se gana la vida construyendo mundos.
Las etiquetas pequeñas usan la misma familia con un espaciado muy amplio en lugar de una segunda fuente. Es un truco barato, y hace que toda la web parezca una sola pieza.
El cuerpo de texto es una sans neutra, elegida por un motivo aburrido: tiene que sobrevivir a veinte idiomas sin deshacerse.
Las formas
Las esquinas están cortadas, nunca redondeadas. Parece nada, pero es el detalle que hace que la web se sienta nuestra: un guiño a los paneles de las recreativas y a los carteles impresos, no al software.
Hay exactamente dos adornos: una rejilla técnica fina y el damero de nuestro logo. Sin sombras, sin cristal esmerilado, sin degradados que fingen ser luz.
El movimiento
Casi no hay. Una línea se dibuja bajo un título. Un cartel gira cada pocos segundos. El logo se puede agarrar y girar, porque una marca en 3D divierte una vez. Todo lo demás se queda quieto, y quien haya pedido a su sistema menos animación no recibe ninguna.
Y los juegos
Van primero, que era de lo que se trataba. El estudio, las noticias, esta página: todo lo demás viene después.
- Estudio
- Web