Mi proceso de diseño

2 de Diciembre, 2007

Soy diseñador web profesional hace un año, cuando empecé no tenía nada parecido a un proceso de diseño. Con el tiempo, fui encontrando una forma de organizarme, una agenda de trabajo, que analicé y reescribí varias veces. Así que éste es mi proceso de diseño, por ahí te puede servir para organizar tus proyectos.

Considerar el problema

Porque el diseño está para solucionar problemas, para cubrir necesidades. En el caso del diseño web, el problema lo tiene el usuario que visita el sitio. Esta persona acaba de entrar a un lugar desconocido, en búsqueda de información, porque necesita hacer algo. La función del diseño es facilitar el acceso a esa información y ofrecer cosas para hacer. La página de reservas de un hotel por ejemplo, tiene que mostrar cuáles habitaciones están disponibles y cuándo, junto con la opción de hacer una reserva. Las necesidades de los usuarios se dan de muchas formas, pero siempre es querer algo: querer comprar, querer saber, querer decir, querer sentir…

Materiales

El segundo paso es buscar imágenes en Flickr, colores en ColourLovers, organizar los documentos que envió el cliente, marcar sitios similares y todo lo que se pueda juntar. Información,objetos, fotos, experiencias, todo. Este montón de materiales nos van a ayudar a sumergirnos en el tema, para poder sentirnos como usuarios y como clientes, para identificar mejor las necesidades de cada uno y ofrecer soluciones a través del diseño.

Pre-diseño

Mi proceso de diseñoPrimero en papel dibujando algunas ideas, conceptos, iconos, layouts, etc, y después en la pantalla creando los primeros bocetos, se empieza a formar un pre-diseño para poder mostrarle al cliente. Algo bastante útil es guardar una copia cada vez que hagamos algún cambio significativo. Por ejemplo pre-diseño001.png, pre-diseño002 .png, etc, para poder reciclar materiales y volver atrás en caso de que lo necesitemos.

Diseño

Bueno ahora hay que terminar con lo que empezamos. Primero terminar bien el diseño de la portada y una página modelo para las interiores. Después terminar todas las otras páginas. No me gusta pasar a escribir código hasta tener todo el diseño terminado, desde la portada hasta la página de aviso legal o error 404. Lo mejor es dedicarse a cada tarea, ahora diseño y sólo diseño, después escribo código y no me preocupo por el diseño.

Código

Hay algunas herramientas que ayudan, tendría que probar Coda que es bastante comentado, pero por ahora escribo todo el código en Notepad++. Primero busco que el sitio se vea bien Firefox, después voy haciendo los cambios que sean necesarios para Internet Explorer, Opera y Safari. Por último, la validación de los archivos XHTML y CSS.

Todo listo, cierre del proyecto

Si se puede, lo mejor es dejar pasar un tiempo, aunque sea una tarde y recién después revisar todo el trabajo. Está bueno para alejarse un poco y verlo con otro punto de vista. Cuando sea hora de cerrar el proyecto, lo mejor es dejarle al cliente una muestra online y un archivo comprimido con el trabajo terminado.

Bueno así es como hago mis diseños. ¿Y vos? ¿cuál es tu proceso de diseño?

Estilo versus diseño

1 de Diciembre, 2007

Porqué entender la diferencia es todo

Por Jeffrey Zeldman

Mi padre fue un pintor de fin de semana, él y sus libros de artes jugaron un rol formativo en mi infancia. Como muchos chicos, yo estaba fascinado por la mera representación. Me perdía a mi mismo mirando minuciosamente grabados de batallas de gladiadores, pueblos pintorescos y ruinas romanas al atardecer. Yo entendía el arte como sinónimo de dibujo. El detalle mas minucioso, mas líneas en el grabado u hojas en el árbol, eso era el mejor arte, en mi infancia. Mas tarde, descubrí los cómics. Aún mas tarde, los museos. Maxfield Parrish me hizo querer tomar drogas, y también me hizo dar cuenta que yo nunca podría ser un pintor. Paul Klee parecía un mal artista que no podía dibujar. Andy Warhol fue un tramposo, porque usó asistentes.

No pretendo entender el arte de hoy, pero se que mis primeras impresiones tienen poco que ver con la naturaleza del arte, y todo que ver con la pura sensación visual. Como Disneyland y el circo, arte era espectáculo. Pero sólo se puede subir al Matterhorn una cantidad de veces, y sólo se puede comer tanto caramelo de algodón, antes de que te descompongas. Desde la sensación, me gradué hacia el estilo. El Spider-Man de Steve Ditko. Arte pop. Rock, y entonces alma, y entonces tapas de álbums punks. Yo era un adicto al estilo. No podía diferenciar lo bueno de lo malo, pero sabía lo que era cool.

“Muchos jóvenes diseñadores web ven sus creaciones de la forma en que yo solía ver la cultura pop. Esto es cool o es basura.”

Muchos jóvenes diseñadores web ven sus creaciones de la forma en que yo solía ver la cultura pop. Esto es cool o es basura. Ellos confunden estilo por diseño, cuando las dos cosas no son exáctamente lo mismo. El diseño comunica en todos los niveles. Te dice dónde estás, señala lo que podés hacer, y lo hace fácil. El estilo es tautológico; se comunica estilo. En términos visuales, el estilo es un aspecto del diseño; en términos comerciales, el estilo puedo comunicar atributos de la marca.

También puede transmitir el desprecio del diseñador por el tema. “Esto es muy aburrido, así que acá hay algunas franjas y acá un menú desplegable, así que también van a saber que soy mejor que este estúpido trabajo.” En este nivel, el estilo es un lenguaje subterráneo, de un par a otro, no tiene nada que ver con los visitantes del sitio o el propósito. De hecho, este estilo aplicado puede interferir con la finalidad del sitio. Entonces los gurús dan un paso al frente, y culpan al diseño por las fallas del fetichismo estilístico.

Los diseñadores que se conducen por el estilo pueden tener éxito si tienen suficiente suerte para seleccionar y elegir esos proyectos que benefician sus obsesiones estilísticas. La mayoría de los diseñadores web no tienen ese lujo. Pero eso no les impide aplicar el vocabulario estilístico de los principales diseñadores en los proyectos en los que trabajan. Y entonces terminamos con sitios de e-commerce que parecen volantes para una rave, y sitios informativos adornados con deslumbrantes pero con mas frecuencia equivocadas e inapropiadas introducciones.

La web solía parecerse a una guía telefónica. Ahora gran parte de ella parece un portfolio de diseño. De hecho, se ve como el portfolio de 20 conocidos diseñadores, cuyo estilo es copiado una y otra vez por jóvenes diseñadores que se consideran a si mismos sus discípulos. Las distinciones entre el diseño gráfico y el diseño para comunicar se pierden en estos diseñadores. Cómo la distinción entre el verdadero estilo, que evoluciona a partir de la naturaleza del proyecto, y deriva en el pastiche, que es insertado en muchos proyectos como un tercer brazo.

Cuando el estilo es fetiche, los sitios confunden a los visitantes, perjudicando a los usuarios y a las empresas que pagan por sus sitios. Cuando los diseñadores no empiezan preguntándose quiénes van a usar el sitio, y para qué lo van a utilizar, obtenemos un sentido de la apariencia que le da a la belleza un mal nombre - al menos, en algunos círculos.

El problema es, que vivimos en una sociedad obsesionada con las superficies ( y con miedo de mirar que hay debajo ). En una cultura de consumo donde compramos zapatillas de $200 porque parecen cool y una canción de Beck se usó en el comercial, flash y deslumbramiento son el premio mas valioso de todos los productos básicos.

Para algunos clientes y para muchos diseñadores jóvenes, los proyectos multimedia Flash se han convertido en sinónimo de diseño de páginas web. Si no canta y baila, no debe ser buena, y ciertamente no es cool. Gran trabajo se está creando en Flash (SWF), y está recibiendo el reconocimiento en shows de premios - particularmente en tradicionales shows de premios de alto rango, en donde “el material digital” precede a la multimillonaria industria de comerciales de TV. Los jueces esperan que los comerciales de TV tengan conceptos brillantes y altos valores de producción como la mayoría de las películas comerciales. Naturalmente esperan que los sitios web, también.

Experimentos de estilo barroco construidos con la última tecnología seguirán ganando premios mientras los jueces los sigan viendo en los últimos navegadores con pantallas widescreen y Pentiums con conexiones T1. Y, no es necesario decir, van a ganar estos premios sólo si son dignos de premio en su diseño gráfico y programación. No nos referimos a la mala concepcion aquí. Estamos hablando de diseño a los mas altos niveles, pero el diseño de un tipo único.

La mayoría de mis colegas diseña sitios como estos. Me babeo cuando veo sus logros, y me alegra que se lleven a casa su merecido premio. Pero también me preocupa.

“No hay suficientes diseñadores que estén trabajando en ese gran espacio entre la apariencia y la usabilidad, dónde la mayor parte de la web se debe construir.”

Me preocupa porque los diseñadores jóvenes que confunden estilo con diseño están aprendiendo a copiar los trucos técnicos y estilísticos de sus héroes, pero no necesáriamente cómo comunicar en este medio. El “Bullet Time” es perfecto para “The Matrix”, pero no para documentos. Y dado que una gran parte del diseño de páginas web es informacional - o se supone que lo sea - la venta mayorista de los logros estilísticos de otras personas hace que los sitios informacionales no avancen en el medio, sino que los hacen mas confusos.

Me preocupo porque hay diseñadores que nunca van a evolucionar, estilos individuales, y mucho menos aprender a construir estilos apropiados para marcas en determinados proyectos. Debido a la falta de vocabularios críticos en los reclutadores, que ponen a la gente cuyos portfolios demuestren un conocimiento de “lo que es cool” en puestos de trabajo donde serán miserables. (”Con tu talento, darás vuelta ese lugar.”) Porque eventualmente los diseñadores que conocen de branding y de diseño para comunicación, y quienes conozcan la diferencia entre estilo y diseño, entrarán al mercado y desplazarán algunos diseñadores jóvenes que nunca tuvieron la oportunidad de comprender lo que hacen.

Me preocupa el medio, porque no basta con los que trabajan en ese enorme espacio entre la apariencia y la usabilidad, que es donde la web se debe construir. Y cada vez hay menos incentivos para que los diseñadores web trabajen en esos campos, ya que este tipo de trabajo es de agrado para los usuarios web pero no gana absolutamente ningún reconocimiento de la industria, dejando de lado los cheques. (”Mi Dios, que se cargue tan rápido y trabaje tan bien, incluso en IE3 en la vieja Dell de mi papa.” ¿Usted sabe cómo son los jueces de premios? ¿siempre diciendo cosas como estas? tampoco yo.

Sobre todo, me preocupan los usuarios web. Porque después de más de diez años de desarrollo de la red comercial, todavía tienen que tomarse su tiempo para encontrar lo que están buscando, y todavía se preguntan porqué es tan desagradable leer texto en la web - que es lo que la mayoría de ellos hace cuando están conectados.
Mientras nuestra sociedad siga valorando mas el estilo que el diseño, la superficie sobre el fondo, esta situación no va a mejorar. Por supuesto, lo mismo pienso cada cuatro años, cuando tengo que votar.

Adobe Design Center, Style versus design.

¿Los diseñadores web deberían saber escribir código?

30 de Noviembre, 2007

La respuesta es ¡si!. La razón es que todos los diseñadores creativos deberían conocer el lienzo en el que trabajan. Incluso quienes buscan romper las convenciones, porque para romper las convenciones del lienzo, primero hay que conocerlo bien. Los diseñadores web deberían saber y entender el medio en el cual su diseño será aplicado.

¿Cómo puede un escultor esculpir sin conocer los diferentes tipos de piedras? ¿Cómo puede un pintor pintar sin conocer las diferencias entre pinceles, pinturas y lienzos? ¿Cómo un diseñador para impresión puede crear sin conocer el proceso de impresión, tipos de papel o la diferencia entre CMYK y RGB? ¿Y cómo un diseñador web puede diseñar sin saber escribir código, o al menos cómo trabaja el mismo?

¿Hay que ser un adicto al código HTML o un maestro del CSS para ser diseñador web? No. Pero se deben conocer los fundamentos del medio, y los elementos del mismo, porque son los que le dan vida al diseño. Aprender acerca del medio es fundamental para cualquier diseñador, para cualquier artista.

Mapa de Necochea

27 de Noviembre, 2007

El proyecto Mapa de Necochea, llevado adelante por Proyecto 83, busca crear un mapa completo de la ciudad mediante el uso de la API de Google Maps y la Web 2.0

El mapa

En este enlace se puede ver el resultado experimental del proyecto Mapa de Necochea

Update: el mapa ya no se encuentra online.

El club de los hinchas

27 de Noviembre, 2007

Por primera vez en la historia, los hinchas tienen la oportunidad de comprar y tomar el control de un club profesional de fútbol, dentro y fuera de la cancha.

Miles de usuarios de MyFootballClub aportaron 35 libras cada uno y mediante el sitio llegaron a un acuerdo para la compra del Ebbsfleet United FC. Ahora tienen igual poder de decisión sobre la selección del equipo, transferencias de jugadores y el camino a seguir por el club.

Claves del diseño web

27 de Noviembre, 2007

Usabilidad y accesibilidad, son los elementos claves del diseño web y deberían ser planeados antes que cualquier otra cosa, no marcarlos sólo como algo mas a tener en cuenta.

Además de ofrecer a los desarrolladores la oportunidad de incluir un nivel de interactividad que va mas allá del diseño impreso, estos elementos son los que diferencian el diseño web del diseño para impresión.

Accesibilidad

Permite que sus contenidos puedan ser accedidos por todas las personas, independientemente de la discapacidad (física, intelectual o técnica) que presenten.

Los beneficios de tener un sitio web accesible son varios, uno es el aumento del número de potenciales visitantes de la página web, una razón muy importante para una empresa que pretenda captar nuevos clientes. También disminuyen los costos de desarrollo y mantenimiento, ya que una página web accesible es una página bien hecha, menos propensa a contener errores y mas sencilla de actualizar. Otro beneficio es la reducción del tiempo de carga de las páginas web.

Usabilidad

Es preciso diseñar sitios web para que los usuarios sean capaces de encontrar lo que necesitan, entender lo que encuentran y actuar apropiadamente… dentro del tiempo y esfuerzo que ellos consideran adecuado para esa tarea.

La usabilidad en un sitio web, implica una reducción y optimización general de los costes de producción, así como un aumento en la productividad. Además permite mayor rapidez en la realización de tareas y reduce las pérdidas de tiempo.

Un caso real, después de ser rediseñado prestándose especial atención a la usabilidad, el sitio web de IBM incrementó sus ventas en un 400% (InfoWorld, 1999).

La posición del logo orienta a tus usuarios

27 de Noviembre, 2007

La identidad del sitio web y la compañia son muy importantes para vos, pero también para los usuarios, que lo usarán como un signo de orientación. En estos días, el lugar mas común para ubicar logos en un sitio web es la esquina superior izquierda, a través de todo el sitio.
Está bueno que el logo se mantenga en la misma posición para todas las páginas, porque un cambio de posición podría desorientar a los usuarios, llevándolos a pensar que ya no siguen dentro de tu sitio.

Un ejemplo de buen diseño es el sitio de Apple.

MyC4, hasta que el continente africano conozca la paz

25 de Noviembre, 2007

MyC4 es una plataforma única que permite colaborar directamente con la erradicación de la pobreza en Africa, poniendo a disposición las herramientas para el cambio en las manos de las personas.

MyC4 provee de una platafórma dinámica para crear y mantener nuevas empresas e innovaciones comerciales en una parte del mundo donde es urgente, Africa.

El modelo es simple. Un empresario/a en Africa necesita una inversión para desarrollar su negocio. La inversión puede ser en forma de fondos, asesoramiento o inspiración.

A través de su red de proveedores en Africa, MyC4 ha identificado a las empresas, que ellos denominan Oportunidades. Todas estas Oportunidades pasaron por un riguroso proceso de selección, para asegurarse de trabajar sólo con compañias que provean de proyecciones positivas para su crecimiento.

Un inversor de MyC4 puede invertir en una o mas de estas Oportunidades. La inversión se puede realizar como una persona individual, un equipo/grupo o una compañia/organización.

MyC4 fue pensado para facilitar el contacto directo con los empresarios que necesitan inversión y los inversores. La transparencia y la valoración comercial y personal, hacen que el negocio sea significativo para ambas partes.

Un ejemplo real, el restaurant de Prossy

Como ejemplo, en el sitio de MyC4 se pone el caso de Prossy, que tiene un restaurant en Uganda. La demanda por la comida de Prossy está aumentando, pero ella no puede satisfacer a todos sus clientes, para esto debe aumentar su producción, ella necesita dinero para hacer crecer su negocio, supongamos €1000. El problema es que en Africa los intereses de los préstamos son MUY altos, si es que conseguís un préstamo.

Prossy necesita inversores. Ahora es tu oportunidad para hacer el cambio. Vos podés ser una de las personas que invierta en el negocio de Prossy y le asegure su préstamo.

La dueña de este restaurant africano fijará un interés máximo que pueda pagar. Luego vos decidís tu tasa de interés para tu inversión de, supongamos, €50. Es gratis para vos invertir. Otras personas acercarán sus inversiones junto con los porcentajes de interés para crear entre todos el fondo que Prossy necesita. Si el interés de los inversores, en promedio, supera al máximo fijado por Prossy, ingresarán nuevos inversores con tasas mas bajas para reemplazar a los mas costosos. De esta forma no se supera el máximo que el empresario/a en Africa pueda pagar.

Cuando ya estan dadas todas las condiciones, el préstamo es aprobado y Prossy puede satisfacer la demanda de sus clientes y hacer crecer su negocio. Luego devolverá el préstamo para completar el ciclo de inversión.
Esto es ayudar a Africa a erradicar la pobreza, pero no a través de la caridad, sino de los negocios.

Inclusive se buscó un nombre para su restauant a través del foro de MyC4, y hasta le hicieron un logo!

Miedo a los colores

19 de Noviembre, 2007

Para la mayoría de la gente, el color es un elemento básico en nuestras vidas diarias que usamos por confort, inspiración, practicidad, etc. Pero algunas personas viven en un mundo muy distinto, donde los colores pueden convertirse en la cosa mas horrible.

Cromatofobia - El miedo a los colores

La cromatofobia es un anormal y persistente miedo los colores. Como la mayoría de los miedos y fobias, el miedo al color es creado por el subconsiente como una reacción de protección. Está ligado a un evento emocionalmente traumático del pasado de la persona, que se relaciona con los colores en general o con un color específico. La asociación es tan fuerte que al volver a ver esos colores la persona se siente muy mal.
Esta fobia puede afectar de diferentes maneras, algunos experimentan el sufrimiento todo el tiempo y otros sólo ante el estímulo directo.

Fuente: ColourLovers

El subte a la luz del sol

19 de Noviembre, 2007

The Subway Light Project es un innovador proyecto mediante el cual se captura la luz del sol en la superficie y se transporta usando fibra óptica hacia una estación de subte varios metros bajo tierra. El resultado es un menor consumo de energía, un ahorro para la ciudad y un ambiente muy bueno.

Los sistemas de transporte para la luz solar también se pueden usar en una casa instalando un panel en el techo.


Gestionado con WordPress