Recortes

Si ya estás ducho en la materia del diseño web, esto te va a sonar mucho. Pero si eres nuevo uno de los mejores consejos que te pueden dar a la hora de establecer un diseño correcto es que le prestes atención al texto. Y no me refiero sólo a una buena selección de fuentes.

Por ejemplo tenemos Baseline para juguetear un poco. Incluso puedes recurrir a Typetester para comprobar cómo se ven esas fuentes “estándar” del sistema.

Pero este artículo que enlazo a continuación es bastante completito y desarrolla una serie de puntos importantes a tener en cuenta para una correcta maquetación de texto en web. Incluso me ha descubierto lo del Hyphenator.js que no conocía y tendré que probar en algún momento :)

Lo dicho, lectura recomendada.

:: Type Tips, consejos para la tipografía en web :: (Vía Nudonation)

Hace poco tuve la oportunidad de impartir un par de seminarios sobre Fireworks para los alumnos de Artes visuales. Estuvimos pegando un buen repaso al programita para demostrar en profundidad, que, realmente, le pega muuuuchas vueltas a Photoshop en lo que respecta a prototipado y diseño web. Como les prometí algún tipo de documentación adicional que repasase los puntos clave, he pensado que puedo matar dos pájaros de un tiro: refrescarles la memoria a ellos y enseñaros a vosotros la verdadera potencia del programita en cuestión y el por qué se hace tan interesante. Créeme, si con esto no te convences de que Fireworks es una joya, nada lo hará :P

Como el asunto se extiende bastante y estoy casi seguro que una super parrafada no la digerís de una vez, dividiré el artículo en varias partes. Vamos con la primera:

(more…)

Si no lo habéis visto ya, para eso me lo traigo. Frases de esas lapidarias, que te grabas a fuego, reinterpretadas gráficamente por artistas de lo mejorcito del mundo visual.

:: 10 Design quotes designed [en] :: (vía NFG!)

PD: Aunque no necesariamente relacionado, al escribir esto me he acordado de Ridiculous Design Rules [en]

Me gustaría hacer de este post algo más introspectivo. No alzar la vista fuera sino quedarme con “lo de dentro”. ¿Por qué sugeriros the 30 most awesome typos you can use to be a perfect designer and a handsome boy cuando en realidad no existe algo como tal? Prefiero contaros cuáles son las que yo vengo usando porque el tiempo me ha demostrado que funcionan bien. Son sólo una pequeña muestra pero creo que es la más representativa. Sobra decir que porque las use yo, no quiere decir que sean mejores o peores, además siempre habrá proyectos que requieran usar otro estilo totalmente diferente. Pero siempre agradezco cuando me cuentan este tipo de cosas y he pensado en hacer lo mismo.

Por tanto quiero dar paso a las protagonistas que aparecen listadas bajo un criterio totalmente aleatorio (según me voy acordando). No sé cuantás serán pero seguro que no pasan de 10-12. Por cierto, en un principio iba a separarlas en dos categorías: web e impresión. Pero con cositas que ya conocemos no creo que haga falta discernir entre fuentes seguras y las que no lo son.

(more…)

Cuando empieza un año generalmente suele acabar otro (obviously). Es tiempo de apuntarse metas y de hacer retrospectivas. Como no sé si me dará tiempo a hacer una en condiciones, yo creo que de momento os puedo dejar con la que hacen en Usable y accesible, uno de los blogs sobre diseño de interacción en castellano que más me gustan y que recopilan en este listado sus mejores artículos sobre el tema.

Ya sabéis, si UX no es algo que os suene a chino, os va a interesar mucho:

:: Usable y accesible: Lo más visto en 2009 ::

Pues eso, que en Speckyboy [en] han hecho un recopilatorio bastante potable con documentos y enlaces relacionados con usabilidad y patrones de navegación e interacción en la web. Enchufad la aspiradora y empezar a pasarla por todo lo que hay dentro :)

:: An introduction to understanding and implementing Web Usability [en] ::

Ha sido la gota que ha colmado el vaso. Entrar a la web de DDI y comerme con patatas la redimensión automática de la ventana del navegador. Y si hay una cosa que me cabree más que el target=”_blank” sin notificar, es esta puñetera manía de escalar la ventana sin mi permiso.

Porque no digo que sea una mala práctica, pero sin mi permiso es… una mierda. Así, claramente. ¿Para qué voy a ponerle florituras si es lo que pienso?

Seamos serios, si vamos a necesitar que se maximice la ventana, al menos que cumpla uno de estos dos requisitos básicos: 1) que se avise al usuario y que sea éste quien de la conformidad o 2) que la menos sea porque se necesita el espacio para el contenido.

Cuando no se cumple ninguno de los dos aspectos, que me expliquen a mí que razón hay. Informar al usuario de manera previa a realizar una acción es básico de cara a una correcta experiencia. ¿Estaría bien que si borramos un archivo se nos avisara sólamente cuando ya fuera irrecuperable o que no tuviéramos un paso de confirmación final durante un proceso de compra online? Pues eso.

Nota: Se puede desactivar desde las propiedades de Javascript en Firefox. Pero esto, claro, lo desactiva para los automáticos y los que no lo son. No me vale señoría.

Nota 2: Como añadido, viene bien lo de la filosofía Unix y el diseño.

Igual alguno recuerda el caso de Nico y Web2. Todo un ejemplo de “efecto cadena” en esto de los parecidos razonables.

El caso que me traigo hoy es un poco peculiar porque por tercera vez he llegado tarde al aviso y no he podido hacer una captura como mandan los cánones. Y es que Altheo me avisó de que Squembri tenía un nuevo hermano virtual en Buho SPM del que ahora mismo sólo queda algún fleco. Aunque os puedo asegurar que hace un par de días, las dudas quedaban bien despejadas.

Es lo que tiene estar bien posicionado en Google, que te expones a ser “fuente de inspiración” para unos cuantos. Ojo, no digo que esté mal el pegarse un repaso por webs a la hora de afrontar proyectos pero el copy paste…. Recuerdo que cuando me puse a hacer el micro micro micro site para Hangman (ojo que tiene música) me miré unas cuantas webs que usaban maderas y colores pardos para ponerme a ello. Pero de ahí a algunos casos de parecidos que ya han pasado por aquí, hay un mundo.

El tiempo dirá si Squembri vuelve a “ser noticia”.

Hoy es fiesta aquí pero os voy a dejar un caramelito para los sufridores de otros países y currantes españoles que no hacen puente :D

¿Ya tenéis Windows 7? Particularmente he notado el salto notablemente porque me he saltado la generación Vista y a nivel de experiencia de usuario me parece que la cosa ha evolucionado favorablemente. Esto os lo digo por si os pica el gusanillo y queréis sentaros un rato para ver Designing the Windows 7 Desktop Experience [en].

Luego también podréis echarle un vistazo rápido a la comparativa entre dos modelos de interfaz móvil a la hora de lidiar con aplicaciones: App Interface Models in iPhone and Android [en].

Y para acabar, dos super enlaces de usabilidad que me he guardado para seguir desde hoy: Usability Post [en] y UI Trends [en]. Ambos sacados de 10 UX blogs you should be reading [en].

La culpa de que ponga esto es del gran Carlos (ánimo chaval que de todo se sale). Parece que o bien es un mail en cadena o realmente hubo un simpático que se tomo la molestia de responder a una oferta de trabajo en la que los requerimientos quizá sean, digamos, un poco más elevados de lo normal.

Parecerá una tontería pero me ha parecido bien reirnos un poco de esta situación que en realidad no es tan rara como pueda parecer.

El texto original está en portugués por lo que es posible que comenta algún fallo de traducción. Igualmente las risas están aseguradas.

(more…)

Porque son dos cosas distintas, ¿no? Según la RAE, plagiar significa:

Copiar en lo sustancial obras ajenas, dándolas como propias.

La Wikipedia, lo desarrolla un poco más:

Se denomina plagio a una infracción del derecho de autor sobre una obra de cualquier tipo, que se produce mediante la copia de la misma, sin autorización de la persona que la creó o que es su dueña o posee los derechos de dicha obra, y su presentación como obra original. Es decir, una persona comete plagio cuando copia o imita algo que no le pertenece haciéndose pasar por el autor de ello

Confieso que estoy inmerso en una espiral descendente de cuestiones que me hacen incapaz de discernir realmente cuando algo es un plagio y cuando no lo es.

Está claro que lo del cartel de la peli de Coixet es plagio. ¿Todos de acuerdo? Más info aquí en Domestika.

Pero, ¿lo de la lotería es plagio? ¿O se trata de un parecido razonable como pudiera ser éste que puse hace tiempo? ¿Y lo de Telefónica?

Mi sección de parecidos razonables se nombró así precisamente para intentar mostrar lo delgada que es la línea entre las diferentes situaciones. Contiene plagios flagrantes, copias descaradas amparadas posiblemente por la ley (tu no estás plagiando algo si ese algo no está registrado de manera pertinente) y casos de originalidad cero.

A lo que yo voy es al cuidado que deberíamos tener todos cuando la cosa es tan peliaguda. Porque confundir fuentes y tipografías es relativamente común pero nos exime de problemas mayores. ¿Quién sabe si el día de mañana nos acusan de difamación por hablar de plagios inexistentes?

Cuidadín señorías. ¿Plagio o falta de originalidad?

PD: El anuncio de la Lotería de hecho, contó con personal que hizo el “original” (+ info)

Lo dije ayer y es el momento. Si tenéis 4-5 minutos, dedicadlos exclusivamente a leer por completo la siguiente web. Todos deberíamos aprender de este chaval porque si no es el próximo amo del mundo, habré perdido la esperanza en la humanidad.

Grandísimo documento que me ha pasado Javier Rioja, de Ril, al que estaré eternamente agradecido por las risas que me eché ayer cuando lo leí por primera vez. Madre mía, impresionante! No suelo pedirlo pero creo que esta vez no estaría mal que difundiérais la voz. Creo que la ocasión lo merece de sobra!

:: Así se promociona un diseñador freelance…o freeland! ::

¿Sabes cual es la diferencia entre un ideograma y un pictograma? ¿O un Rebus? ¿No? Quizá te interese pasarte por esta entrada en Snap2objects [en] en la que amplían información sobre estos términos y algunos otros más de carácter similar.

La pongo porque me ha recordado esta entrada de Domestika en la que se trata el tema de los iconos en las aplicaciones web. Ha habido taaantas veces que se me pedían iconos para acciones tan complicadas que dudo mucho que la imagen realmente tuviera una función útil :S

:: The History of Symbols [en] :: (Vía Metropolis)

En NFG han publicado un interesante artículo que quiere servir de ayuda a todos aquellos que están empezando a buscar trabajo o han acabado los estudios gráficos. Es para que no se asusten tanto a la hora de empezar a repartir la semilla :)

:: El largo y tortuoso camino para conseguir empleo como diseñador ::

Cuando estuve haciendo las prácticas en la editorial de la Universidad de Oviedo, una de mis labores fue la correción ortotipográfica y de estilo, todo un tostón al principio que terminó por entretenerme mucho al final, como si de hacer sudokus estuviéramos hablando.

La ortotipografía viene a ser el conjunto de reglas y convenios que nos dicen qué está bien escrito y qué no lo está. Es lo que nos dice si los paréntesis van en cursiva si su contenido lo está o cuánto espacio hemos de dejar si hablamos de capitulares. Hay un sugerente listado de estas reglas aquí: ortotipografía.

Lo de los signos es otra cosa. Igual te has topado a la hora de maquetar un libro con alguno de estos símbolos. Es una notación que ayuda a agilizar el tema de la corrección de textos. Todo un código Matrix del género literario. En esta guía ortotipográfica se pueden ver los más usuales (creo que falta alguno) y una aplicación de los mismos.

Y dirás, ¿pero esto a qué viene? Pues que me ha picado el gusanillo tras ver el manual de Axel y pensé: “pues vamos a hablar de este tema un poquito”. Es mi blog, ¿no?

Que las charlas TED [en] son un ejemplo de que Internet es una fuente que otorga conocimientos de muy alto nivel está fuera de toda duda. Espero que ya las conozcas.

El bueno de Sandman ha rescatado una de ellas: ¿Matan las escuelas la creatividad?. Curiosamente ayer mi pareja me decía que sería incapaz de realizar labores creativas (refiriéndose a mis labores de diseño), que “eso se había quedado atrás”. Yo recuerdo haberme pasado mucho tiempo con los plastidecor, escuchando música… incluso escribí una breve obra de teatro en 3º EGB sobre la contaminación.

Realmente estoy muy de acuerdo con lo que se postula en la charla. Creo que se da demasiado poca importancia a las artes en la educación primaria y a medida que avanzamos, va disminuyendo aún más.

Aquí os la dejo. Disfrutad 20 minutos subtitulados de TED y recordad que aquí hay muchas más subtituladas.

:: Matan las escuelas la creatividad? ::

Good design is innovative.
Good design makes a product useful.
Good design is aesthetic.
Good design helps us to understand a product.
Good design is unobtrusive.
Good design is honest.
Good design is durable.
Good design is consequent to the last detail.
Good design is concerned with the environment.
Good design is as little design as possible.
Back to purity, back to simplicity.

Lo dice el gran Dieter Rams en esta entrevista [en] que he visto en Surfstation [en].

El eterno dilema: ¿playa o montaña estas vacaciones? Permitidme que os libre de la duda esta vez. ¿Qué tal si nos damos un placer visual, hacemos la maleta, y nos vamos de vacaciones “diseñiles”?

He pensado que estaría bien hacer un pequeño recopilatorio con el fin de recopilar información sobre algunos de los museos más destacados que se dedican a albergar conceptos y objetos de nuestro mundillo, el del diseño. Ya sean vacaciones en Londres o en Holanda, siempre tendrás una parada casi obligatoria que no deberías dejar pasar.

Por tanto, aquí os va esta pequeña selección de los museos de diseño repartidos a lo largo y ancho del mundo más significativos. He intentado buscar la información más interesante relativa a los mismos: su web, ubicación, info general… Espero que os sea de ayuda y si tenéis alguna recomendación más (por ejemplo no conozco nada de America Latina), serán bien recibidas.

(more…)

Al equipo de Adobe le da igual que lo haya visto hacer en CSI. Una foto de movil no se puede ampliar al 1600% y que tenga calidad y definición. Da igual que el que le vendió el movil le dijera que Nokia tiene las mejores cámaras.

Si su diseñador le pide su logotipo, no es para que usted habra la página web de la empresa y copie el gif de cabecera. Si eso valiese, ya se le habría ocurrido al diseñador. Tampoco sirve una foto de su tarjeta de visita, que le veo venir.

Para reflexionar un rato :)

:: Guía rápida entendimiento diseñador a cliente + cliente a diseñador ::

Me encanta la web de Functioning Form [en]. Siempre hay perlitas relacionadas con la usabilidad en el diseño de interfaces y web y cada vez me gusta más este tema por lo simple que parece ser y las complejidades que conlleva realmente.

Uno de sus últimos regalitos es Web Form Layouts: some additional guidelines [en] desde el que podremos saltar hasta sendos artículos de misma y apasionante temática.

También está llevando a cabo una cobertura-resumen de UX London [en] con artículos del tipo What Makes a Design Seem Intuitive? [en].

Para tenernos entretenidos :)