Abandonemos la noción de "página web"

Disculpen el extremismo manifiesto de esta frase pero no estoy intentando hundir ningún barco. Aligero la carga que llevamos a nuestras espaldas desde hace años y con la que, a estas alturas, yo me siento algo incómodo.

Cuando pensamos en “páginas web” establecemos criterios de definición, arquitectura, composición, maquetación… que parten de la idea “página en blanco” para crear y construir. Pero ¿qué pasa cuando, de repente, el ancho de tu página no es fijo?. ¿Qué pasa cuando los contextos de uso de una supuesta página se amplían?. ¿Qué pasa cuando la interactividad adquiere mayor relevancia?. El concepto “página” comienza a difuminarse, pierde su sentido pero, sin embargo, lo seguimos utilizando de la misma forma que “colgamos el teléfono” o “tiramos de la cadena”. Con el añadido que en nuestro caso condiciona nuestro trabajo.

A veces rellenamos espacios que creemos controlar pero el futuro no lo podemos pintar así. El futuro se viste de contenido adaptable, modificable, flexible, que se acomoda a diferentes espacios, que podemos seguir integrando en un documento llamado página (definición de la RAE: Documento situado en una red informática, al que se accede mediante enlaces de hipertexto) o web pero que ya no trabaja con esa noción original.

Insisto. No estoy cuestionando el concepto que utilicemos. Eso tiene fácil solución. El problema es el enfoque que damos a nuestros productos o servicios interactivos a partir de la definición formal y del modelo mental que todos manejamos.

Buscando “aliados” que defiendan argumentos sobre esta idea he dado con Mark Boulton, cofundador de Five Simple Steps y autor de Designing for the web. Sus explicaciones en este sentido son muy claras:

Binding content to the book is what all good book designers do. To do this, they use Canons of Page Construction, or other principles to design grid systems that, when populated by content, create that connection. But with all paper-based design, they start with paper. Paper that has edges, ratios that can be repeated. A canvas. And here’s the thing. Creating layouts on the web has to be different because there are no edges. There are no ‘pages’. We’ve made them up.

Quizás sea necesario profundizar mas en estos argumentos y dedicar mas reflexiones digitales pero como dice Boulton, el momento es ahora. Tenemos que empezar a librarnos de ciertas ataduras que condicionan nuestros proyectos.

Todo esto creo que enlaza muy bien con un post que dejé por aquí hace un tiempo sobre la simplicidad y la curación de contenido. En aquel momento se insistía en la necesidad de dar máximo sentido a nuestro contenido. Ahora el objetivo vuelve a ser el mismo y se refuerza con una nueva idea:

Don’t start from an imaginary page

Responsive Web Design o Diseño web sensible

Hay que reconocer que la traducción de Responsive Web Design como diseño web sensible no parece la mas apropiada pero es la que ya está mas extendida. El concepto, creado por Ethan Marcotte (@beep) y publicado por primera vez en su artículo de A List Apart, ya está en plena expansión y supone el pistoletazo de salida a una nueva etapa de nuestra evolución digital.

Hubiera preferido diseño web adaptativo, adaptable, escalable o incluso flexible pero, sea cual sea su denominación, anticipa una nueva y potente forma de crear, diseñar y desarrollar sitios web. Si seguimos por esta línea las cosas van a cambiar mucho y los diseñadores ya están ampliando su horizonte de posibilidades, perspectivas y oportunidades.

Responsive Web Design by Ethan Marcotte

Algunos comienzan a ofrecer diseño sensible y otros lo demandan con urgencia para no morir atrapados en una constante adaptación de sitios a dispositivos, plataformas, formatos… Veremos éxitos indiscutibles, desastres naturales y chapuzas solidarias.

Las empresas e instituciones lucharan nuevamente por renovar sus espacios pero la transición será lenta y dolorosa, especialmente si las decisiones las toma el directivo, jefe o mandamás de turno convertido en “experto-opinador en desarrollo web y redes sociales varias”. Incluso presupuestos enormes y cuentas gestionadas por vendehúmos harán las delicias del futuro online de nuestros gobernantes, que no de los gobernados.

Pero hasta que todo esto llegue disfrutaremos con los buenos ejemplos que ya pueblan la red y seguiremos trabajando por optimizar y mejorar experiencias visuales. Es todo un reto y, en este caso, creo que volverá a merecer la pena porque el concepto como tal, sea cual sea su nombre, es bueno, muy bueno. Aumenta la utilidad y funcionalidad de los sitios que visitamos generando a su vez nuevas tendencias en diseño y nuevos  estándares que nos obligarán a ponernos las pilas para saber qué ofrecer y cómo ofrecerlo.

Si quieres saber mas tienes el libro Responsive Web Design, escrito por Marcotte y publicado hace unos meses. Pero también comienzan a publicarse interesantes entradas y artículos en diferentes lugares. En Fuse Interactive tenemos un buen ejemplo. Niall Morgan habla de Responsive Web Design y describe de forma resumida el funcionamiento:

The magic of responsive web design is the use of media queries. Media queries are something that has been around since CSS 2.1 in the form of media types but was limited to declaring things like stylesheets for print. When the W3C began working on CSS3 they created the @media query to take it to the next level. In CSS3 media queries allow you to get specific properties of the users browser and operating system such as screen width and screen orientation. With that information we can dynamically change the layout of the site for anything from a 24 inch monitor all the way down to a smart phone.

Actualización 02/01/2012

Dos interesantes referencias que nos hablan de los problemas e inconvenientes del Responsive Web Design:
Responsive Web es un técnica incompleta por César Soplín (via UXLearn)
-Desde el post de César…  Responsive Design is Irresponsible por Kevin John Gallagher.

Estoy de acuerdo con algunos de sus planteamientos y entiendo que no es posible considerar el Responsive Web Design como la solución definitiva, única y final de cualquier site. Valoro esta innovación y su posible evolución ya que ofrece nuevas oportunidades y deja atrás prácticas tremendamente complicadas, poco eficientes.

 

Empleos y sueldos ($) en Experiencia de Usuario [Infografía]

Llega la segunda parte del análisis realizado por Onward Search a las profesiones y profesionales UX.

Se trata de una infografía que recoge empleos, descripciones, sueldos, competencias, además de la localización geográfica de las oportunidades profesionales en EE. UU (según datos ofrecidos por SimplyHired).

User Experience Careers Guide

Empleos y sueldos($) en Experiencia de Usuario

Atendiendo a los datos ofrecidos por Indeed y GlassDoor, la compañía americana Onward Search hace un repaso a las profesiones más demandadas en UX y nos indica las generosos sueldos que se cobran al año (me ahorro la traducción de la profesión para no generar demasiada confusión):

User Experience Strategist: Entre 67.000 y 135.000 dólares.

Usability Analyst: 81.000 dolares.

User Interface Designer: Entre 84.000 y 155.000 dólares.

Interaction Designer: 91.000 dólares.

Information Architect: 104.000 dólares.

Cualquier comparación con las profesiones y sueldos ofrecidos en otros países tendrá poca utilidad dado que tendríamos que valorar aspectos sociales, culturales, económicos…

De la información ofrecida por Onward Search me ha convencido la brevedad con la que han definido las competencias y responsabilidades de cada profesional.

 

Hipmunk, un ejemplo de app para iPad

Hipmunk es un sencillo y simplificado buscador de vuelos y hoteles que acaba de publicar su app para iPad.

Hipmunk newsearch

La presentan como una integración con su ya existente versión para iPhone/iPod y al descargarla es capaz de detectar automáticamente qué dispositivo estás utilizando en cada momento (algo que no parecía muy recomendable para ninguna app pero que en este caso resuelven acertadamente).

hipmunk iPod

Desde su creación en agosto de 2010, los fundadores de Hipmunk (parte de ellos son fundadores a su vez de reddit) han conseguido revolucionar las búsquedas en este sector con una interfaz intuitiva que facilita la visualización de resultados a partir de un colorido timeline.

hipmunk timeline

Su éxito radica precisamente en esta forma de mostrar resultados y en un conjunto de características visuales poco comunes en los buscadores online como la gestión de varias búsquedas por pestañas o la selección de múltiples días para iniciar la búsqueda.

Hipmunk Multiple days

Son aspectos de una cuidada interfaz que les permite marcar la diferencia y bromear con ello, comparándose con otros buscadores como Kayak:

You could describe Hipmunk, for example, as a “user-friendly Kayak” or a “Kayak with better visualization,” but I just think of it as “we’re like Kayak, but better.” (inc.com)

Viendo el resultado en el iPad todo su potencial tienen más sentido, entre otras cosas porque han conseguido realizar una buena adecuación al dispositivo, especialmente en lo que se refiere a visualización e interacción, generando una gran experiencia táctil.

Algunos detalles que en algunos casos son compartidos con el sitio web:

-Diseño adecuado para orientación horizontal o vertical.

-Reducción del número de taps para realizar una o varias búsquedas.

-Mínima introducción de datos a partir del teclado gracias a las sugerencias interactivas.

Sliders o deslizadores para filtrar resultados en el timeline.

-Calendario con scroll y más grande para facilitar la selección de fechas.

Overlap para nuevas búsquedas.

Pop over para el historial de búsquedas.

-Uso del color como un elemento mas de la comunicación visual.

-Principio de vitalidad en los procesos de carga (personaje en acción)

-Ordenación de resultados atendiendo a una combinación de factores muy cercanos al usuario. Como ejemplo destacable ahí está el concepto “agonía” que corresponde a una combinación de precio, duración del viaje y número de escalas.

 

Revolución online para un gobierno que quiere hablar con el ciudadano

No sería una gran sorpresa para nadie advertir de la complejidad y confusión que generan habitualmente los servicios administrativos online de algunos países. En España la situación podríamos calificarla de tormentosa y en algunos casos caótica.

Me arriesgo a afirmar que un porcentaje elevado de usuarios de los servicios de la administración no se sienten cómodos realizando transacciones a partir de las cientos de páginas que gestionan departamentos, áreas, secretarías, ministerios… entre otras cosas porque la accesibilidad, los procesos o la apariencia en muchos casos no se han cuidado ni se han preparado para atender a todos los usuarios-ciudadanos.

En términos generales, localizar servicios o entender el lenguaje empleado suele ser un fracaso constante y la experiencia de navegación no es tan positiva ya que después de varias páginas visitadas sueles terminar en el lugar equivocado.

Menú aeat

Acabamos generando “rituales de interacción” que son los que nos garantizan un acceso directo a servicios que usamos habitualmente y que después de aprenderlos ya no deseamos alterar para evitar el error.

El problema es que a medida que un gobierno va introduciendo tramites o servicios online en los actuales sistemas las posibilidades de iniciar una construcción más coherente van difuminándose. Es como tener un seiscientos y comenzar a ponerle extras o tunear toda su carrocería, aun sabiendo que al motor no le quedan muchos años de vida o que no sube las cuestas porque no puede con el peso de la gran familia que lo utiliza. Todo el dinero empleado en ir introduciendo mejoras no soluciona el problema de fondo: cambiar de coche.

Quizás por todas estas razones comenzar a plantear un único site donde acudir para resolver cualquier gestión, trámite o servicio online, anteponiendo las necesidades de los ciudadanos a las densas estructuras administrativas, no es una idea descabellada. Tanto es así que desde el lado teórico y práctico ya se ha hecho y se llama Alpha.gov.uk (@alphagov).

An unfinished experimental proof of concept of what the UK Government could do with just one rather than many websites

Este proyecto me parece digno de mención porque se sustenta en el esfuerzo de un conjunto de profesionales que, basándose en una lista de recomendaciones (revolution not evolution) y continuando con un prototipo, han alcanzado una línea de propuestas que el propio gobierno de una nación ya empieza a debatir (aunque por desgracia sea condenando nuevamente el sistema a los feudos actuales).

alpha.gov.uk

A grandes rasgos el prototipo ha buscado centralizar en la home los accesos más comunes y añade un atractivo buscador que permite el acceso directo a un servicio, departamento o simplemente la localización de contenido relacionado con algún concepto. El sistema asume que:

– La gente comienza utilizando un motor de búsqueda,

-busca reducir al mínimo el tiempo que pasa en el sitio web de un gobierno o administración,

-no entiende su estructura.

El resultado es la búsqueda de un solución simple a un problema complejo:

Government should take advantage of the more open, agile and cheaper digital technologies to deliver simpler and more effective digital services to users.

Pero siguiendo esas directrices la home no es la única que soporta el peso de todo el proyecto.

It’s all about the nodes, aka landing pages, and what lives at them, not the hierarchy of the website that they live on.

Many commercial websites live or die by the effectiveness of their landing pages, and the same applies to government.

Toda la propuesta está fundamentada, ha llevado un trabajo profundo haciendo uso de metodologías DCU y se ha materializado en un prototipo “alfa” que se declara a sí mismo erroneo, inconsistente e impreciso. Pero está ahí, obteniendo feedback constante.

Una gran ayuda para enfocar este asunto por el buen camino.