Redeseño HA! (Parte 7 â Rompendo algunhas regras)
Séptimo post, dunha serie escrita en tempo real, sobre o redeseño da web historia-arte.com
Versión traducida al español
à hora de deseñar a interface dunha web, existen un gran número de convencións e recomendacións que os deseñadores debemos coñecer: o logotipo deberÃa ir na parte superior esquerda, a icona de lupa significa âbuscarâ, etc. Estas normas son resultado de anos de práctica da profesión e aseguran que a interface vai ser entendida pola xente que a vai usar. Tamén son obxecto de estudos e tests como os que fan na arquicoñecida Nielsen Norman Group que abarcan dende cousas tan variopintas como UX para cans ata outras moito máis concretas como os diálogos de confirmación para borrar elementos.
No redeseño de HA! quixen romper, de maneira consciente, algunhas desas normas establecidas, baseándome en determinados datos que puiden recoller do Piwik (a ferramenta que usamos para contar as visitas). Vai ser interesante, cando o redeseño estea funcionando, comprobar se de verdade estes cambios foron positivos ou non.
U-lo menú?
Actualmente existe unha barra superior cun menú de navegación coas seccións máis importantes (obras, artistas, artigos, etc). Se ben, é o máis normal que calquera web proporcione un menú para acceder a estas seccións, despois de comprobar as visitas que recibÃan esas páxinas, descubrÃn que non chegan nin ao 2% entre todas elas xuntas. A maiorÃa da xente que entra chega directamente de Google, aterrando directamente na ficha dunha obra, artista, artigo ou movemento. Tamén se emprega bastante o buscador. Por iso ocorréuseme a idea de ocultar ese menú e promover o concepto de âcontido como interfaceâ, sen establecer categorÃas ou xerarquÃas. Un usuario pode entrar nunha obra, a partir dela navegar ao museo onde está exposta, logo a outra obra, despois ao artista desa obra, e asà poder explorar e descubrir novas cousas. Algo, por outro lado, que facemos todos cando navegamos, que forma parte do funcionamento natural da web e que explotan outros sitios como a Wikipedia, sen ir máis lonxe.
Está no buscador?
Efectivamente, o buscador é un dos elementos clave desta web e o máis empregado para navegar dun sitio a outro. Un dos problemas que ten o buscador actual é que, unha vez que pos o foco nel, queda agardando a que escribas algo para amosarche resultados. Por que, en vez diso, non aproveitar ese momento de espera para amosar o menú que ocultei previamente, e dese xeito darlle xa opcións ao usuario antes de que faga nada? Esa idea tola, de xuntar o menú e o buscador nun único elemento, non sei se existe nalgunha outra web. Eu polo menos non a vin, veremos que resultado da. Creo que pode funcionar porque serÃa fácil de descubrir, ao estar ligado ao buscador que é o elemento máis empregado da web. Xa o dicÃa Scott Berkun en The myth of discoverability: as cousas máis empregadas teñen máis prioridade, e as menos empregadas, menos prioridade. Parece obvio.
Outra vantaxe engadida é que se soluciona tamén o problema do espazo en móbiles. Ademais diso, tamén se aproveita ese momento do buscador para mostrar as pesquisas máis recentes, que penso que pode ser práctico xa que unha gran cantidade de usuarios visita a mesma obra varias veces.
Para aprender máis sobre as suxestións nos buscadores, Nielsen ten un interesante artigo con boas prácticas e diferentes estratexias.
E o logo?
Xa postos a rachar convencións, desta vez tocoulle ao logo. Un estudo feito por Nielsen (este é a última ligazón que paso del, prometido) indica que os logos colocados na parte superior esquerda son máis fáciles de atopar polos usuarios, que se estiveran na parte da dereita. No caso de HA!, decidÃn non facerlle demasiado caso e xuntar o buscador co logotipo para darlle un maior empaque e deixar a parte da esquerda libre para as imaxes e contido da web.
Promovendo a navegación
Para reforzar máis esta idea de contido como interface, pensei en introducir unha transición entre páxinas a modo de feedback visual. Esa transición, ademais, ten unha dobre función, que é a de mellorar a percepción de velocidade de carga da páxina. à dicir, cando se fai click nunha ligazón, mentres esperas a que cargue a seguinte páxina, non é o mesmo ver unha pantalla en branco, que amosar unha animación a modo de transición que fará que te esquezas de que se está cargando algo. AÃnda que este efecto realmente non fai que a páxina cargue máis rápido, a percepción por parte do usuario, é distinta. E iso é moito máis importante que calquera métrica. De feito, hai infinitos estudos sobre iso, pásovos por exemplo este artigo a modo de introduccion de Matt West. No meu caso, aproveitando o feito de que cada obra ten unha cor propia, fixen unha animación para transicionar dende a cor de fondo actual ata a cor de fondo da seguinte páxina.
E ata aquà todo o que deron estes dÃas de experimentacións e tests. Xa pouco queda para botar a andar a nova interface. Se che gustou este artigo, xa sabes o que tes que facer. Apertas e gozade do verán.