Quizá no te has detenido a pensarlo, pero los usuarios -incluidos tus posibles clientes- huyen de los blogs desordenados y confusos.

¿A qué nos referimos cuando hablamos de confusión? Básicamente, a los obstáculos que dificultan la navegación del usuario.

En Men with Pens nos dan unas cuantas pistas. Estos son algunas de las peores prácticas:

- Banners que parpadean como una máquina tragaperras, hasta provocar dolor de cabeza.

- Toneladas de enlaces con literales vagos, difíciles de identificar.

- Widgets y anuncios de redes sociales que saturan todo el espacio.

- Una columna lateral más larga que la Enciclopedia Britannica.

¿Qué es lo que tus clientes buscan en realidad?

Se supone que en ese desorden, tu cliente potencial debe ser capaz de encontrar:

- El artículo que quiere leer.

- Tu lista de servicios.

- La razón por la que eres capaz de darle un empujón a su negocio.

- Una muestra de trabajos anteriores.

- Información profesional sobre ti.

En resumen: lo que a ti te interesa es conseguir que tus posibles clientes descubran tu trabajo y encuentren enseguida la forma de contratarte. Pero cuando reina la confusión, lo más normal es que renuncien a su propósito y huyan despavorido de tu sitio web.

Estos consejos pueden ayudarte a conseguir un blog limpio y ordenado:

(más…)

Cuando entregas una propuesta al cliente, es inevitable que éste opine. Al fin y al cabo, el trabajo que estás haciendo es para él, va a ser él quien lo utilice y, sobre todo, es él quien pone el dinero… Por eso es lógico que prestes especial atención a lo que el cliente opina sobre tu propuesta.

Hasta aquí, todo parece claro. Pero no podemos olvidar otro aspecto importante: el cliente te ha contratado precisamente porque tú eres la persona que sabe realizar ese trabajo. Tú eres el experto, y tampoco tendría mucho sentido que incorporases todas sus peticiones de forma acrítica, y acabases desvirtuando el resultado final.

Interesante paradoja, ¿no?

En Signal vs Noise señalan el riesgo, bastante típico, de que dejemos de “crear” y acabemos “siguiendo instrucciones”. Y es que muchas veces, llega un momento en que el profesional “desenchufa su cerebro” y se dedica a incorporar al proyecto cada uno de los comentarios del cliente. Lo explican así:

“En un intento por agradar, acabas aceptando el “feedback” como si fuera una solución, en vez de como una serie de sugerencias”.

Está claro que, en última instancia, es el cliente quien decide. Pero tampoco le hacemos ningún favor si aceptamos todo lo que sugiere de forma acrítica, incluso cuando sabemos por experiencia que puede estar cometiendo un error. Parece más lógico “defender” -al menos una vez- aquellas partes que creemos importantes en nuestro proyecto, mientras tomamos buena nota de las correcciones razonables, las mejoras y las buenas ideas que el cliente sin duda nos aporta.

La propuesta es que tomemos el feedback como lo que es: sugerencias, impresiones, reacciones; una buena oportunidad para encontrar nuevas ideas que nos permitirán llevar el proyecto en la dirección adecuada. Pero nunca como un libro de instrucciones que hay que seguir al pie de la letra.

¿Cuál es tu experiencia?

Puedes consultar el artículo Stop following directions and start designing, publicado por Jason Z en Signal vs Noise, el blog sobre diseño y usabilidad de 37 Signals.

¿Necesitas ideas frescas para tu próximo sitio web? ¿Quieres saber qué es lo que se lleva?

En Instantshift han recopilado 55 buenos diseños de sitios web corporativos.

Son sencillos, atractivos e inspiradores. Es imposible que no encuentres algo interesante.

¿Cómo hay que tomar las decisiones en el proceso creativo? ¿Qué es lo que hace que un diseño tenga éxito? Cada diseñador podría mencionar decenas de factores que influyen de manera decisiva en el resultado final. Pero hoy nos vamos a quedar con las 7 claves que nos propone Brett Lovelady, de la compañía Astro. Entre otras ideas, nos recuerda el famoso dicho: “un camello es un caballo diseñado por un comité de personas”. No te lo pierdas:

1. El diseño es un punto de vista

Mucha gente cree que el diseño es el objeto que surge como resultado del proceso creativo: un dibujo, una foto, o un esquema elaborado por una persona con ciertas capacidades creativas. Sin embargo, Lovelady sostiene que el diseño es el punto de vista mismo, algo que ocurre ANTES de producir el resultado. El diseño consistiría, por tanto, en aplicar un punto de vista a una idea original para transformarla en algo tangible, que podemos compartir con los demás.

Los buenos diseñadores tienen ese talento, que les permite aplicar su punto vista, sostenerlo, convertirlo en algo que los demás pueden ver y comprender, y transformarlo finalmente en un objeto.

2. Al final, el usuario siempre es cliente nuestro

Como diseñadores colaboramos con profesionales de otras disciplinas para dar vida a nuestros diseños. Muchas veces diseñamos algo y pasamos un montón de tiempo “protegiendo” nuestra idea original de los profesionales con los que trabajamos (programadores, jefes de proyecto, clientes, etc).

Y es normal, porque una vez que el producto está “en la calle”, todo ese esfuerzo se vuelve invisible. El resultado final es lo único que la gente ve, experimenta o recuerda de nuestro diseño. A nadie le interesa cómo se llegó hasta allí, ni lo dura que fue la batalla para proteger la experiencia de uso.

Por eso, mientras los profesionales de otras disciplinas hacen su trabajo, los diseñadores debemos convertirnos en “abogados” o defensores del usuario final. Debemos recordar al resto del equipo que lo que estamos construyendo va a ser utilizado por personas con necesidades y expectativas específicas.

3. Potencia la creatividad individual

Todos hemos oído aquel dicho: “un camello es un caballo diseñado por un comité”. Y es así. Resulta muy complicado “diseñar” en grupo cuando hay muchos puntos de vista diferentes encima de la mesa. Está muy bien darle voz a cada persona, recopilar las diferentes opiniones y asignar la importancia que cada una de ellas merece. Pero para evitar que acabemos diseñando “un camello”, resulta más eficaz potenciar la propuesta creativa de una única persona. Alguien en el que podemos confiar, para que se convierta en el guía y el guardián de la visión por la que hemos apostado.

(más…)

En The Boston Globe se dieron cuenta hace ya tiempo de que las buenas imágenes necesitaban protagonismo también en la web, un campo hasta ahora poco propicio por los problemas de conexión y de ancho de banda. Por eso crearon la sección The big picture, en la que ofrecen a los lectores fotografías de gran formato. Normalmente, esas imágenes son auténticas joyas informativas por sí mismas, así que imagínate cuál es la calidad de las mejores fotografías del año 2008. No te las puedes perder.

Algunas conclusiones

Aunque otro día hablaremos más en profundidad sobre la importancia de las imágenes, experiencias como la de The big picture nos permiten extraer varias conclusiones:

El mercado está maduro. Las conexiones han mejorado lo suficiente, y cada vez podemos mostrar en la web imágenes de mayor tamaño y calidad.

Se acabaron los cromos. La relación entre las imágenes e Internet fue dura al principio. Las páginas debían ser extraordinariamente ligeras para facilitar la carga en dispositivos y conexiones todavía rudimentarias. Las pocas imágenes que se mostraban eran poco menos que “cromos”, gifs y jpgs de escasa calidad. Hoy ya no hay motivos que justifiquen esta costumbre “reductora”.

El peso del lado técnico. En los inicios, también eran rudimentarias las herramientas que se utilizaban para generar contenidos, por lo que la balanza se inclinó por el lado técnico más que por el artístico. La consecuencia fue una cierta despreocupación por el aspecto de la web. En este contexto, las imágenes no salieron muy bien paradas. Afortunadamente para todos, esto ha cambiado de forma radical.

Un recurso valioso. Más allá del impacto visual que las buenas fotografías son capaces de generar, The big picture demuestra que las imágenes constituyen un recurso informativo de primer orden. El pequeño texto que las acompaña, lejos de quitarles protagonismo, sirve para poner al lector en situación y completar su experiencia.

Imágenes que aportan algo. Cada vez tiene menos sentido la rutina de incluir fotografías en los posts y artículos porque sí, como si fueran un mero recurso de relleno. Lo ideal es que esas imágenes aporten algo a la información. Que la completen, que la refuercen y, en muchos casos, que esas imágenes constituyan el elemento central de la información.

Hay hueco para las imágenes. Con el imparable ascenso del vídeo, algunos pensaron que el tiempo de las imágenes en Internet tocaba a su fin. Fenómenos como el de Flickr demuestran que, hoy por hoy, eso está muy lejos de ocurrir. 

PD: Es evidente que no podemos competir con las mejores imágenes del año, así que hemos optado por recuperar todo un clásico de los inicios de la web:

“Antes de hacer algo, piénsalo bien”. ¿Quién no ha oído esta frase alguna vez en su vida? Es de sentido común. Pero lo que mucha gente todavía no sabe es que, antes de arrancar cualquier proyecto, puede resultar muy útil plasmar las ideas en un papel o en una pantalla. Sí. Como lo oyes:

No importa si eres un consultor IT, un analista de negocio o un diseñador web. “Dibujar” lo que tienes en la cabeza antes de lanzarte a redactar, a programar o a diseñar puede resultarte de gran ayuda.

Si dibujas lo que tienes en la cabeza, tendrás la oportunidad de:

1. Asegurarte de que el planteamiento de partida tiene bases sólidas: en cuanto plasmas tus ideas en un papel o en una pantalla, comienzan a aflorar dudas e inconvenientes que hasta ese momento no te habías planteado. Pasar del concepto al boceto exige ordenar y estructurar las ideas, y saca a la luz aspectos que no estaban en nuestra cabeza.

2. Compartir tu idea con más gente. Pasar de lo abstracto a lo concreto -por ejemplo, de una idea a un esquema- nos ayuda a compartir nuestro proyecto con el resto de la gente: clientes, usuarios y colaboradores. Siempre es más fácil comunicar algo con un apoyo gráfico.

Para dibujar lo que piensas puedes utilizar lápiz y papel, claro. Pero también hay otros recursos y herramientas:

Mapas mentales

Un mapa mental es un diagrama usado para representar las palabras, ideas, tareas, u otros conceptos ligados y dispuestos radialmente alrededor de una palabra clave o de una idea central. Se utiliza para la generación, visualización, estructura, y clasificación taxonómica de las ideas, y como ayuda interna para el estudio, organización, solución de problemas, toma de decisiones y escritura. Más información en la Wikipedia.

Puedes utilizar Freemind, un software gratuito, para construir más fácilmente tus mapas mentales.

Y 2 sistemas de diagramación que se han convertido en auténticos clásicos a la hora de construir un sitio web:

Diagramas de flujo

Son esquemas que representan la estructura y el flujo de navegación de un sitio web o de una aplicación. Algo así como un “plano” en el que se muestran las conexiones y la interacción entre las diferentes partes de un sistema. El aspecto de los elementos es lo de menos mientras pueda comprenderse el flujo. Esta visión esquemática y de conjunto te permitirá sacar a la luz bastantes nudos y contradicciones que hasta el momento habían pasado inadvertidos.

Ejemplo de diagrama de flujo.

Wireframes o maqueta

Un wireframe es una representación esquemática de una página web. No muestra elementos gráficos, porque lo importante es establecer el contenido y el comportamiento de las diferentes páginas.

El wireframe puede ser más o menos detallado: se considera de baja fidelidad cuando se limita a representar aspectos generales, y de alta fidelidad cuando alcanza un gran nivel de detalle, por ejemplo, en el caso de una maqueta dinámica que permite, incluso, interactuar al usuario.

Ejemplo de wireframe o maqueta.

Diferencia entre wireframe y prototipo

Un wireframe no debe confundirse con un prototipo. Hay una diferencia fundamental entre ambos: los prototipos se construyen para funcionar -aunque no cuenten con una funcionalidad completa- mientras que los wireframes o maquetas tienen como principal objetivo representar el sistema, y no tanto actuar. Podríamos realizar un wireframe de baja fidelidad con lápiz y papel, y sería perfectamente válido siempre que resulte comprensible.

Estructura, no diseño

En ambos casos (diagramas y maquetas), el aspecto es absolutamente secundario. De hecho, introducir elementos de diseño en esta fase suele consistir un grave error: el cliente enseguida centrará la discusión en las formas y colores, dejando de lado otros temas fundamentales

Entre las aplicaciones que puedes utilizar para tus diagramas web se encuentra Jumpchart.

Más información sobre los wireframes en el blog de Olga Carreras.

¿Eres diseñador web? Hay cosas que nunca vas a escuchar de tu cliente, y que pueden ser muy útiles para hacer unas buenas previsiones y acertar en tu trabajo. Más vale que seas capaz de anticiparlas por ti mismo:

1. “No estamos preparados”

Es posible que tu cliente tenga una “idea general” de lo que quiere, y que te dé una lista con algunos sitios web de referencia. Pero, más allá de esto, lo más probable es que no haya pensado bien sobre lo que necesita, ni sobre cómo cumplir sus objetivos de negocio. Así que no esperes que te entregue una lista de requisitos y funcionalidades.

Sí. Es muy probable que tu cliente no esté listo para arrancar el proyecto, pero eso nunca te lo va a decir…

2. “El plazo de entrega que hemos marcado es imposible”

¿Para cuándo? Ya sabes la respuesta: para ayer, para mañana, en una semana y, en el mejor de los casos, “tan pronto como sea posible”. Pero el hecho es que, aunque empieces al día siguiente, y estés preparado para hacer tu trabajo muy rápidamente, es muy difícil que la empresa esté dispuesta a moverse a esa misma velocidad. Seguro que falta algo, o que algún empleado con información clave para el trabajo no está disponible.

Muchas veces, el cliente sabe que el plazo de entrega que ha exigido es imposible. Pero no esperes escuchar estas palabras de su boca…

3. “Vas a sudar para obtener los contenidos a los que nos comprometimos”

Sacar, o mejor dicho, “extraer” contenidos -textos, imágenes, información- del cliente se convierte en todo un reto. Puede que tú lo tengas todo listo, pero los contenidos que el cliente se comprometió a entregarte, nunca van a llegar a tiempo, si es que lo hacen.

4. “La verdad es que no sé manejarme con el ordenador”

Da igual lo fácil que lo pongas: algunos clientes no están familiarizados con el uso de la tecnología. Los hay que no saben convertir un Word en PDF, o cambiar el tamaño de una fotografía. Hasta ahí, todo bien. Pero otros clientes no sabrán ni siquiera que es Gmail, o Flickr. No sería la primera vez que les mandas unas imágenes en jpg para decidir la línea y gráfica y el cliente te responde: “Oye, que lo que mandaste ayer no funciona. Hago clic sobre el menú pero no hace nada…”

Lo dicho: no esperes a que te avisen. Prepárate para lo peor.

5. “Nuestras expectativas son irreales”

A menudo, el cliente no es capaz de valorar el coste y el esfuerzo de algunas de las tareas o funcionalidades que está exigiendo. Es fácil que te demande Flash, AJAX y DHTML, y que acompañe la petición con una frase lapidaria de esas: “Hombre, muy difícil no puede ser, porque hoy en día eso lo tienen todas las webs…”

También es muy común que el cliente solicite cosas que realmente no necesita para su modelo de negocio. De lo que puedes estar segura/o es de que no te va a decir, antes de arrancar el proyecto: “Ya sé que lo que te estoy pidiendo es imposible de hacer”…

6. “Mejor que no te hagas ilusiones. Estamos considerando otras propuestas”

Puede que notes al cliente realmente interesado en lo que le propones. A lo mejor parece incluso entusiasmado. Pero el hecho de que sea simpático contigo no significa que el trato esté cerrado. Es mejor que te guardes tu alegría para el momento de la firma. Lo demás, no dejan de ser especulaciones con mayor o menor base. Recuerda que, normalmente, los clientes manejan varias ofertas, y que no siempre te van a advertir de ello.

*Selección y resumen libre del artículo Six Valuable Things Web Design Clients Won’t Tell You, publicado por Ben Seigel en FreelanceSwitch.

LA BOCA DE LA VERDAD. En la imagen, la mítica “Bocca della verità“, una antigua máscara de mármol situada en Roma y que, según la leyenda, muerde a quienes introducen la mano y no dicen la verdad. Si vas por allí, ten cuidado…

Teoría de 1 euro: Dícese de todas aquellas teorías por las que no deberías pagar ni siquiera 1 euro (1.2467 dólares al cambio).

Hoy presentamos una de esas famosas teorías: “Sobre gustos no hay nada escrito”.

La realidad es que sobre gustos hay muchísimo escrito. El problema es que muy poca gente se ha tomado la molestia de leerlo…

Afortunadamente, Olga Carreras sí lo ha hecho. Después de estudiarse el libro Psicología del color: cómo actúan los colores sobre los sentimientos y la razón, de Eva Heller, ha publicado una reseña muy completa en su blog, Usable y Accesible. El libro está basado, entre otras fuentes, en una encuesta realizada a 2000 personas. Imprescindible para diseñadores y demás artistas.

La tesis del libro

[...] los colores y los sentimientos no se combinan de manera accidental [...] sus asociaciones no son cuestión de gusto, sino “experiencias universales profundamente enraizadas desde la infancia en nuestro lenguaje y nuestro pensamiento”, lo cual puede explicarse, como hace a lo largo del libro, mediante el simbolismo psicológico y la tradición histórica.

Reflexión para los diseñadores

“Quien nada sabe sobre los efectos universales y el simbolismo de los colores, jamás podrá emplearlos adecuadamente”.

¿Sabías que…?

El azul es el color que más adeptos tiene, independientemente del sexo y la edad. No hay ningún sentimiento negativo en el que domine el azul, por el contrario, en China es un color poco apreciado.

El amarillo es un color difícil para los diseñadores porque los colores que lo acompañan forman con él fácilmente un acorde negativo, por ello, a pesar de ser el más llamativo, sólo aparece en las cajas y envases cuando tienen clara relación con su contenido.

El verde alegra la vista sin cansarla pero se puede volver aburrido.

El negro es el color preferido de la juventud, cuanto más joven se es más se prefiere, sin embargo ninguna persona de más de 50 lo nombra como preferido. La razón es que los mayores lo asocian a la muerte y los jóvenes lo asocian a la moda

No hay ningún concepto negativo que se asocie al blanco, aunque casi nadie lo nombra como preferido u odiado.

Las personas mayores prefieren los colores más luminosos que los jóvenes. Con la edad se van prefiriendo colores como el amarillo, el verde, colores juveniles.

Un color parece más lejano cuanto más frío es.

Los colores intensos parecen estar más cerca que los pálidos.

Hay un principio estético y es que esperamos encontrar los colores ligeros encima de los pesados. Quien entra en un espacio con el suelo claro y el techo oscuro se encoge como si perdiera el suelo bajo los pies.

El color naranja no existía en Europa antes de que los cruzados trajeran esta fruta de Oriente

Durante la Edad Media el color de las ropas estaba regulado y llevar un color no acorde con tu estatus social se penaba incluso con la muerte

Esto y mucho más en el post Reseña: “Psicología del color” de Eva Heller.

Los genios hacen lo que quieren… Con este “blanco sobre blanco”, Malevich puso el mundo de la pintura patas arriba.

Las elecciones USA llegan a su fin. Mientras los norteamericanos siguen escrutando los votos para dilucidar quién es el nuevo presidente del país más poderoso del mundo, nosotros aprovechamos para aprender un poco más sobre diseño.

A estas alturas, no es ningún misterio que la imagen de Obama da para mucho. Un buen puñado de artistas ha tomado partido (político y estético).

¿Qué te parece el resultado? ¿Candidato o presidente? En unas cuantas horas lo sabremos con certeza.

1. Renueva tus banners con frecuencia. La gente se aburre de ver siempre el mismo banner, con las mismas imágenes y mensajes. Prueba con ideas y diseños distintos.

2. Incluye el rostro de una persona. ¿Por qué? La teoría es muy interesante:

¿Por qué cuesta tanto reconocer tu maleta en la recogida de equipajes pero puedes reconocer al instante a un amigo que hace años que no ves? Porque una parte del cerebro se dedica en exclusiva a reconocer rápidamente rostros humanos.

Puedes aprovechar esta peculiar característica del cerebro humano para hacer que tu banner sea más fácil de reconocer y memorizar.

3. Incluye ofertas y mensajes concretos, con fechas, precios y lugares concretos. Los banners genéricos se pierden entre el ruido de la página.

4. No adaptes la campaña de tu banner en televisión a Internet. Cada lenguaje tiene su medio. En TV tienes 20 segundos de atención del espectador que está viendo un canal. En Internet, tu banner está perdido entre los contenidos e imágenes de la página (creo que la gente que no tiene campañas de publicidad contratadas en televisión puede saltarse este consejo

5. Que tu marca esté siempre presente en el banner, en todos y cada uno de los frames. El efecto “sorpresa” -generar suspense y desvelar la marca en el último frame- no funciona en Internet. Seguramente, en el último frame la atención del usuario estará en otra parte de la página, y ni siquiera se habrá enterado de cuál era tu marca.

Todo esto y mucho más, muy bien explicado en el blog de Jesús Encinar, el CEO de Idealista.

LEMA DE LA IMAGEN: Un banner anticuado es mucho peor que una maleta vieja…