Ir al contenido
Todas las noticias
2 min de lectura

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.

Un nuevo hogar para Hana Games

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