Omar Tosca — Co-Founder and Design Director at Shortcut

Diseñar en la era AI al estilo Shortcut

Tue, 28 Apr 2026 00:00:00 GMT

Hoy no traigo la ya clásica conversación "diseñar no es solo dibujar cuadritos" (evolución de la cansada UX no es UI) fomentada por la creciente idea de que las nuevas herramientas potenciadas con AI vienen a suplir diseñadores.

Vengo a traer un poco de la experiencia que hemos tenido en Shortcut experimentando constantemente con herramientas nuevas. Nuestra naturaleza está en experimentar, fuimos de los primeros en probar Figma hace 10 años y seguiremos siendo de los primeros en experimentar con estas nuevas herramientas.

Diario sale una herramienta nueva, diario nos preguntamos si servirá agregarla a nuestro stack de herramientas, diario vamos y probamos la nueva para descartarla de ser posible, pero también para entender por donde está yendo la exploración más allá del canvas infinito (por un lado) o de la conversación con un chat (por el otro).

Hasta ahora hemos encontrado un punto medio en ambas, un punto que nos da mucha tranquilidad, porque busca mediar ambos mundos: el humano y el artificial.

Ese punto medio lo hemos encontrado en las conexiones: archivos de contexto (design.md), conectores como MCP o CLI, uso de Skills, entre otros.

Para nosotros no es importante que una IA genere interfaz por nosotros. Si no que nos ayude a optimizar, aclarar y potenciar el proceso, luego a mejorar la implementación. Si la IA tiene posibilidad de conectarse con nuestros canvas, donde potencialmente está la mayor parte de nuestro trabajo, entonces lo tomamos.

El proceso entonces ya no solo es colaboración humana, sino también con la máquina.

MCP como enlace con la máquina

En estos meses nos la hemos pasado probando varios softwares de diseño con acceso vía MCP:

✅ Figma (MCP oficial y 3ros)
✅ Framer (de tercero, no oficial)
✅ Pencil
✅ Stitch (Google)
✅ Paper

Simplificado, un MCP es una forma (existen otras como CLI o API) en cómo los agentes AI pueden comunicarse con algo en particular, en este caso, software de diseño.

Cada una de estas apps tienen la misma intención al integrar MCP como funcionalidad: conectar su canvas "infinito" con código usando agentes AI de por medio.

Algo que descubrí es que la diferencia principal que cada app tiene radica en su propuesta de valor que, por la naturaleza de las herramientas, es apenas ligeramente diferente una de la otra.

Figma, la herramienta más usada en la era pre-AI como software bastante maduro, lo que ofrece es un "add-on" que permite comunicar mejor todos los archivos que ya tenemos ahí con agentes que puedan sacarle provecho. Esta es su gran ventaja, pues prácticamente no tenemos que migrar a otras plataformas para aprovechar lo que ya diseñamos en ella.

Tristemente me encontré también con la versión de este Figma con una conexión "en beta" con limitada funcionalidad, a la espera de que le den un "upgrade" que debamos pagar.

La aparente ventaja que el resto de la lista tiene sobre Figma es que vemos software pensado con AI en mente, algo así como "nativos del AI".

A Pencil le gusta mucho hablar de su "swarm mode" donde múltiples agentes atacan el mismo problema desde perspectivas distintas. El acercamiento a la productividad parece su fuerte, quizá un poco en exploración, pero más allá de eso la herramienta está limitada por el modelo mismo que se use (en este caso Claude). Hay algunas reglas adheridas al agente para mejorar su enfoque al UI, pero una funcionalidad así solo es útil en ciertos momentos del proceso de diseño de interfaces.

Paper en cambio, habla de su capacidad "nativa" de comprender las interfaces, pues el canvas infinito no construye vectores con su propia abstracción (como Figma), sino que literalmente construye HTML y CSS nativo, haciendo mucho más sencilla la construcción en código, además de permitirles integrar funcionalidades como Shaders directamente en la aplicación. De todas las opciones, Paper parece que la que más futuro prometedor tiene, me llamó la atención su aura de Figma 2018.

Nuestra siguiente opción, Stitch (de Google) trae consigo una serie de nuevas herramientas (como design.md) que abren un abanico de posibilidades para explorar diferentes alternativas visuales, también trae algunas deficiencias intencionales de la herramienta. Creo que de todas es la que provoca la conversación más interesante: ¿Qué es lo que realmente buscamos en una herramienta que se supone que potencie nuestras capacidades como diseñadores de interfaz?

La gran desventaja que tiene Stitch sobre el resto es que, como ya dijimos anteriormente, estas herramientas están limitadas por el modelo que los alimenta (algo así como el motor detrás).

Si bien, soy muy fan de la forma en como Gemini 3.1 diseña interfaces, también soy consciente de las capacidades tiene, que en este caso aunque la multimodalidad le da valioso poder de entendimiento visual, también se queda corto en lo que Claude (e incluso GPT) sí logran hacer.

La conversación sobre los modelos es una cuestión que cambia semanalmente. Lo último que se supo es que Google por fin se lo está tomando en serio, entonces veremos.

Otras propuestas

La intención de conectar nuestros modelos y reglas a nuestros canvas infinitos, es diferente a la propuesta de valor que Claude Design, Lovable, v0 y demás ponen en la mesa.

Estas otras herramientas están destinadas a usar código y el constrain de un website o app para entablar la comunicación a nivel diseño y funcionalidad.

Ahora sí que el modelo mental detrás es el de que la forma sigue a la función.

¿Es el código el nuevo canvas de los diseñadores de interfaz? Creo que eso quedará pendiente para otra publicación.

Rascándole a mi historial escrito

Fri, 06 Mar 2026 00:00:00 GMT

Le pedí a Gemini y Claude que se echaran un clavado en mi historial de tuits y posts para extraer todos los posibles blog posts que nunca publiqué en mi blog personal.

Toda la semana extraje nuevos posts que "escribí" en el pasado y salvo 2014, todos los posts fueron escritos por mi pero en diferentes plataformas.

Extraje básicamente de 3 lugares: Medium, Twitter y Linkedin.

Yo pensé que por años no había escrito nada, pero era pura mentira. Nomás lo puse en demasiados lugares al mismo tiempo.

Toda mi carrera, todas mis ideas en un solo lugar. Estoy impresionado.

Desarrollando...

App Defaults · 2026

Wed, 04 Mar 2026 00:00:00 GMT

List of app defaults I am currently using:

Mobile Design & Prototyping → Antigravity with Gemini + Claude
Web Design → Figma / Framer / Antigravity
Mail Client → Hey!
Notes → Obsidian
To-Do → Todoist
Calendar → Cron / Notion Calendar
RSS → Ares
Contacts → Google Contacts
Browser → Dia / Chrome
Chat → Telegram / WA
Bookmarks → mymind
Read It Later → mymind
Word Processing → Obsidian
Spreadsheets → Google Sheets
Presentations → Pitch / Antigravity with Slides Skills
Shopping Lists → Google Keep
Meal Planning → Self Builded App
Budgeting and Personal Finance → Google Sheets
News → Particle / Twitter
Music → YouTube Music
Podcasts → Pocket Casts / YT Music
Newsletters → Hey!
Code → Antigravity / Claude Code

IA y herramientas de diseño: el nuevo mundo

Tue, 13 Jan 2026 00:00:00 GMT

Originalmente publicado como serie de tweets en X/Twitter. Enero–Febrero 2026.

Tengo acceso a modelos de IA tan buenos que no tengo idea de para qué usarlos. Es tan buen modelo que siento que para mis tareas simplonas es demasiado poder.

Suena como un buen problema, pero en realidad revela algo importante: la mayoría de nosotros no necesitamos la IA más potente. Necesitamos la IA correcta para nuestro contexto.

El diseño importa más que nunca

Entre los MCPs de Pencil y Stitch, los skills de animations dev, web design guidelines y Remotion, las herramientas de diseño de Cursor, sigo confirmando mis conclusiones de este nuevo mundo:

El diseño es importante para quienes están creando. Aún creando con estas herramientas, los que saben de diseño producen resultados significativamente mejores. La IA amplifica lo que ya sabes; no reemplaza lo que no sabes.

Lo que diseñar con IA realmente significa

Para aclarar: diseñar con IA no es pedirle a la IA que diseñe por ti. Es usar la IA como una extensión de tu proceso, como un copiloto que acelera la ejecución pero no toma las decisiones.

Como pasó cuando llegaron los sistemas de diseño: ya no tienes que diseñar 50 pantallas con cada estado del sistema. El sistema lo resuelve. Con la IA pasa algo similar —la ejecución repetitiva se automatiza, y tú te enfocas en las decisiones que importan.

La batalla de las herramientas nativas

Entre MagicPath, Variant y Stitch se van a pelear por ser la herramienta de diseño nativa con IA. Es emocionante ver cómo el espacio se está fragmentando y especializando al mismo tiempo.

Y que GitHub se esté convirtiendo en el nuevo Dribbble, no estaba en mi combobox de la década. Los desarrolladores están publicando proyectos visuales, los diseñadores están publicando código. Las líneas se están difuminando.

La nostalgia del crear por crear

Voy a hablar como señor, pero extraño esos tiempos donde creamos cosas para aportar valor a los demás, no para hacer dinero.

Una parte que me enoja de "hacer un negocio" y lo que el sistema mismo empuja es que eventualmente el profit pesa más que solo hacer algo para los demás. Los clientes que se buscan son los que más pagan, no los que más lo necesitan. Lo que en consecuencia acrecienta la brecha y nunca hace posible ir por los que se rezagan.

Las promesas como "vamos a democratizar X" o "haremos Y más fácil para que todos le entren", eventualmente se olvidan.

Lo que viene

La IA no va a matar al diseño. Va a matar a los diseñadores que no diseñan. A los que se esconden detrás de procesos y frameworks sin jamás abrir Figma. A los que piensan que "pensar estratégicamente" es suficiente.

Para los que hacemos, las herramientas solo mejoran. Y eso es emocionante.

TLDR — La mejor herramienta del mundo no sirve de nada si no sabes qué construir con ella.

Fuentes originales

Lo que los rediseños nos enseñan

Wed, 10 Sep 2025 00:00:00 GMT

Originalmente publicado en LinkedIn. Septiembre 2025.

Siempre que te involucres en un rediseño de producto grande, puedes esperar quejas. Sin excepción. Y eso está bien.

La queja es inevitable — y es una buena señal

El cambio siempre es complicado para los humanos. No porque seamos irracionales, sino porque le habrás tocado algo muy específico: la memoria. Sobre todo la muscular. Ese conjunto de gestos aprendidos, de rutas trazadas sin pensar, de automatismos que el usuario construyó con tu producto y que de un día para otro dejaron de funcionar igual.

La queja no es evidencia de que hiciste algo malo. Es evidencia de que el producto importaba lo suficiente para que las personas lo usaran hasta automatizarlo.

El problema viene cuando confundimos ese ruido con una señal.

Memoria muscular vs. mal diseño — no es lo mismo

Hay dos tipos de queja en un rediseño, y saber distinguirlas es una habilidad que vale oro.

La primera es la queja de ajuste: "ya no sé dónde está el botón", "me tardé más en hacer lo de siempre", "todo se ve diferente". Esta es la voz de la memoria muscular recalibrándose. Es temporal, predecible, y si tu rediseño es sólido, se resuelve sola en cuestión de días o semanas.

La segunda es la queja de fondo: "esto no tiene sentido", "antes podía hacer X y ahora no", "¿por qué complicaron algo que funcionaba?". Esta es diferente. Esta te está diciendo algo sobre la calidad de las decisiones que tomaste.

Leer la diferencia requiere ir más allá de la superficie de las opiniones.

Las preguntas correctas

Cuando llegan las quejas — y llegarán — el movimiento equivocado es defenderse o capitular de inmediato. El movimiento correcto es preguntar más.

¿Le redujiste tres pasos a la tarea y aún así los usuarios se quejan? Habrá que revisar más a fondo. ¿Qué era lo que la forma anterior hacía tan sencilla para estas personas? ¿Qué se afectó con el cambio que no habías contemplado?

A veces la respuesta está en algo tan pequeño como una affordance que desapareció. Otras, en que la ruta nueva es objetivamente más corta pero cognitivamente más demandante. Las métricas no siempre lo capturan; hay que hacer más preguntas, hablar con las personas, no quedarse con el número.

El rediseño revela cosas que el diseño original jamás te habría mostrado.

Las trampas del camino

El rediseño tiene espejismos que convencen con facilidad.

Uno de los más comunes: confundir la queja con validación del diseño anterior. "Los usuarios extrañan cómo era antes" no significa que como era antes era bueno. Significa que era conocido. Son cosas distintas.

Otro: reaccionar demasiado rápido. Los primeros días después de un lanzamiento son los más ruidosos y los menos representativos. La distribución de opiniones se asienta con el tiempo, y los patrones reales emergen después del primer impacto.

Y el más sutil: enamorarse del rediseño antes de que el mundo lo conozca. Eso hace más difícil escuchar con honestidad cuando las señales llegan.

TLDR — En el rediseño hay muchos pasos en falso, caminos sin salida y espejismos. Es cuestión de entrenar los sentidos para detectar el camino correcto.

Fuentes originales

Siempre que se involucren en un rediseño de producto grande... (septiembre 2025)

La cultura iuxer está dañando el diseño en Latam

Thu, 21 Aug 2025 00:00:00 GMT

Originalmente publicado como serie de tweets en X/Twitter. Agosto–Diciembre 2025.

Estoy bastante convencido de que la razón más grande por la que no tenemos más buenos diseñadores UI en Latam es la insistencia del gremio por convertirlos en managers masters de la estrategia que solo hacen wireframes, que buscan un lugar en "la mesa", que delegan la ejecución.

Eso tiene consecuencias reales. Y ya es tiempo de decirlo directamente.

El hijacking del lenguaje

Todo empieza con el lenguaje. Odio el momento en que la gente decidió decir "no tiene UX" a lo que normalmente deberíamos llamar "está mal diseñado".

No es un detalle menor. Cuando dices "no tiene UX", conviertes UX en un sustantivo, en algo que se agrega o se quita, en un ingrediente de cocina. Cuando dices "está mal diseñado", hablas de un oficio que alguien ejerció bien o mal.

El primer framing pone al "UXer" en el centro como el guardián de una sustancia misteriosa que los demás no poseen. El segundo framing habla de calidad y de responsabilidad sobre un resultado.

El hijacking no fue accidental. Le conviene a quienes construyeron su identidad profesional alrededor de la primera versión.

La técnica católica de vender cursos

Algo que la industria iuxer sigue creyendo es que para combatir todos estos problemas necesitas ser un diseñador "estratégico" —lo que sea que eso significa—, que piensa "más allá de los pixeles", que tiene "una silla en la mesa".

Y para llegar ahí, hay que comprar el curso.

Está curiosa la forma de vender formación de algunos iuxers, usando la que yo llamo la técnica católica: hacerte sentir culpable por todo.

"Solo quieres diseñar pantallas" — como si eso fuera algo de lo que avergonzarse.

"Es tu culpa que no puedas crecer" — como si crecer significara dejar de hacer.

"El producto final es un asco, es tu culpa porque no entiendes el negocio" — como si entender el negocio requiriera dejar de saber diseñar.

La culpa como motor de venta es vieja como la iglesia. Aplicada a una disciplina creativa, es particularmente dañina: convierte a diseñadores jóvenes en ansiosos crónicos que creen que nunca son suficientemente "estratégicos", en lugar de enfocarse en volverse extraordinariamente buenos en lo que hacen.

Lo que se perdió en el camino

Hace años que no hago wireframes en mi proceso normal de diseño. Después de sketchear algo breve o analizar el problema, imaginaba y diseñaba directamente con design system en mano. Podría decirse que era wireframing 2.0: el pensamiento estructural integrado en la ejecución, no separado de ella.

Hoy con herramientas de IA el proceso es aún más directo. La brecha entre la idea y el prototipo funcional se redujo a minutos.

¿Y en ese mundo, qué queda del diseñador que aprendió a entregar wireframes como evidencia de proceso pero nunca aprendió a resolver pantallas? ¿Del que sabe presentar un journey map pero no sabe qué hacer cuando el padding está mal y el usuario no entiende qué es accionable?

Lo que se perdió es una generación de diseñadores que podría haber aprendido el oficio y en cambio aprendió a justificarlo.

El costo regional

El impacto en Latam es específico y visible. Tenemos menos buenos diseñadores UI per cápita que otras regiones, y parte de la razón es que los que muestran talento natural para la ejecución visual son sistemáticamente dirigidos hacia "algo más importante".

Los mejores crafters de interfaz que conozco en la región llegaron ahí a pesar del sistema, no gracias a él. Se resistieron al mensaje de que diseñar bien pantallas era insuficiente, o lo aprendieron por su cuenta fuera de los canales formales.

Mientras tanto, el mercado global premia exactamente eso: a quienes saben hacer cosas extraordinariamente bien. Las posiciones más codiciadas en los mejores equipos del mundo no buscan "pensadores estratégicos". Buscan diseñadores que puedan tomar decisiones de diseño complejas y ejecutarlas con precisión.

El software personal como contraargumento vivo

Amo la era de las mini apps: casos de uso sencillos que necesitas en veinte minutos para resolver un problema real. Una UI bien hecha para agilizar agentes y prompts da mil veces más que copy-paste constante en cajitas de texto.

El software se está volviendo más personal que nunca. Ya no es un producto que una empresa diseña para millones: es una herramienta que alguien construye para su contexto específico, para su pareja, para su equipo de cinco personas.

En ese mundo, el diseñador que puede construir cosas —no solo hablar de ellas— tiene un valor que ningún framework de pensamiento estratégico puede reemplazar.

TLDR — No hay nada malo en querer diseñar pantallas. Hay algo muy malo en haberle convencido a una generación de que sí lo había.

Fuentes originales

Las interfaces no van a desaparecer con la IA

Thu, 17 Apr 2025 00:00:00 GMT

Originalmente publicado como serie de tweets en X/Twitter. Abril–Noviembre 2025.

Estoy harto de la campaña de desprestigio de parte de la industria "UX" contra el diseño de interfaz simplemente porque ignoran —o devalúan intencionalmente— el significado de interfaz.

Una interfaz es nuestro puente de comunicación con las computadoras. Así de sencillo.

¿Qué es exactamente una interfaz?

Puede ser visual, auditiva, textual, táctil. Siempre que haya una capa entre un ser humano y una máquina, hay una interfaz. No es un pixel ni un botón ni una pantalla: es el concepto completo de cómo nos relacionamos con los sistemas que hemos creado.

Por eso el argumento de "las interfaces van a desaparecer con la IA" no solo es incorrecto, es una confusión de categorías. Lo que va a cambiar es el paradigma —de interfaces visuales a interfaces conversacionales, gestuales, ambientales— pero el puente entre humano y máquina nunca desaparece. Solo se transforma.

La voz es una interfaz. El chat con un LLM es una interfaz. La pantalla del Pixel Watch en tu muñeca es una interfaz. El HUD de un coche autónomo es una interfaz. Seguirán existiendo mientras existan computadoras.

La devaluación interesada

Es muy curiosa la superioridad moral con la que algunos se rigen para decidir quién es valioso y quién no en esta industria, a partir de devaluar conceptos con los que no se identifican, como si realmente no existieran argumentos para seguir glorificando la supuesta "evolución" de la disciplina.

Decir que "el diseño de interfaz va a desaparecer" es cómodo si llevas años argumentando que deberías dedicarte a la estrategia y no a la pantalla. Es un relato que justifica una posición, no una observación honesta de hacia dónde va la tecnología.

Los que saben hacer, ganan en la era del software bajo demanda

Paradójicamente, cuanto más democratizada está la generación de software, más valioso se vuelve quien sabe diseñarlo bien.

Cuando cualquier persona puede pedirle a un modelo de IA que construya una app en veinte minutos, la diferencia entre un producto mediocre y uno extraordinario no la hace la velocidad de generación: la hace el criterio de diseño de quien dirige el proceso.

Los diseñadores con ojo —los que entienden tipografía, jerarquía, comportamiento, flujo, plataforma— son los verdaderos diferenciadores en la era del software bajo demanda. No los que saben hablar de estrategia en una reunión. Los que saben qué hacer con la pantalla.

El proceso como falso ídolo

Hay una cita que resume bien el otro lado de este debate, de alguien que ha visto de cerca cómo se hace gran trabajo:

"The way I've seen great work made isn't using any sort of design process. It's skipping steps when we deem them unnecessary."

El proceso existe para servir al resultado, no al revés. Y la obsesión de una parte de la industria con defender el proceso —los entregables, los frameworks, los diagramas— como evidencia de valor profesional, es exactamente el síntoma del problema.

El gran trabajo no nace de seguir pasos. Nace de entender profundamente el problema y tomar decisiones. A veces eso requiere un proceso complejo. A veces requiere abrir Figma y resolver.

El futuro no es menos diseño. Es diseño diferente.

Las interfaces van a mutar. Ya están mutando. El chat de texto, la voz, los gestos en el aire, las superficies físicas inteligentes: todas son interfaces que alguien tiene que diseñar bien.

Y "diseñar bien" una interfaz conversacional requiere exactamente los mismos principios fundamentales que diseñar bien una pantalla: claridad, flujo, feedback, expectativas cumplidas, momentos de deleite. Cambia el medio, no la disciplina.

El diseñador de interfaces no está desapareciendo. Está evolucionando. Como siempre lo ha hecho.

TLDR — Las interfaces no van a desaparecer. Se van a multiplicar, a mutar, a aparecer en lugares donde hoy no las vemos. Y alguien las va a tener que diseñar bien.

Fuentes originales

La UI no tiene que ser aburrida

Wed, 15 Jan 2025 00:00:00 GMT

Originalmente publicado en LinkedIn. Enero–Marzo 2025.

Por años se vendió una cortina de humo: que el diseñador debía "pensar estratégicamente", pero sin ejecutar nada, porque eso de "mover píxeles" no era suficientemente sofisticado para sus intereses. El resultado está a la vista: una industria con muchos estrategas y muy poco diseño que valga la pena mirar.

Lo que se perdió en el camino

Hay algo que me ha causado curiosidad durante años. En cada producto que reviso encuentro la misma firma: interfaces que funcionan, pero que no dicen nada. Productos que cumplen su propósito, pero que no tienen presencia. Diseño que podría haber salido de una plantilla.

No porque los equipos no sean capaces. Sino porque en algún momento del camino, la industria les convenció de que la calidad visual era accesoria. Que lo que importaba era el flujo, el research, el proceso. Que preocuparse por los detalles de la interfaz era, de alguna manera, cosa de vanidosos.

Y mientras eso pasaba, los usuarios seguían llegando a productos insípidos con los que nunca terminaban de conectar.

La usabilidad y la belleza no son enemigas

Hay una idea que se repite tanto que ya la damos por cierta: que la usabilidad y el diseño visual están en tensión. Que hacer algo bonito implica sacrificar funcionalidad. Que si le metes personalidad a una interfaz, la estarás complicando.

Eso es falso. Y la evidencia está en los productos que realmente admiramos.

Las mejores interfaces no solo son funcionales — son memorables. Tienen una voz. Una personalidad. Un detalle de animación que hace que completar una tarea se sienta bien. Una tipografía que comunica antes de que el usuario lea una sola palabra. Un estado vacío que en lugar de desaparecer, invita.

La mano del diseñador debería verse. Eso no es vanidad — es oficio.

La apuesta por el craft

En Shortcut tomamos una decisión desde el principio: especializarnos en interfaz. No como un capricho estético, sino porque vimos la brecha. Porque lanzar decenas de productos nos enseñó que la diferencia entre algo que la gente usa y algo que la gente quiere usar casi siempre vive en los detalles de la interfaz.

Eso no significa ignorar el contexto, el negocio o el usuario. Significa traer toda esa comprensión a la pantalla. Decisiones tomadas a base de conocimiento y experiencia, pero expresadas con criterio visual. No diseño que complace — diseño que propone.

La generalización nos dio riqueza de perspectiva. La especialización nos permite llevarla hasta el último píxel.

El gap que se está abriendo

Con la llegada de las herramientas de IA al proceso de diseño, esto se está volviendo más urgente, no menos.

Los diseñadores que siempre supieron ejecutar ahora ejecutan mucho más rápido. Los que construyeron su ojo, su criterio, su sensibilidad — esos están encontrando en las nuevas herramientas un multiplicador enorme. No solo hacen más: hacen mejor.

El gap entre quien tiene ese criterio y quien no, se está abriendo. Y la interfaz es donde eso se nota primero.

La UI no tiene que ser aburrida. Nunca tuvo que serlo.

TLDR — Una buena interfaz no solo resuelve un problema. Te hace sentir algo mientras lo resuelve.

Fuentes originales

UI for AI: The Series

Wed, 31 Jan 2024 00:00:00 GMT

How do we design effective user interfaces for Artificial Intelligence? The answer lies beyond traditional text inputs and chatbots. While conversational UI dominated the initial Generative AI era, modern AI products require specialized interaction patterns—like predictive suggestions, multimodal inputs, and contextual copilots—that drastically reduce user friction. According to research from the Nielsen Norman Group, poorly designed AI interfaces can increase user frustration by up to 50%, highlighting the critical need for intuitive, intent-driven design in AI applications.

As a designer, I’ve always learned by observing, fascinated by patterns, and then reproducing them in order to expand ideas or create new ones. As digital product pioneer John Maeda notes, "design is the solution to making technology accessible." This rings especially true in the age of generative models.

So for these series of articles that I've been waiting to write for the last 6 months, I took a trip through the most compelling AI products out there and wrote down everything I learned from them, exploring mostly the main use cases and how pioneering designers are solving problems with new interaction patterns.

This series could serve as a guide for people not familiar to AI that already want to design new digital products with a AI first mindset.

Note: I focused on products I know well, rather than researching a larger pool with a little help from There’s An AI for That and Product Hunt. If you have any other suggestion to add to the list, please, reach out to me or just leave a comment at the end of the article.

Updates on the series

January 31st, 2024

This first post will serve as an introduction to the nine originally planned parts. Part 1 will become available soon, as I’m finalizing last details before publishing. Possible new parts will be updated here as well.

Index

Here are the topics we will cover on each article of the series.

Each part (except the first one) will be focused on a particular use case of AI and how design is leveraging each one of this products for real users.

Part 1: The basics

Why AI is becoming so important for designers?
The current landscape
Interaction Models
Interaction Patterns
Interaction Cues

Part 2: Having good conversations

Not just good enough, way better chats with robots
The Know-It-Alls
Specialists in the matter
Dealing with prompting

Part 3: Looking for answers

The race to become the next Google
Better answers from the right sources

Part 4: Generating more than just words

Text-to-image
Text-to-video
Text-to-music
Text-to-more-text
Dealing (again) with prompting

Part 5: Modifying reality

Expanding horizons for current images
Final touches from AI artists

Part 6: Processing a bunch of data

Researching with a little help
Getting insights
Copiloting

Part 7: Designing together

Dreaming interfaces
Designing for me
Being my peer
Could AI be able to create an interface for specific purposes?

Part 8: Augmenting what we already have

Analyzing and providing a summary
Giving suggestions
Improving current media

Part 9: The Rabbit in the room

Old sharks in the tank
New Kids on the Block
What about the left behinds?

El diseño de 37signals: rompiendo las reglas que todos siguen

Thu, 04 Jan 2024 00:00:00 GMT

Originalmente publicado como notas en X/Twitter. Enero 2024.

El diseño alrededor de 37signals da siempre taaanto de qué hablar.

He leído sobre "ser obvios sin ser elegantes", pero no podemos llamarlo juguetón y ni de cerca "diseñado por ingenieros". Amo cómo extrapolan ideas fuera de la caja, las exprimen y se dejan llevar.

Lo que rompen

Esto probablemente rompe muchísimas cosas que conocemos tanto a nivel comprensión del usuario como a nivel visual. Muchos diseñadores lo descartarían tanto por ser completamente ajeno a las llamadas "leyes del UX" como por ser muy poco atractivo a nivel visual.

Y ahí está lo interesante: a nivel político no estoy de acuerdo con estos tipos, pero lo que hacen me parece siempre genial.

El caso de HEY Calendar

Llevo usando HEY Calendar desde que lanzaron y sí está muy bueno. Pero como siempre con 37signals, todo modelo mental existente se rompe y hay que reaprender o soltar.

En este caso, por ahora no se lleva bien con calendarios externos, ni siquiera con correos con archivos ICS. Se puede sincronizar, peeeero a veces falla, incluso en los correos.

Es el precio que pagas por usar sus productos: obtienes una visión fresca y diferente, pero tienes que aceptar que el mundo exterior no siempre es compatible con esa visión.

La lección

Lo que más respeto de 37signals es que no piden permiso. No hacen focus groups para validar si su idea es buena. No siguen las "mejores prácticas" de la industria porque creen —con razón muchas veces— que esas prácticas se han convertido en dogma.

Diseñan desde la convicción, no desde el consenso. Y aunque eso produce productos que no son para todos, los que los usan suelen ser devotos.

Hay algo liberador en ver a un equipo de diseño que dice "las reglas de UX son sugerencias, no leyes" y luego demuestra que tienen razón.

TLDR — No tienes que estar de acuerdo con alguien para aprender de ellos. A veces los mejores maestros son los que hacen exactamente lo contrario de lo que te enseñaron.

Fuentes originales

I was skeptical, but now AI believe

Fri, 01 Dec 2023 00:00:00 GMT

Why do many tech professionals initially dismiss Generative AI before fully adopting it? For me, the transition from skepticism to adoption was driven by separating hype from actual compounding utility. Initial adoption curves for disruptive technologies often follow a predictable "trough of disillusionment" (Gartner), where buzzwords overshadow real applications (Gartner, 2023). I fell right into that trap. I don't think this tweet has aged well for me.

There were some things that I considered when adding "AI" as part of the "dummy/deceitful trend", but I'm pretty sure part of the skepticism was a little bit of fear. Did I just saw a trend in raise with no clear future? Was I just angry at my previous job and therefore just spitting negativity?

As computer scientist Andrew Ng often points out, "AI is the new electricity—it will transform every major industry." It is now December of the same year, just barely 5 months later and my thoughts on AI have completely changed. I've already made the leap of faith.

From trend to reality

First thing first, lets address my Google bias. I've been following AI progress from Google for a long time, including adding AI into the Pixel phones, their wins with Alpha-Go against humans or their applications of AI in science.

Actually, one of the first things I remember regarding AI, were the dreams that were initially shared by Google Research. I remember thinking immediately "do robots dream of electric sheep?". Now it is clear that LLMs are just dream machines.

But then, my reactions to others doing the same was being skeptical. How did they get into it faster than the ones that have been doing it for years? Well, it turns out, I was trapped in my own echo chamber.

The AI Wars was something that has been cooking for a long time now. And in some ways I wasn't late to it, but in others I was behind the trend.

In the last 5 months, I took a race to update myself and surf the trend again. A lot in the AI field has already changed, including the things that I'm reading about it. Here I share my highlights:

Google finally started stepping up in the AI battle with OpenAI, first by launching and improving Bard, and then by unveiling Gemini. I know they have lost the initial battle on marketing AI to the masses, but I've been following Google Brain and Deepmind for a while now, and I really love the way they made progress in the past. I won't stop seeing them as pioneers in the field applied to actual use cases.
The Browser Company launched some really good features for Arc (my default browser) with Arc Max. What I love about them is the way they are using AI to provide value to users, they found good use cases to apply AI when actually browsing the web.
OpenAI had their own drama leading to conspiracy theories around finding AGI internally. For me, it was more a political move, but it gave me enough context to understand better things outside the Google bubble. Including a list of companies some OpenAI employees would prefer to go rather than Microsoft.
Some companies like Semplice (that I respect a lot), made an statement regarding avoiding using AI as part of their product. A statement that I totally agree with. Not all the companies or products should or need any random AI feature. We are still exploring frontiers, and it will take a while until we arrive into the right place.
I've got some interesting interactions with AI, first within my new Pixel 8 Pro (the first phone to get Gemini Nano). I was really impressed by Magic Editor, and how it is sooo close to what Adobe did with Generative Fill on Photoshop with even less power.
And then by trying Pi by Inflection, a type of AI designed to be kind and helpful, one that I used for extending my conversations with my therapist. It is as weird, as helpful as it sounds.

Some extra content worth nothing

Even before I changed my mind, I was already consuming content related to AI. Not only this content helped me understand better how the technology works, but also how to use it on my own day to day and by extension applying into the products I design for.

The Deepmind Podcast with Hanna Fry. A great podcast with just 2 seasons that talks about the history and achievements of Deepmind. It gets into the basics of AI.
Is AI the end of photography as we know it?. Becka for The Verge. A great recent video on how creating pictures through AI could be a form of art on itself.
People + AI Guidebook. A great source for designers to start when trying to get into designing AI for people.

Some thoughts around Conversational UI

After all this months of re-learning, I read again my own tweets. It turns out, I'm against chat bots, not AI per se. This is a larger conversation that I would like to address in another post but basically, for me conversational interfaces shouldn't be the only way to interact with this new type of machines. But it means we are still in the beginnings of exploring how to interact with LLMs and for now (even with multi-modal) prompting will remain as the main communication with them.

Taking Shortcuts

Last, but not least, the thing that finally drove me towards AI was my own company. When we started working on it, 4 months ago, I was already switching my thoughts, but actually working with AI and applying it, was the last thing I needed to believe in this massive and (now for me) exciting technology.

In some way, I'm still a skeptical, but definitely not in the same way.

"Are we really aware that moving fast with AI could become very dangerous?

Researchers have been warning about this for years and yet we like to see people like Sama go all on it.

On a business level it is great, but what about other consequences?"

Pixel 8 Pro: primeras impresiones viniendo de un Pixel 6 Pro

Thu, 09 Nov 2023 00:00:00 GMT

Originalmente publicado como nota en X/Twitter. Noviembre 2023.

Gracias a una sorpresa inesperada, conseguí el Pixel 8 Pro. Y viniendo de un Pixel 6 Pro —que fue mi compañero de dos años— las diferencias son más grandes de lo que esperaba.

El hardware: por fin se siente premium

Lo primero que noté fue el salto de calidad. Es un poco más pesado, lo que lo hace sentir más sólido y a la par de otras gamas altas. Es impresionante la diferencia; tanto, que el 6 Pro ahora parece de juguete.

Los haptics son una chulada. Ese feedback táctil que antes era decente, ahora se siente refinado. Son de esos detalles que no sabes que necesitas hasta que los tienes.

La funda oficial me sorprendió. Esperaba mucho menos y es una funda muy sólida. Viniendo del asco de fundas que dieron para el 6 y lo bonitas que eran para el 3 y el 4, estas son mejores. Aunque, siendo honesto, amo mi Pixel sin carcasa. Es hermoso.

Las rarezas del software

La resolución por defecto viene en HD y no en Full HD, lo cual es rarooo. Por defecto también viene todo muy pequeño. Lo dejé así para probar pero sí es extraño para un teléfono que presume su pantalla.

Me está tocando vivir el bug de janky scroll y tengo unas ganas inmensas de pasarme a beta porque creo que ahí ya lo arreglaron. Hasta ahora solo me ha aparecido en casos aislados, pero cuando aparece, duele.

La cámara: donde todo brilla

La cámara, como siempre con los Pixels, es impresionante. Pero sobre todo las nuevas funcionalidades en Google Photos son las que se llevan el show.

Me puse a jugar con fotos viejas y el Magic Editor hace maravillas. La funcionalidad de borrar audios en video y cambiar caras en fotos grupales son mucho más divertidas de lo que esperaba. No son gimmicks —son cosas que realmente usas.

El modo Pro de la cámara me dejó congelar gotas en el aire ajustando la velocidad de obturación, y fue hermoso hacerlo desde la app principal de la cámara. Nada de apps de terceros ni configuraciones complicadas.

Tomar fotos con todos los modos Pro —RAW, 50MP y lente manual— tarda más en tomar la foto (unos 2 segundos), pero sale cada chulada que vale la pena la espera.

El veredicto

El Pixel 8 Pro con 7 años de actualizaciones garantizadas es una propuesta que no existía antes en Android. Google finalmente tiene un teléfono que se siente a la altura de su software, y el pipeline de cámara sigue siendo, en mi opinión, el mejor de la industria.

Ahora solo falta que llegue oficialmente a México. Seguimos esperando.

TLDR — Los Pixels siempre han sido teléfonos de software. Con el 8 Pro, por primera vez el hardware está a la misma altura.

Fuentes originales

Google Pixel 8: El evento donde Google entró en serio al juego

Wed, 04 Oct 2023 00:00:00 GMT

Notas del evento Made by Google 2023. Octubre 2023. Japón se convirtió en uno de los mejores mercados del Pixel en el último año, y creo que por eso Google hizo el evento así de temprano. El horario favorecía a la audiencia japonesa. Los detalles importan, hasta en la hora del livestream.

La fórmula de Google Hardware

Rick Osterloh lo dijo desde el principio y sin rodeos: la cámara del Pixel ha movido la industria, incluyendo al todopoderoso Apple. La fórmula que impulsa a los Pixel sigue siendo la misma:

Hardware + AI + Software

Y este evento fue la demostración más contundente hasta ahora de qué significa eso en la práctica.

Lo que llegó antes del Pixel 8

Antes de entrar al nuevo hardware, Google anunció actualizaciones de software para dispositivos existentes:

Pixel Buds Pro: mejoras de software.
Pixel Fold: actualizaciones.
Google Home: integración de un asistente AI. Inesperado y prometedor.

El Pixel Watch 2 se ve muy bien. Agregaron varios sensores nuevos y se siente más el toque Fitbit en esta iteración, algo que tenía mucho sentido después de la adquisición.

Las cámaras del Pixel 8 Pro: el argumento principal

Este fue el protagonista absoluto del evento. Las novedades en cámara del Pixel 8 Pro son las más significativas en años:

Nuevo sensor principal con mayor superficie de captura
Autofocus en la cámara frontal, como en el Pixel 3 (bienvenido de vuelta)
Pro Controls: por fin controles manuales para los que queremos más control sobre la exposición
Opción de 50MP para todos los zooms

Best Take y Magic Editor

Best Take es la funcionalidad de la que venía hablando tiempo atrás: te permite cambiar las caras de una foto de grupo con tomas alternas tomadas en la misma sesión. Mi esposa hace fotografía profesional y estaba realmente impresionada.

Magic Editor complementa esto con edición generativa más avanzada: mover objetos, cambiar fondos, eliminar distracciones.

Audio Magic Eraser

Quitaron los ladridos de un video de demo. Así de simple. El procesamiento de audio en los Pixels ahora tiene el mismo nivel de sofisticación que el procesamiento de imagen.

Video Boost

Compararon un video del iPhone 15 Pro Max con el Pixel 8 Pro usando Video Boost. Honestamente, esa comparación no me la creo todavía. Hay que verlo en condiciones reales, no en una demo controlada.

Assistant with Bard: el salto de los LLMs al teléfono

Van a anunciar cambios en Google Assistant usando LLMs a toda potencia. Bard ahora alimenta al Google Assistant: Assistant with Bard.

La promesa: Hear, speak, see and take action. Básicamente es Bard en app, combinado con la información que quieras darle de tu teléfono. Un poco de Google Assistant, un poco de Google Lens, todo junto.

El anuncio que más importa: 7 años de actualizaciones

Rick tiró la bomba al final: 7 años de actualizaciones de sistema operativo para el Pixel 8.

Esto es gigante. Históricamente los teléfonos Android recibían 2-3 años de actualizaciones. Google está diciendo que el Pixel 8 estará soportado hasta 2030. Es un movimiento que presiona a toda la industria Android y hace la conversación de "¿Android o iPhone?" mucho más interesante.

Mi lectura del evento

El Pixel 8 Pro se lleva todo de calle. Es el primer dispositivo en tener acceso a todo lo que viene de Google en IA, y con 7 años de soporte se convierte en una propuesta de valor difícil de ignorar.

El precio duele: $999 USD para el Pixel 8 Pro. Pero lo que tienes a cambio es el hardware de Android más sofisticado, con el mejor pipeline de cámaras y la garantía de actualizaciones más larga de la industria.

Ahora necesitan expandirse al resto del mundo. México sigue esperando.

TLDR — Todo se filtró antes del evento, como pasó con Apple. La era de las grandes sorpresas en hardware parece definitivamente terminada.

Fuentes originales

Hilo en vivo del Made by Google 2023 en X/Twitter (octubre 2023)

Once a frog, always a frog

Thu, 14 Sep 2023 00:00:00 GMT

Originalmente publicado en LinkedIn. Septiembre 2023.

Es extraño decirlo porque nunca me había despedido de una compañía. Pero hoy era mi último día siendo una rana en frog, y sentía que me lo debía a mí mismo.

El segundo trabajo que no sabía que era mi segundo trabajo

A casi cuatro años de haberme unido como parte de la expansión de frog a Latinoamérica, caí en cuenta de algo que no había procesado del todo: frog fue, en todos los sentidos reales de la palabra, mi segundo trabajo como diseñador.

No lo sentí así al principio. Las similitudes culturales entre 23 y frog —el cariño al craft, la obsesión por el detalle, la gente— hacían que el salto se sintiera más fluido de lo que era. Pero con el tiempo, al notar las diferencias en magnitud, en los procesos más sólidos, en la escala de los problemas, entendí que había estado aprendiendo en una liga diferente.

frog me bajó de la nube en la que pensaba que volaba. Pero lo hizo justo lo suficiente para poner los pies en la tierra y seguir con más claridad.

De 50 productos a 5 — y por qué eso cambió todo

Con 23 lancé más de 50 productos en cinco años. Con frog lancé cinco en tres. En papel, suena a menos. En realidad, fue todo lo contrario.

Cada uno de esos cinco proyectos tuvo el tiempo y el cariño que los anteriores, por la velocidad del estudio, a veces no podían tener. También tuvieron capas de stakeholders y burocracia con las que nunca me había enfrentado. Instancias donde navegaba sin saber del todo lo que estaba haciendo, pero aprendiendo a confiar en el proceso —y en mí mismo— para salir adelante.

A veces tocó imaginar el futuro de las PCs. Otras, repensar de cero un programa de lealtad para gen-Z. O construir desde cero una librería de componentes lo suficientemente robusta para sobrevivir sin un design system detrás que la sostuviera.

La única constante en todo este tiempo, y que seguirá siendo parte de mi ADN como diseñador: lanzar productos al mundo real. Siempre.

Las personas que se quedan contigo

Lo que más valoro de frog no son los proyectos. Son las personas.

Diseñadores en su mayoría a los que admiraré siempre. Pero sobre todo personas con las que disfruté trabajar aún estando lejos, viéndonos por cámaras, separados por husos horarios. Personas que en el caos global de la pandemia encontraron la manera de mantenerse presentes.

Y managers que, más de una vez, pasaron a ser mentores. Los que me ayudaron a encarrilarme en mi propio camino cuando yo mismo no sabía hacia dónde ir. Los que me señalaron mis puntos ciegos sin hacerme sentir pequeño.

Eso no se aprende en ningún curso. Eso se vive.

El trampolín

En mis primeros días en el charco me tocó visitar a otras ranas en Austin — justo unos días antes de que la pandemia cerrara todo. Recuerdo bien lo que escuché de uno de ellos:

"frog es un gran trampolín para darle forma a tu carrera, aprovéchalo como tal."

En ese momento lo anoté mentalmente. Hoy, al salir, entiendo exactamente lo que quiso decir.

frog me dio perspectiva. Me mostró que el diseño a escala global tiene batallas que no te imaginas desde un estudio boutique. Me enseñó a sortear la burocracia sin perder la visión. Me rodeó de personas que me empujaron hacia adelante.

Lo que viene ahora es aprovechar el salto: regresar al vuelo con rumbo a lo desconocido. No tengo más que agradecimiento por lo pasado y emoción por lo que se viene.

Once a frog, always a frog. 🐸

Fuentes originales

Mi último día en frog design (septiembre 2023)

Mi camino en diseño: 10 años de evolución

Sat, 09 Sep 2023 00:00:00 GMT

Originalmente publicado como serie de tweets en X/Twitter. 2021–2024.

Hace 10 años comencé a probar fortuna en el diseño de interfaces. Meses después conseguí mi primer freelance. Año y medio después me invitaron al estudio de diseño de mis sueños. Todo porque sabía que las apps en Android podían ser más bonitas.

Gracias a Roman Nurik y a Crafty por mostrarme el camino del Android Design en aquel entonces. Aprendí un chingo observando, probando, rompiendo.

El debut en la Ciudad de México

Era 2015. Con 20 kilos menos y un par de abrigos para el frío, un tabasqueño de 23 años decidía ser parte de un estudio de diseño recién parido: 23design.

Llegué acogido por Lulo y entrenado por Fabs; algo así como mis Qui-Gon y Obi-Wan del diseño. Llegué sabiendo muy poco de la vida, asistiendo a mi primer concierto, teniendo mis primeras pedas serias.

Conocí personas como nunca en mi vida, en una cantidad de tiempo muy pequeña. El rush del primer año fue único. Diseñar apps simultáneamente —entre ellas Bridgefy—, maquetar sitios, hacer uno de los primeros Design Sprints en México con un cliente de Sudamérica.

De estudio local a estudio global

La evolución fue gradual pero intensa. De unirme a un estudio que creció conmigo, pasé por enfrentar mis miedos en un estudio global.

Cuando 23design fue adquirido por frog design como parte de su expansión a Latinoamérica, todo cambió. A casi 4 años de esa unión, frog fue el lugar donde más crecí profesionalmente. Donde aprendí que el diseño a escala global tiene batallas que ni te imaginas desde un estudio boutique.

Es extraño despedirse de una compañía cuando nunca lo habías hecho antes. Pero mi último día como rana fue también el primer día de lo que venía.

Fundar lo propio

Y entonces llegó el momento: fundar nuestro propio estudio con todos los aprendizajes que estos años nos dieron. Oficialmente evolucioné a Charizard con Shortcut.

Dato curioso: el nuevo sitio con todo y nuevo branding lo armamos en un solo día. La velocidad cuando sabes lo que quieres es otra cosa.

Lo que aprendí en el camino

¿No les pasó que vivían su vida bien rápida, como si tuvieran prisa de algo, y la pandemia llegó y les dijo "tranquilo carnal, que esto no es carrera" y ahora viven más relajados y con menos estrés?

A mí me pasó. Y creo que esa pausa fue lo que necesitaba para entender que una carrera en diseño no es una línea recta ascendente. Es un camino con curvas, retrocesos y saltos inesperados.

Tuve que escoger entre más de 50 proyectos desde 2015 para mi CV. Llegamos a hacer hasta 12 proyectos simultáneos en algunos momentos. La cantidad de trabajo fue brutal, pero cada proyecto dejó algo.

El privilegio que no hay que ignorar

Es triste recordarle a los colegas que tenemos el privilegio de trabajar en una industria que le va bien económicamente y que eso genera un sesgo en nuestra forma de ver el mundo.

Privilegios de los que soy consciente: soy un hombre blanco heterosexual, prácticamente no sufro discriminación. Trabajo en tech, una industria que paga bien. Tuve acceso a educación y mentores. No se trata de sentirse mal por tenerlos, sino de ser consciente de cómo moldean tu perspectiva.

TLDR — Hace 10 años no sabía nada. Hoy sé que no sé casi nada. Pero al menos sé hacer cosas bonitas que funcionan.

Fuentes originales

Material You no es para todos

Fri, 08 Sep 2023 00:00:00 GMT

Originalmente publicado como nota en X/Twitter. Septiembre–Octubre 2023.

Material You no es para todos. Y está bien que así sea.

MY está destinado a ser un modelo para desarrolladores independientes sin marcas definidas. Si eres un indie dev haciendo tu primera app, Material You te da un sistema de diseño completo, coherente y gratuito. Eso es increíblemente valioso.

Pero si tienes una marca, la cosa cambia.

El caso de WhatsApp: el punto medio

Hay un punto medio y es lo que está haciendo WhatsApp: adopta componentes nativos de M3 sin usar color themes.

La razón es sencilla: existe una marca —paleta de colores, logo— que no es negociable modificar, pero hay otras cosas que sí. WhatsApp ha tenido siempre la estrategia de hacerse pasar por una aplicación de mensajería que es parte del sistema en ambos sistemas operativos. Eso significa que les conviene verse nativos en la estructura, pero mantener su identidad en el color y la marca.

Es un equilibrio inteligente que muchas apps deberían considerar.

No sacrifiques tu marca por ser "nativo"

Así que si crees que tu aplicación necesita adaptarse completamente a Material You, piénsalo dos veces para no afectar tu marca.

Recuerda también que puede ser un tema u opciones configurables para el usuario. Puedes ofrecer lo mejor de ambos mundos: un modo que respete los colores dinámicos del sistema para quien lo quiera, y tu identidad visual por defecto.

El respeto por las plataformas

Dicho esto, cuando los desarrolladores sí toman en serio el diseño para cada plataforma, se nota. Y se agradece.

Las apps bien diseñadas y bien desarrolladas para Android de forma nativa merecen todo el respeto. En un mundo donde la mayoría de los equipos diseñan primero (y a veces únicamente) para iOS, los que se toman el tiempo de crear experiencias nativas para Android están haciendo un trabajo que pocos valoran como se debe.

TLDR — Material You es una herramienta poderosa, pero como toda herramienta, hay que saber cuándo usarla y cuándo no.

Fuentes originales

Por qué tu producto necesita un Changelog

Fri, 08 Sep 2023 00:00:00 GMT

Originalmente publicado como notas en X/Twitter. Septiembre 2023.

¿Por qué tener un sitio con registro de cambios del producto? Es una de esas preguntas que parece obvia pero que la mayoría de los productos ignoran.

Las razones

Facilitas el descubrimiento de funcionalidades que pueden quedar escondidas. Cada release tiene cosas nuevas que tus usuarios podrían no encontrar solos. Un changelog es como un mapa del tesoro actualizado.

Generas presencia, sensación de que el producto no está muerto y sigue creciendo. No hay nada peor que usar un producto y sentir que nadie está al volante. Un changelog activo dice: "Estamos aquí, estamos trabajando."

Queda un registro de la evolución del producto. Los usuarios pueden saber si necesitan actualizar en caso de que no suceda automáticamente. Es historia viva de tu producto.

Si lo unes a un roadmap con opción a sugerencias, tus usuarios se sentirán escuchados. La combinación changelog + roadmap público es poderosa. Le das voz al usuario y visibilidad de hacia dónde vas.

Mis favoritos

Los mejores changelogs que he visto:

Photomator — Limpio, visual, con cada actualización bien explicada.

CleanShot — Directo, sin pretensiones, pero con la información que necesitas.

Raycast — Probablemente el mejor changelog que existe. Detallado, con contexto, y con una comunidad que realmente lo lee.

Y por supuesto lo que hace Figma — Que ha convertido su changelog casi en un evento cada vez que hay actualizaciones mayores.

Empty states: el primo hermano del changelog

Hablando de descubrimiento, otro elemento que la mayoría de los productos ignora son los empty states —o como he escuchado en otros lugares: estado cero.

Los mejores empty states, además de darle claridad al usuario de lo que puede hacer, le invitan a realizar una acción. Puntos extras si la acción es parte de la misma sección o se aprovecha la oportunidad para enseñar una nueva funcionalidad al usuario.

El changelog y los empty states comparten la misma filosofía: no dejes al usuario solo. Guíalo. Muéstrale qué hay de nuevo y qué puede hacer.

¿En qué etapa está tu producto?

Para saber qué tan importante es un changelog para ti, ayuda entender en qué contexto está tu producto:

0 → 1: Empezando empezando, aún sin lanzar, pero en plena obra negra. Aquí un changelog interno es tu mejor amigo.

Early stage: Producto en sus primeras iteraciones, ya lanzado y buscando market fit. El changelog empieza a tener audiencia real.

Buscando escalabilidad: De varios meses o años, con un objetivo más acotado, base de usuarios fija. El changelog es parte de tu comunicación con el usuario.

Monstruo en descontrol: Base de usuarios que supera los cientos de miles, varios equipos dedicados. Aquí el changelog es institucional.

TLDR — Un producto sin changelog es como un restaurante sin menú actualizado. Puede que la comida esté buena, pero nadie sabe qué hay de nuevo.

Fuentes originales

UXers, diagramas de Venn y rectángulos

Tue, 08 Aug 2023 00:00:00 GMT

Es bien sabido en el mundo del diseño de productos digitales que la conversación sobre el término UX es casi que prohibida. La evitamos como conglomerado y dejamos pasar porque se torna repetitiva, sin sentido y muchas veces hasta aburrida, llegando al punto de tratarlo como si fuera hablar de religión o política en una reunión familiar.

Sin embargo, cada cierto tiempo surgen preguntas, posiciones o cuestionamientos que merecen la pena volver a revisar.

Este post es una respuesta un poco más larga a la que Twitter me permite dar (sin pagar Blue), y que realmente merece un acercamiento a la pregunta que hace Franzia.

La pregunta de Franzia también referencia la siguiente imagen que estuvo rondando redes sociales y que destapó muchas críticas, entre ellas, lo corto que se queda para explicar la disciplina, sobretodo para los iniciados.

Entre otras cosas, mi principal crítica a este tipo de gráficas que intentan crear un framework para explicar algo mucho más complejo, es que hace difuso el panorama completo, y peor aún, se vuelve forzoso en los detalles.

Solamente con observar los cuadrantes y sus actores se puede inferir algunos sesgos del creador: UX Researcher cubre todo el cuadrante UX Research, Business Analyst cubre todo el cuadrante de Analysis, Design Ops con Operations; casi todos los especialistas de cada cuadrante cubren su cuadro por completo, excepto uno: el Interaction Designer.

Y ustedes dirán "Omar, te lo estás tomando personal, esto no es contra los IxD", pero es que nomás de observar los espectros propuestos para UX Designer y Product Designer caigo en cuenta: es el clásico sesgo de que los diseñadores de interfaz o los de interacción solo son "pixel pushers", meros peones dentro de la maraña complicada de problemas que al parecer solo un UXer puede tejer.

La extraña idea de que estos roles no "tocan" el resto de los cuadrantes me parece siempre sorprendente porque habla de una total desinformación de la disciplina.

El caos

Pero volvamos a la pregunta inicial, empecemos con que es bastante complicado buscar una forma de simplificar o definir algo que sigue transformándose y encontrándose a sí mismo. La disciplina del diseño UX como lo conocemos aún no llega a su maduración, los más antiguos sitúan la disciplina en una línea de tiempo menor a 70 años.

Sabiendo esto podemos comenzar a hilar soluciones. Por la dificultad de explicar este tema con conceptos podemos hacerlo a partir de experiencias (no pun intended) propias o ajenas que ejemplifiquen lo que se intenta explicar.

La forma en como lo he hecho con mis alumnos y que mejor me ha dado resultado es partiendo de un contexto. Los equipos de diseño pueden llegar a ser multidisciplinarios y muy especializados, todo depende del problema que se quiera resolver en un tiempo determinado.

Esto puede llegar a ser caótico, pero aceptando el caos y dejándolo fluir es como he descubierto que se comprende mejor.

No es lo mismo una dupla que diseña una funcionalidad específica, a un equipo grande dedicado a sacar una aplicación completa; diseñar un sitio web con mucha información, a una aplicación con varias capas de navegación; diseñar para 10 millones de personas, a diseñar para 20 usuarios; diseñar para momentos de caos y estrés intenso, a diseñar una app para VR con el enfoque casi por completo de parte del usuario.

Lo importante de los escenarios y su variedad, es entender los diferentes tipos de problemas a los que un equipo de diseñadores se puede enfrentar (ver también AARRR).

Luego de especificar el escenario, toca explicar cómo funcionan los equipos a través de los roles. ¿Qué hace un diseñador de interacción con uno visual? ¿Cuál es el rol de un uxer en un equipo de producto? ¿Cómo deberían trabajar para lograr el objetivo propuesto? ¿Qué habilidades diferencian entre un diseñador visual y un arquitecto de información en los diferentes escenarios que pueden existir? ¿Cuántos diseñadores, investigadores, analistas necesitas para atacar el problema propuesto?

Es probable que un UX Designer (como la industria los hace llamar) con algunos de estos escenarios y roles se necesite sea más enfocado en crear artefactos que permitirá al resto del equipo construir una aplicación sólida y cimentada, o que en otra combinación de escenarios le toque ser un arquitecto de información, pero para otra combinación sea más cercano a un líder donde esté más cerca de las responsabilidades de un estratega que de un researcher, o quizá sólo quizá, en una de esas combinaciones le toque ser un simple pixel pusher.

Mostrar estos escenarios explicando las responsabilidades y jugando con las combinaciones puede llegar a ser muy didáctico. Personalmente he probado una presentación pequeña seguida de una actividad como un juego de roles, haciendo que la curiosidad de los participantes se agrande por las diferentes facetas que los diseñadores pueden llegar a vivir.

Al final, el mensaje principal es que no importan mucho los nombres de los roles, lo que importa es la combinación de habilidades que se pueden establecer en la creación de un equipo. Si los alumnes mantienen su mente abierta a esas posibilidades, habrán aprendido a lidiar con el caos que presenta una disciplina todavía joven, todavía en plena definición.

Diagrama de Venn

Ya para terminar, quería compartirles uno de los primeros diagramas que vi sobre la disciplina por allá del 2013, no sin antes resaltar sus críticas que aún siguen vigentes. Es un diagrama que probablemente ayude para introducir algunos conceptos, pero no para ahondar con tanta versatilidad que podemos encontrar en esta disciplina.

Espero que esta respuesta sea de ayuda para Franzia.

32.0: Escribir, compartir, preservar

Tue, 01 Aug 2023 00:00:00 GMT

Este post fue importado desde mi viejo newsletter

Aunque estoy a punto de abrir una nueva era para mí haciendo vlogging en YouTube y TikTok, he descubierto que en el proceso de creación se integra frecuentemente el escribir el contenido antes de transformarlo, que ha sido mi forma de compartir información en tiempos pasados, y del cual no me quiero alejar.

He escrito en blogs por muchos años, sobretodo cuando comencé en mi carrera como diseñador, montando y analizando las cosas que observo a mi alrededor. Luego, hice lo posible por compartir ese conocimiento. Primero en Blogger, luego en Medium, pasando por Tumblr. La idea siempre fue encontrar un punto de partida donde pudiera plasmar lo que sucede en mi cabeza, mis procesos de pensamiento y mis resultados finales.

Ahora con la evolución marcada que estamos viviendo en el mundo del micro-blogging (Twitter, Threads, Mastodon), buscar alternativas donde esas ideas queden escritas para la posteridad es esencial para mí.

Hace más de un año que encontré en Hey (para manejar mis correos) un excelente producto construido por 37signals que respeta mis modelos mentales a la hora de manejar mis correos. Es un producto que si bien su propuesta de valor ofrece cosas distintas a las que yo busco, encontré un pequeño pedazo en esa oferta que me terminó por convencer de pagar semejantes cantidades por software.

Esto no intenta ser un comercial del producto, pero me sorprende muchísimo lo fácil que hicieron crear un newsletter o blog (técnicamente podría tomarse como lo mismo, cof cof RSS), y lo bien que se integra en mi proceso de pensamiento. No me quiero preocupar por nada más que por escribir, y eso lo hicieron bastante bien.

Este espacio nace en los primeros días de mi cumpleaños número 32, espero y quiero pensar, una nueva era en mi vida en la que quisiera compartir de una forma diferente sobre mis pensamientos, mi forma de trabajo y las cosas que llego a observar en el día a día. Este será el espacio donde esas formas diferentes converjan con las formas más tradicionales.

Es probable que aquí encuentren fragmentos de los guiones, partes que fueron quitadas de algún video o bien, ensayos completos de un tema que no tiene cabida en esos espacios.

Yo escribiré, si me llegas a leer, siempre serás bienvenide.

Cómo sobrevivir a una Figma Config sin explotar

Wed, 21 Jun 2023 00:00:00 GMT

Guía práctica para procesar el aluvión de información del Config 2023. Junio 2023.

Para mis amigos que usan Figma y están teniendo una sobrecarga de información con todo lo que se presentó hoy: los entiendo. Config es uno de esos eventos que te deja con 47 pestañas abiertas, tres canales de Slack con actualizaciones y la sensación de que si no aprendes todo hoy, te vas a quedar atrás.

No te vas a quedar atrás. Respira. Acá van algunas recomendaciones simples para entender y decidir cómo atacar esa información.

Primero: ¿qué se presentó?

Se presentaron 4 temas grandes, en orden de tamaño e impacto:

Actualizaciones en Auto Layout — Este es el más pequeño y el más incremental. Si ya usas Auto Layout, lo vas a entender rápido.
Variables — El más importante y el que más cambia los flujos de trabajo.
Prototipado avanzado — Depende de entender Variables primero; no tiene mucho sentido antes.
Dev Mode — El cambio más visible para la relación diseño-desarrollo.

Mi recomendación: ir en ese orden.

Dónde aprender cada cosa

Hay 4 lugares donde pueden entender y explorar todo lo que se presentó:

Videos en YouTube (el canal oficial de Figma): buenos para el overview y para ver las demos en contexto.
Videos de las sesiones on-demand: más técnicos y profundos, mejores una vez que tienes el contexto básico.
Archivos playground en Figma: la forma más práctica de aprender haciendo, especialmente para Variables.
Help Center oficial de Figma: la documentación de referencia. Más seco pero completo.

Puedes hacer bookmark de todos estos links, pero lo importante es ir uno por uno.

El error más común: abrir todo al mismo tiempo

Evita a toda costa abrir muchas pestañas para no sobrecargar tu mente. La sensación de productividad que da tener 12 recursos abiertos es falsa; en realidad estás dividiendo tu atención entre 12 cosas y aprendiendo ninguna bien.

La recomendación concreta: escoge un tema y un tipo de contenido como punto de partida. Por ejemplo:

Empieza con Variables en el Help Center. Lee la documentación. Cuando tengas el modelo mental básico, abre el archivo playground de Figma y experimenta. Cuando ya sientas que lo entiendes, ve las sesiones on-demand, que ahora serán mucho más fáciles de seguir porque ya sabes de qué hablan.

El truco de combinar recursos

Una vez que tienes el modelo mental básico de un tema, hay una combinación que funciona muy bien: abrir los archivos de Figma y la documentación del Help Center lado a lado.

Lees una cosa, la intentas en el archivo, ves cómo funciona en la práctica, vuelves a leer. El aprendizaje se acelera significativamente cuando hay inmediatamente un lugar donde aplicar lo que acabas de leer.

Fuentes originales

Hilo sobre el Figma Config 2023 en X/Twitter (junio 2023)

Latinos en US: una subcultura que dejamos de entender

Wed, 14 Jun 2023 00:00:00 GMT

Reflexiones sobre identidad, migración y cultura. Junio 2023.

Tenemos que empezar a aceptar que desde hace varias décadas existe una subcultura de los que migraron a Estados Unidos, de la que no somos parte. Y la neta está bien. No tenemos que ser parte.

La cultura gringa es fuerte en medios

Hay muchas aristas en el tema, pero un punto importante es que la cultura estadounidense es muy poderosa en medios. Se apropiaron del nombre de un continente entero —se llaman "americanos" cuando América es todo el hemisferio. Y ahora están en proceso de apropiarse del término "latino."

Pero los menos culpables de eso son nuestros migrantes, que construyeron algo nuevo con lo que tenían.

Los primos que regresan de visita

Nomás chequen a los "primos" que regresan a visitar de vacaciones. Son completamente diferentes a nosotros. Hablan diferente, consumen diferente, entienden el mundo diferente.

Y está bien. Así es como funciona un mundo globalizado con culturas mezcladas. Además es un mix aún más complejo porque incluye personas de muchos países latinoamericanos distintos, todos mezclados en el mismo contexto estadounidense. Por eso luego nos encontramos con frases como "no manches, parce".

El problema de la representación

Todo eso no da para que un grupo de personas que no conocen la experiencia escriban sobre ella solo porque lo hacen "de corazón" con lo que "conocen" de lejos. La autenticidad importa, y cuando falta, se nota.

Pero también he leído críticas a representaciones de latinos en medios estadounidenses como si fueran una representación de los latinoamericanos que aún vivimos en nuestros países de origen. Y no lo son. Son una representación de los latinxs en US, que tienen una cultura ya de por sí diferente a la nuestra.

Esa distinción es importante.

El choque de verlo de cerca

Recuerdo la primera vez que fui a Austin. Estaba tan confundido por todo lo que vi: cosas que no tenían sentido que estuvieran juntas, versiones exageradas de culturas que yo conocía de otra manera, referencias mezcladas sin contexto.

Esa aversión a lo diferente es una reacción humana normal. Pero ya no deberíamos hacernos los indignados.

Lo que construyeron

Elles tomaron lo que tenían o recordaban después de haberse ido de sus países de origen buscando un mejor futuro, y con eso construyeron algo. Las siguientes generaciones se encargaron de hacerlo más grande, más definido, más suyo.

No es nuestra cultura. Pero tampoco es menos válida por serlo. Es simplemente otra.

El mundo globalizado produce exactamente esto: subculturas que evolucionan en paralelo, que comparten raíces pero se desarrollan de formas distintas. La pregunta no es cuál es la "correcta", sino cómo aprendemos a reconocer la diferencia sin juzgarla.

¿Tienes familiares o amigos que hayan migrado y sientas esa diferencia cuando los ves? ¿Cómo lo vives?

Fuentes originales

Hilo sobre latinos en US en X/Twitter (junio 2023)

Apple Vision Pro: entre el masterclass de ingeniería y las preguntas sin responder

Tue, 06 Jun 2023 00:00:00 GMT

Reflexiones del día después del evento de Apple. Junio 2023.

Los mejores análisis de un evento de Apple normalmente llegan al segundo día. Ya que el hype bajó, sin Apple llevando tanta narrativa, todo se vuelve más realista. Estos son los míos.

Lo que nadie quiere admitir

Estamos asumiendo que Apple no puede equivocarse, que siempre harán productos estrella, que el Vision Pro va a pegar. Puede que tengan razón. Pero también es cierto que aunque no pegue, tienen dinero de sobra para gastar en esto bastantes más años. El fracaso de primera generación no los mata.

El problema de los rectángulos flotantes

A nivel de interfaz me sorprende mucho que no haya nada nuevo más allá de rectángulos flotantes. Entiendo que puede ser ese elemento de familiaridad ante paradigmas nuevos —cuando introduces algo radical, anclarte a lo conocido reduce la fricción de adopción— pero también puede ser una señal de que no han resuelto el problema de interacción más profundo.

¿Cómo se ve realmente interactuar en un espacio tridimensional sin la metáfora del escritorio o la pantalla? No lo sabemos todavía.

Una sensación extraña sobre el futuro de la tecnología

Tengo sensaciones raras respecto a todas las cosas nuevas que la tecnología está proponiendo: desde la fallida web3, pasando por la mal nombrada "AI", hasta estas realidades mixtas. Es como si hubiéramos llegado a un tope computacional y creativo con lo que podemos hacer.

Lo que sí noto con claridad es que aún vemos un v0.5 que es mucho mejor que lo que otras compañías han mostrado, pero que está muy lejos de algo que realmente cambie nuestras vidas al nivel que lo hicieron la PC o el iPhone.

El futuro que yo quiero

Me niego a creer que el futuro de la tecnología es estar más rodeado de ella de una forma tan intrusiva. Yo mismo tengo problemas de uso con mis dispositivos actuales.

Me siento más cómodo con la idea de un futuro con dispositivos que se adaptan a nosotros y no al revés. Conceptos como Ambient Computing o Calm Technology son los verdaderos trends que deberíamos estar metiendo con calzador en nuestras vidas: tecnología no intrusiva, que responda a nuestros contextos naturalmente y en la que nuestra interacción sea lo menos desgastante posible.

El problema más grande que tenemos que arreglar es nuestra relación con la tecnología. Fueron dos años de wellbeing que solo agregaron gráficas a nuestros dispositivos —"llevas 4 horas en TikTok"— y de ahí vuelta a vender.

Los problemas que sí se pueden arreglar

El Vision Pro tiene muchos elementos de primera generación que no convencen: el cable externo de la batería, el precio, la autonomía, la cantidad de píxeles que se pueden ver con claridad. Esos son problemas de ingeniería que se resuelven iterando. Versión 3 o 4 probablemente ya no los tenga.

Los problemas que quizá no se pueden arreglar

Pero también hay elementos que podrían no mejorar incluso iterando:

El uncanny valley que provoca ver ojos simulados en una pantalla exterior.
La incomodidad de usarlo por periodos largos.
La interacción con más usuarios en el mismo espacio.
La naturaleza misma del dispositivo choca contra todo lo que intenta lograr.

Un headset que te aísla del mundo para darte más mundo. La contradicción es estructural.

Y hay otro problema que nadie menciona suficiente: las baterías. ¿Cómo es que no hemos podido mejorar en masa lo que las baterías pueden darnos de autonomía? Es lo que más nos limita. Cargamos energía como si fuéramos Link en Zelda, juntando baterías para avanzar.

Lo que sí reconozco

No me malentiendan. El Vision Pro es un masterclass de ingeniería, como es usual en Apple. El nivel de craft técnico es extraordinario.

Mis dudas vienen cuando hablamos de Diseño con mayúscula, más allá del craft. No se ven muchas preguntas detrás del producto, se ve la visión de alguien muy seguro de cómo debería ser el futuro sin necesariamente haber cuestionado si esa visión es correcta.

Lo que sí no tengo dudas: van a llevar el VR/AR a otro nivel, poniendo a muchos diseñadores ante el reto de crear experiencias en un mundo 3D que sí o sí debe salir de la idea de rectángulos flotantes. Para eso vamos a pasar por unos años extraños con rectángulos flotantes hasta que alguien, o el propio Apple, domine el espacio xyz.

TLDR — Quizá los LLMs tienen más potencial de triunfar en cambiar cómo usamos la tecnología que todo lo demás que se está proponiendo. Esa es la apuesta que me parece más honesta hoy.

Fuentes originales

Hilo de reflexiones sobre el Apple Vision Pro en X/Twitter (junio 2023)

Google I/O 2023: Todo es IA

Wed, 10 May 2023 00:00:00 GMT

Notas en vivo y reflexiones del Google I/O 2023. Mayo 2023.

La misión que Google puso sobre la mesa este año no deja lugar a dudas: "Make AI helpful for everyone." Y si tomáramos un shot por cada vez que mencionaron "AI" durante el keynote, hubiéramos terminado muy mal.

Estas son mis notas e impresiones del evento.

El gran tema: IA en todos lados

Google dejó claro desde el arranque que este I/O era diferente. La inteligencia artificial no era una característica más; era el hilo conductor de absolutamente todo lo que presentaron. Y tuvieron el cuidado de repetir hasta el cansancio que "ellos llegaron primero."

Bard se vuelve serio

En menos de seis meses, Bard se convirtió en un mejor Google Assistant de lo que nunca fue el propio Google Assistant. Las actualizaciones más notables:

Conexión a Google: Bard ahora está integrado con los servicios de Google, lo que cambia completamente su utilidad.
Extensiones de terceros: Adobe, Spotify y otros tendrán extensiones dentro de Bard. El ecosistema crece.
Dark theme: Curiosamente, lo que recibió más aplausos en el auditorio.

La búsqueda como la conocemos, empujada al sótano

Lo más impactante del evento fue ver cómo Google está experimentando en Labs con una nueva pantalla de resultados que coloca la IA generativa arriba de todo. Los links de búsqueda, esos que definieron la experiencia de internet por décadas, ahora son tratados como "fuentes" de las respuestas que da el modelo.

Es un cambio de paradigma gigante. La Conversation UI por encima de la Search UI clásica.

Duet AI para Workspace

Google Workspace recibió Duet AI, que viene a resolver el problema más grande de los prompts: ¿Por dónde empiezo? Bajar la fricción de entrada es exactamente lo que necesita la IA generativa para tener adopción real en entornos de trabajo.

Universal Translator

Quizá el anuncio más llamativo en términos de impacto social: Universal Translator acaba de complicarle la vida al doblaje. Se escucha un poco como doblaje de Hallmark, pero funciona.

Material You y Android 14

Por fin llegó el turno de Android. Las actualizaciones de Material You en Android 14 incluyen:

Nuevas opciones de reloj en la pantalla de bloqueo
Más opciones de color
Shortcuts en la pantalla de bloqueo
Wallpapers generados con emojis: un gimmick divertido, honestamente
Wallpapers generados con IA: esto sí es interesante

Lo que me llamó la atención de la interfaz para crear wallpapers generativos es que no es el aburrido Conversational UI de siempre. Había algo visualmente más rico en esa propuesta.

Hardware: Pixel 7a, Pixel Tablet y Pixel Fold

Rick Osterloh subió al escenario y llegó el hardware. La fórmula Pixel sigue siendo la misma: Hardware + Software + AI.

Pixel 7a

Disponible en dos colores hermosos: Coral y Blue. El reto de siempre: llegar a más mercados. México sigue esperando.

Pixel Tablet ($500 con dock incluido)

"Diseñada para funcionar en la casa." Es un mix curioso: funciona como tablet normal y también como pantalla inteligente tipo Nest Hub cuando está en su dock. Tiene multiusuario, algo que el iPad aún no ofrece. Mi siguiente compra, sin duda.

Pixel Fold ($1,800)

El foldable más delgado del mercado en ese momento. El sistema de cámaras es el mismo que el Pixel 7, lo que es una buena señal. El Dual Screen Interpreter Mode —que usa las dos pantallas para mostrar texto traducido— es una de esas funciones que realmente aprovecha el formato.

A $1,800 dólares con un Pixel Watch de regalo incluido. Son 30 mil pesos mexicanos. Ouch.

Lo que me queda del I/O 2023

Este fue un Google I/O muy diferente a los anteriores. Menos celebración de lo que ya existe, más apuesta agresiva por lo que viene. La IA generativa no como futuro lejano, sino como presente inmediato.

El riesgo es claro: estaban mostrando muchas cosas que parecían hechas en un fin de semana intenso de trabajo. La velocidad de lanzamiento puede sacrificar la calidad de la experiencia.

Lo que sí me pareció honesto fue la narrativa alrededor de los Pixels como el dispositivo donde todo esto vive de forma más completa. El Pixel como el Android de referencia, no solo para cámaras, sino para la experiencia de IA en el bolsillo.

Muuuucho contenido para un solo evento. ¿Qué fue lo que más te llamó la atención del I/O 2023?

Fuentes originales

Hilo en vivo del Google I/O 2023 en X/Twitter (mayo 2023)

Dark patterns: cuando diseñas contra el usuario

Fri, 05 May 2023 00:00:00 GMT

Originalmente publicado como serie de tweets en X/Twitter. 2022–2023.

Ya vi que Cinépolis rompió su checkout intencionalmente cuando se usa el código de 2x1 para Mastercard. Sin eso, el proceso de compra fluye normal.

Son unos bastardos.

Y no son los únicos. Esto pasa más seguido de lo que la industria quiere admitir.

El estado de las apps en México

Es bien sabido que hacer apps va en decadencia, pero es bien loco redescubrir —cada que hago benchmarking— la cantidad de apps mexicanas que están en un estado deplorable.

De los unicornios, que teóricamente tienen para desarrollar algo bien: hay apps que parecen hechas a las carreras, con flujos rotos y experiencias que ignoran cualquier estándar básico de usabilidad.

El problema no es falta de talento. Es falta de prioridad. Cuando el producto digital no es la prioridad del negocio, se nota. Y los usuarios lo pagan.

Diseñar para generar confianza

En el otro extremo están las funcionalidades para generar confianza y seguridad. Tardamos años en pensarlas, pero ya comienzan a aparecer.

Un ejemplo está en Instagram, donde puedes checar si ellos mismos te han enviado correos para evitar el phishing. Es una funcionalidad sencilla que dice mucho: "Te cuidamos. Verifica que somos nosotros."

Mi único problema es que aún son funcionalidades muy escondidas, con poco factor de descubrimiento. Las personas que realmente necesitan saber de ellas —las más vulnerables al fraude— es probable que no las conozcan.

La responsabilidad del diseñador

Existe una línea muy clara entre diseñar para el negocio y diseñar contra el usuario. Romper un checkout para que la gente no pueda usar un descuento es cruzar esa línea. Esconder funcionalidades de seguridad donde nadie las encuentra es quedarse corto.

El diseño tiene la capacidad de proteger o de explotar. Y cada decisión de interfaz que tomamos dice de qué lado estamos.

TLDR — Si tu producto funciona peor cuando el usuario intenta ahorrar dinero, no es un bug. Es una decisión.

Fuentes originales

App Defaults · 2023

Sun, 01 Jan 2023 00:00:00 GMT

Duplicating this original post by Fede Sánchez that I found on Andy post.

List of app defaults I am currently using:

Mobile Design & Prototyping → Figma
Web Design → Figma/Framer
Mail Client → Hey!
Notes → Bear
To-Do → Todoist
Calendar → Amie
RSS → Ares / Twine (Android)
Contacts → Google Contacts
Browser → Arc
Chat → Telegram / WA
Bookmarks → mymind
Read It Later → mymind
Word Processing → Bear
Spreadsheets → Google Sheets
Presentations → Pitch
Shopping Lists → Google Keep
Meal Planning → N/A
Budgeting and Personal Finance → Google Sheets
News → Artifact / Twitter
Music → YouTube Music
Podcasts → Pocket Casts
🆕 Newsletters → Hey / Substack
Code → N/A

El mundo startup está quemado y seguimos aplaudiendo

Mon, 14 Nov 2022 00:00:00 GMT

Reflexiones desde adentro de la industria tech. Noviembre 2022.

He estado de cerca toda mi carrera al mundo de las startups. Sin ellas yo no habría comenzado en esto. Pero justo porque sé cómo se mueven, lo asquerosas que pueden llegar a ser, es que soy muy crítico y expreso lo peligrosas que son.

La panacea que no existe

Para mí, sobretodo en el mundo tech, hemos jugado con fuego, nos hemos quemado, nos ha explotado en la cara y seguimos ahí pensando que las startups son la panacea. Cuando en realidad son una herramienta que implica una responsabilidad muy grande que estamos desaprovechando para llenar egos.

Lo vemos en pequeñas y grandes escalas, y aún así seguimos alimentando al monstruo con las mismas prácticas que convirtieron algo bonito en algo feo.

2022: el año en que la burbuja explotó

El 2022 fue feo para el mundo tech. Despidos masivos, valuaciones derrumbadas, unicornios que resultaron ser burros con cuerno de papel. La burbuja que se había inflado con dinero barato, tasas de interés en cero y una pandemia que aceleró la adopción digital de todo, finalmente empezó a desinflarse.

Ojalá podamos meterle un hard reset. Pero yo nomás veo cómo esto sólo irá hacia abajo antes de mejorar.

El dinero corrompe

Esto viene de una profunda decepción que se ha extendido por varios años. El dinero corrompe, y por más buenas que sean las ideas del mundo tech, siempre terminan manchadas por esta insistencia de capitalizar a cualquier costo.

Son lo mismo de siempre, pero revolcado en Silicon Valley.

La idea que compramos sin leer la letra chica

Para no hacer leña de árboles caídos: también soy consciente de que no hay industria perfecta. Al final somos humanos, y parte de mí entiende que todo en algún punto se puede corromper.

La cuestión es que nos vendieron la idea de que sería un mundo mejor, y la compramos. La promesa del "move fast and break things", de cambiar el mundo desde un garage, de democratizar el acceso y la oportunidad. La compramos sin leer bien la letra chica.

Y la letra chica decía: siempre y cuando sea rentable para los que invierten.

Por qué importa decirlo

Mi intención no es comenzar un incendio ni simplificar un tema que tiene muchas aristas. Hay personas brillantes que genuinamente quieren hacer cosas buenas dentro de este sistema. Hay productos que han mejorado vidas reales.

Mi intención es alzar la cabeza y prestar atención a los focos rojos que estamos viendo por todos lados, y dejar de pretender que son accidentes o excepciones. No lo son. Son el resultado natural de un sistema que optimiza para crecimiento a cualquier costo.

Reconocerlo no es ser pesimista. Es el primer paso para exigir algo mejor.

¿Tú en qué parte del espectro estás? ¿Crees que la industria startup puede reformarse desde adentro, o necesita un cambio más estructural?

Fuentes originales

Hilo sobre el mundo startup quemado en X/Twitter (noviembre 2022)

Made by Google 2022: El Portfolio Pixel

Thu, 06 Oct 2022 00:00:00 GMT

Notas en vivo y reflexiones del Made by Google 2022. Octubre 2022.

El 6 de octubre de 2022, Google celebró su evento anual de hardware con un mensaje claro: ya no es una empresa de un solo teléfono. Es una empresa con un portafolio. El Pixel 7, el Pixel 7 Pro, una tablet en camino y señales de que el ecosistema Pixel finalmente estaba tomando forma.

Este es el registro del evento en tiempo real.

El portfolio, no el producto

Lo primero que llamó la atención fue el encuadre del keynote. Google no presentó "el nuevo Pixel". Presentó el Pixel Portfolio: una familia de dispositivos con identidad visual coherente, lenguaje de diseño compartido y una apuesta clara por competir en múltiples segmentos al mismo tiempo.

Era una declaración de intenciones. Google quería que vieras el Pixel 7 y el Pixel 7 Pro no como sustitutos del año anterior, sino como el primer eslabón visible de algo más grande.

Isabelle Olsen, una de las presentadoras, apareció en el escenario con un outfit que combinaba perfectamente con los colores del dispositivo que presentaba. Un detalle pequeño, pero el tipo de detalle que dice mucho sobre cuánto cuidado se puso en esta presentación.

Google vs. Apple: La memoria histórica

Uno de los momentos más divertidos del evento fue cuando Google se permitió recordarle al público —y de paso a Apple— quién llegó primero a ciertas tecnologías.

Night Sight. Astrophotography. Crash Detection.

Google los inventó. Apple los adoptó después. Y Google no desaprovechó la oportunidad de mencionarlo, con la calma de quien no necesita gritar para tener razón.

La app de grabadora: el podcast killer silencioso

Un anuncio que pasó casi desapercibido entre los focos de las cámaras: la app de Grabadora de Voz del Pixel 7 recibiría la capacidad de identificar y etiquetar a las personas que hablan en una grabación.

Para quien graba entrevistas, reuniones o podcasts, esto era enorme. La app de grabadora del Pixel llevaba años siendo considerada una de las mejores de cualquier plataforma, y esta actualización la convertía en algo cercano a una herramienta profesional de transcripción automática.

Cámaras: el año del zoom

La cámara fue, como siempre, el corazón del keynote. Y 2022 fue el año en que Google decidió que el zoom merecía toda la atención.

El Pixel 6 Pro ya tenía un telephoto excepcional. El Pixel 7 Pro heredó esa base y la llevó más lejos con Super Res Zoom mejorado: combinando los lentes disponibles con procesamiento computacional para producir zooms que, en papel, deberían ser imposibles para un sensor de ese tamaño.

También llegó el modo Macro al Pixel 7 Pro, algo que los usuarios venían pidiendo desde hacía años. Photo Unblur —la capacidad de desenfocar fotos ya tomadas— fue el feature exclusivo del lanzamiento, heredero de Magic Eraser del Pixel 6.

En el otro lado de la moneda: Cinematic Blur, que agrega desenfoque artificial al video. El demo fue, en opinión generalizada, horrible. Una promesa que el hardware todavía no podía cumplir con elegancia.

Y 10-bit HDR en video, que en el mundo del video móvil de ese momento era genuinamente importante.

El Pixel Tablet se asoma

Casi al final del keynote llegó la mención que nadie esperaba: tablets, en plural. Una referencia rápida, casi de pasada, a que Google estaba trabajando en más de un dispositivo de este tipo.

Y luego la imagen conceptual: Nest Hub + tablet Android = Pixel Tablet. Un dispositivo que funcionaría como tablet portátil pero que, al colocarlo en su base, se convertiría en un smart display para el hogar.

Era la primera señal clara de que el ecosistema Pixel iba más allá del teléfono.

Una queja pequeña pero legítima

En medio de todo el entusiasmo, una nota crítica: el equipo de marketing siguió usando el hotword "Hey Google" durante toda la presentación, lo que activó involuntariamente decenas de miles de dispositivos en los hogares de quienes veían el stream en vivo.

Pequeño detalle. Gran incomodidad.

TLDR — Made by Google 2022 fue el evento en que Google demostró que había aprendido a construir no solo buenos teléfonos, sino una narrativa coherente alrededor de ellos. El Pixel Portfolio era la respuesta a años de críticas sobre la falta de ecosistema. No todo estaba resuelto, pero por primera vez la dirección era inequívoca.

Fuentes originales

Por qué el iPhone 14 Pro tiene los mismos problemas que tuvo el Pixel 6

Wed, 21 Sep 2022 00:00:00 GMT

Reflexiones sobre sensores de cámara y el proceso de maduración de los algoritmos. Septiembre 2022.

Después de ver varios reviews iniciales del iPhone 14 Pro, especialmente los enfocados en las cámaras, tengo una impresión que me parece importante compartir: a Apple con el iPhone 14 Pro le está sucediendo lo mismo que le pasó a Google hace un año con el Pixel 6.

Lo que le pasó al Pixel 6

Un sensor más grande (de 50MP) en el Pixel 6 hizo que Google tuviera que cambiar por completo lo que el algoritmo hacía en los Pixels anteriores. El problema fue que casi todos los Pixels anteriores compartían el mismo sensor, así que el salto fue mayor de lo esperado.

El resultado: oversharpening. Un afilado excesivo en las fotos que hacía que las imágenes se vieran procesadas en exceso, artificiales. Google tardó varios meses en ajustarlo a través de actualizaciones de software.

Lo que le está pasando al iPhone 14 Pro

Apple cambió el sensor del iPhone por uno más grande, y al igual que Google, lo que hacen con eso es dar fotos de 12MP con mucha más calidad e información capturada. No es que el iPhone 14 tome fotos malas. Es que, también al igual que Google, van a tener que hacer ajustes al engine.

El oversharpening que varios reviewers están notando no es un defecto permanente; es el síntoma de un algoritmo que aún no ha aprendido a manejar la nueva información que le está llegando del sensor.

El proceso de maduración

Hoy, un año después del lanzamiento del Pixel 6 Pro, es una bestia tomando fotos. Cada actualización fue mejorando la situación, y aunque el oversharpening aún se siente en algunos escenarios, ahora se usa de formas más sutiles. El engine se siente maduro.

Con el iPhone 14 Pro es probable que suceda exactamente lo mismo cuando Apple ajuste el nuevo engine. Apple tiene toda la infraestructura y el equipo para hacerlo, y lo harán bien.

Eso también explica, por cierto, por qué tuvieron que cambiarle el nombre al sistema de cámaras. Cuando tienes un nuevo sensor, tienes un nuevo punto de partida.

El bonus: comparación justa

Si quieres comparar cámaras de forma justa en este momento, la comparación entre el Pixel 6 Pro (con un año de maduración en su engine) y el iPhone 14 Pro (recién lanzado) es más honesta que cualquier otra. Y por ahora, en ese matchup, Apple pierde.

Lo que viene: Pixel Binning

Todo esto abre un tema que vale la pena explorar en profundidad: el Pixel Binning, el proceso por el cual los teléfonos tienen sensores de más de 50MP pero te entregan fotos de 12MP. Es crucial para entender por qué más megapíxeles no siempre significa mejores fotos, y por qué el salto a sensores más grandes es más complicado de lo que parece.

TLDR — La ingeniería de cámaras en teléfonos es computacional, no óptica. Y en eso, el proceso de aprendizaje del algoritmo importa tanto como el hardware.

Fuentes originales

Hilo sobre oversharpening en iPhone 14 Pro y Pixel 6 en X/Twitter (septiembre 2022)

El futuro del smart home está en Matter (y por eso todo se siente estancado)

Wed, 11 May 2022 00:00:00 GMT

Reflexiones sobre el estándar Matter y el futuro de los hogares inteligentes. Mayo 2022.

Si sienten que la industria smart home está algo estancada desde hace un año, es porque todos están esperando a que Matter esté listo. Y eso, aunque frustrante, tiene todo el sentido del mundo.

El desastre actual del smart home

Hoy, tener una casa con dispositivos "inteligentes" es un dolor de cabeza si no usas un solo ecosistema. Imagina esta situación completamente realista:

Compras una Alexa (Amazon).
Tienes Google WiFi y un Nest Hub.
Tus focos son Hue con un bridge Philips.
Usas iPhone con HomeKit.

Estás juntando hasta 4 ecosistemas que no se comunican entre sí. Cada uno tiene su app, su protocolo, sus incompatibilidades. Querer automatizar algo simple puede convertirse en un proyecto de fin de semana.

Qué es Matter

Matter es un estándar para smart homes que Google, Amazon, Apple y la CSA (Connectivity Standards Alliance, antes conocida como la organización detrás de Zigbee) comenzaron a desarrollar desde 2019. Debía estar listo "este año" al momento de escribir este texto.

El objetivo es poner orden al desastre: un estándar abierto e interoperable que permita que todos los dispositivos se hablen entre sí, sin importar qué ecosistema principal uses.

Las compañías con estándares propietarios —Google Thread, Amazon Sidewalk, Apple HomeKit— se pusieron de acuerdo en lugar de seguir poniéndose el pie. Eso no es poca cosa.

Qué cambia con Matter

Los cambios inmediatos más importantes:

Interoperabilidad: Tu foco Hue funcionará en Google Home, Alexa y HomeKit sin configuraciones especiales.

Menor latencia: El tiempo de respuesta al hacer peticiones —encender una luz, ajustar el termostato— se reduce considerablemente.

Configuración simple y rápida: El dolor más grande del smart home actual es el proceso de setup. Matter lo simplifica de forma significativa.

Para que tengas una idea de la escala del ecosistema que se está construyendo: hay más de 200 compañías parte del Thread Group, incluyendo Samsung, Signify (Philips Hue) e IKEA.

La oportunidad real

Lo más interesante de Matter es que no solo aplica a productos nuevos. Muchos dispositivos smart home lanzados en los últimos años son compatibles con partes de los nuevos protocolos y podrían recibir actualizaciones OTA (over-the-air) que los hagan compatibles.

Eso significa que la inversión que ya hiciste en dispositivos inteligentes podría no quedarse obsoleta. Si eso se cumple a escala, es una de las noticias más importantes que ha habido en el ecosistema del hogar inteligente en años.

Por qué esto importa más allá de los gadgets

El smart home lleva más de una década prometiendo más de lo que entrega, en gran parte porque el ecosistema fragmentado hacía que la experiencia fuera mala para la mayoría de los usuarios fuera del nicho.

Matter podría ser el punto de inflexión. No porque vaya a traer productos mágicamente mejores, sino porque va a hacer que los productos que ya existen —y los que vengan— simplemente funcionen juntos.

Y a veces eso es todo lo que se necesita para que una tecnología finalmente cumpla su promesa.

¿Tienes dispositivos smart home? ¿Cómo ha sido tu experiencia con los diferentes ecosistemas?

Fuentes originales

Hilo sobre Matter y el futuro del smart home en X/Twitter (mayo 2022)

Breve historia de Material Design y lo que vino con Material You

Fri, 21 May 2021 00:00:00 GMT

Originalmente publicado como hilo en Twitter. Mayo 2021.

Este texto está escrito asumiendo cierto conocimiento de diseño y/o desarrollo de productos digitales: interfaces, interacción y experiencia de usuario. Si algún concepto no te queda claro, con gusto lo aclaro.

¿Qué carajos es Material Design?

Material Design comenzó como un Design System (DS) para cubrir las necesidades de una compañía con muchísimos productos digitales: Google. Aunque la percepción original sobre MD ha cambiado con los años, en esencia sigue siendo lo mismo: un lenguaje de diseño compartido.

La historia completa tiene cuatro capítulos, cuatro "evoluciones" del sistema:

0️⃣ Holo (Pre-Material Design)
1️⃣ Material Design (MD)
2️⃣ Material Theme (MT)
3️⃣ Material You (MY)

El origen: Holo y Matias Duarte

Hace una década no imaginábamos a Google como sinónimo de diseño. Era una compañía de ingeniería que hacía búsqueda y correo, no interfaces. Pero por dentro se sentía un cambio. Los Design Sprints ya sucedían entre equipos y se gestaba una revolución en el sistema operativo más usado del mundo, de la mano de Matias Duarte.

Matias ya se había encargado de llevar su buen gusto al Palm Pre, con una interfaz y experiencia por encima incluso del iPhone. En 2010 llegó a Google para revolucionar Android desde adentro. Como alguien dijo entonces: "Wherever this guy goes, awesome user interfaces follow."

0️⃣ Holo

El primer intento por llegar a lo que ahora tenemos fue Holo. Con el lanzamiento en 2011 de Android 4.0 (Ice Cream Sandwich) vino el primer rediseño grande de la plataforma. Las bases de lo que eventualmente se convirtió en MD ya se notaban desde Holo: una paleta de colores, tipografía, formas, iconos, componentes, animaciones y layouts más consistentes.

Aunque Material Design se sintió como una revolución, el verdadero primer intento por generar buenas sensaciones en Android fue Holo, que también contaba con sus propias y muy sólidas guías de diseño.

1️⃣ Material Design: la apuesta grande

Todo eso no era suficiente. iOS 7 había puesto sobre la mesa el fin del skeuomorfismo y alguien tenía que competir ante semejante movimiento.

Material Design fue creado con la idea de ayudar a crear aplicaciones coherentes: un lenguaje común entre todas las apps dentro de un SO, llevando esa consistencia incluso a otras interfaces como computadoras o relojes.

Sus tres principios originales:

Material es una metáfora. Basado en la interacción consistente de los materiales del mundo real, repensada para las interfaces. ¿Suena a skeuomorfismo? Un poco, sí. La diferencia es que se abstrae: toma las reglas del mundo real y las adapta al mundo virtual.
Intrépido, gráfico e intencional. Diseño deliberado, no decorativo.
El movimiento trae consigo intención. Las animaciones no son cosméticas; comunican.

La documentación original contenía muchísimas reglas alrededor de estos materiales, especialmente los orientados al papel como superficies y la tinta para pintarlas. La idea era hacer creer que podías interactuar con una interfaz 3D en un dispositivo 2D.

El problema de las cadenas

Hubo un problema: las guías de diseño eran muy rígidas. Había reglas para cubrir absolutamente todo, desde la tipografía (Roboto, sin excepciones) hasta los colores. Nada podía ser cambiado al usar Material Design. El sistema daba la sensación de limitar más que liberar.

2️⃣ Material Theme: romper las cadenas

Para 2018, después de varias sesiones de investigación, se presentó la evolución del sistema atacando sus principales flaquezas, con un nuevo concepto: Material Theme.

Las apps que en un principio adoptaron MD y que se sentían "muy Google" encontraron en la actualización un nuevo modelo para expandir su marca usando MT como base. Tematizar tu aplicación con tu identidad de marca ahora era posible, porque las guías invitaban a la exploración en lugar de dictar.

Los tres principios de MT fueron los mismos que MD, pero la implementación cambió todo.

3️⃣ Material You: el paradigma personal

MD con MT parecían el complemento perfecto para hacer aplicaciones bien diseñadas. Pero Matias Duarte y compañía tenían otra cosa en mente: el futuro de las interfaces en un mundo lleno de dispositivos personales.

Así llegó Material You, que a diferencia de sus antecesores propone un paradigma diferente en la forma en cómo nos manifestamos con nuestros objetos personales. "One size fits all" ya no es suficiente.

Y curiosamente, para Google nunca lo fue. Android siempre se ha caracterizado como un sistema "abierto" que te permite personalizar hasta el más mínimo detalle. El reto ahora era hacer eso de forma coherente y hermosa.

El reto del color

El punto de partida de Material You parte de lo primero que sentimos como nuestro: nuestras fotos, nuestras imágenes. El primer paso fue dar opciones de personalización a partir de los colores.

Android 12 crea paletas de colores por ti, basadas en cualquier imagen que proveas. Se encarga de tomar los colores más atractivos y hacerlos funcionar en armonía. A este "script" lo llamaron Monet, por Claude Monet, líder del movimiento del arte impresionista.

Los tres principios de MY:

Cómodo. Tu dispositivo es tu hogar.
Iconoclástico. Busca desafiar supuestos y convenciones establecidas, incluyendo usar formas y colores en lugar de sombras como lo hacía MD.
Espiritual. Generar vida usando formas, espacio, luz y movimiento.

Eventualmente, la caracterización manejada por MY podría expandirse a más dimensiones: formas, movimiento, luz. Todo lo que pueda usarse como expresión en nuestros dispositivos personales.

Las preguntas abiertas

Con este nuevo paradigma quedan preguntas sin resolver:

¿Cómo podría una marca expresarse al mismo tiempo que el usuario personaliza todo?
¿Hasta dónde se expresa un objeto tan personal como lo es un teléfono?
¿Qué pasará en otros sistemas operativos donde no hay tanto control?

Fue emocionante ver lo que Google puso sobre la mesa respecto a la relación que tenemos como humanos con nuestros dispositivos. Más allá del cambio visual o las actualizaciones al sistema, Material You se siente como una visión fresca al futuro.

Para cerrar, las palabras de Duarte lo resumen mejor que yo:

"It is a little bit terrifying… for Google designers themselves. It is terrifying that we're going to have to share control of every pixel with our users! But we're finding that leap of faith we're taking is unlocking totally new positives."

Fuentes originales

Hilo completo en X/Twitter (mayo 2021)

Google I/O 2021: El año de Material You

Tue, 18 May 2021 00:00:00 GMT

Notas en vivo y reflexiones del Google I/O 2021. Mayo 2021.

El 18 de mayo de 2021, Google abrió su conferencia anual para desarrolladores con un keynote que, en retrospectiva, resultó ser uno de los más importantes de la década para el diseño de interfaces en Android. No fue el año con más anuncios ni el más llamativo. Fue el año en que Google se atrevió a repensar cómo se ve, se siente y se adapta un sistema operativo a quien lo usa.

Este es el registro de lo que ocurrió, en tiempo real.

Google Workspace: El caos se convierte en plataforma

La primera sorpresa llegó antes de que alguien mencionara Android. Google presentó Smart Canvas, su respuesta a Notion y Dropbox Paper: documentos, hojas de cálculo y presentaciones conviviendo en un mismo espacio colaborativo.

Parecía un movimiento largo tiempo esperado. Por años, Google Workspace había sido una colección de productos geniales pero desconectados. Con Smart Canvas, finalmente había una visión coherente: un workspace donde el contenido fluye entre aplicaciones sin fricciones.

LaMDA: El modelo que respiraba

Uno de los momentos más inquietantes del keynote fue la demostración de LaMDA, el modelo de lenguaje conversacional de Google. En la demo, LaMDA simulaba una conversación como si fuera Plutón —el planeta enano— y como si fuera un avión.

Lo más extraño: en algún punto de la transmisión, se podía escuchar algo que sonaba como respiración. ¿Feature? ¿Simulación? Nadie estaba seguro. Lo que sí quedó claro es que Google estaba apostando fuerte a que la siguiente frontera de la búsqueda no sería una caja de texto sino una conversación.

En ese momento nadie imaginaba lo cerca que estaba ese futuro.

El momento Matías Duarte

A mitad del keynote llegó el nombre que los fans de Android llevaban esperando: Matías Duarte. El vicepresidente de diseño de Google tomó el escenario y lo que siguió fue uno de los anuncios de diseño más relevantes en la historia de Android.

Primero llegaron los rumores en el chat: ¿Material Design 3? ¿Un nuevo sistema visual? Y entonces la frase que lo resumió todo:

"Form following feeling."

Material You había llegado.

Material You: Color para todos

La propuesta era radical en su sencillez: el sistema operativo toma los colores de tu fondo de pantalla y construye toda la paleta de la interfaz a partir de ellos. No un tema oscuro o claro. No una opción de color. Una paleta personalizada, generada dinámicamente, que se aplica a las apps del sistema y, eventualmente, a las apps de terceros.

Material 3 es Material You. Y Material You es la promesa de que tu teléfono se ve como tuyo, no como el de todos los demás.

Android 12 traería este rediseño ese otoño, junto con Compose —el nuevo sistema de UI declarativo— y un rediseño completo de las apps de Google. Las animaciones más suaves, los widgets renovados, el blur que por fin llegaba de forma oficial a un Pixel.

Wear OS renace con Samsung

El otro gran anuncio fue la resurrección de Wear OS. Google y Samsung —que habían pasado años compitiendo con sistemas separados— anunciaban una colaboración: un Wear OS unificado, construido en conjunto, con una nueva experiencia de usuario enfocada en salud y con integración de Fitbit.

Llegaba también una app real de YouTube Music. Los tiles se multiplicaban. La navegación se rediseñaba desde cero.

Para quien llevaba años viendo cómo Wear OS se quedaba atrás de watchOS, era una señal de que Google finalmente se tomaba en serio el ecosistema de muñeca.

La beta y el primer contacto

Horas después del keynote, la beta de Android 12 ya estaba disponible. Las animaciones se sentían más suaves a pesar de ser más elaboradas. Los widgets se veían distintos. El blur oficial en un Pixel, por fin.

Solo una excepción esperada: BBVA se rompía. El consejo fue unánime: no instalar la beta en dispositivos principales.

Google I/O 2021 no fue el año de los gadgets ni de las cifras. Fue el año en que el diseño volvió a ser el protagonista en Android. Material You cambiaría la forma en que millones de personas piensan sobre la personalización de su teléfono, y LaMDA sembraría la semilla de lo que hoy conocemos como la era de los modelos de lenguaje.

Todo empezó con un keynote y la frase: "Form following feeling."

Fuentes originales

El problema con los "UXers"

Wed, 17 Feb 2021 00:00:00 GMT

Originalmente publicado como serie de tweets en X/Twitter.

Se vendió una cortina de humo en la que el diseñador debe "pensar estratégicamente" pero sin ejecutar nada porque eso de "mover pixeles" no era lo suficientemente bueno para sus intereses.

Ahora tenemos un exceso de "UXers" en la industria que aportan poco o nada porque nunca desarrollaron las habilidades fundamentales del oficio. Saben hablar de procesos, pero no saben resolver un problema de interfaz.

UX no es un ingrediente

Amigos NO, "ponerle UX" no es "mejorar" UI. Lo que ven por ahí son interfaces "mejoradas" a partir de suposiciones. UX no es algo que le pones a las cosas como si fuera un ingrediente para mejorar el sabor.

Eso que muchos llaman "mejorar con UX" es simplemente "Bad UI" vs "Improved UI", nada más que eso. Las interfaces se diseñan con las personas en mente, no con suposiciones disfrazadas de metodología.

Lo que realmente necesitamos

En Latinoamérica necesitamos menos "UXers" y más diseñadores de interacción e interfaz. Verdaderos crafters con visiones del producto más allá de lo que "pide" el usuario, con habilidades visuales, capaces de comunicarse a través de sus prototipos, llevando cada detalle de un producto al siguiente nivel.

He visto comentarios donde diseñadores exponen su forma de trabajar y es impresionante lo atacados que se ponen los UXers simplemente porque les tocaron sus benditos procesos de diseño. Por años aprendí diferentes procesos y formas de trabajar, y la que mejor me ha funcionado es la que se adapta al contexto, no la que dice el libro.

La herramienta vs. el oficio

Martillo y clavos están al alcance de todos, pero saber escoger la madera correcta (para ese contexto), clavar en el lugar correcto y martillar sin lastimarse se obtienen con educación —que puede venir de muchos lugares— y experiencia —que podría verse como una extensión de la educación.

Una habilita a la otra, pero la otra necesita de más ingredientes para que suceda.

La analogía aplica perfectamente al diseño: tener Figma no te hace diseñador, así como tener un martillo no te hace carpintero.

El rediseño visto desde adentro y desde afuera

Esta dinámica se ve clarísimo cuando se lanza un rediseño al público:

Diseñadores desde afuera: "Seguro no lo testearon con usuarios reales."

Equipo interno: "Nos dieron instrucciones de arriba y no pudimos hacer nada."

La gente de arriba: "El lanzamiento de nuestra app es un éxito, miren cómo subió..."

La realidad es que diseñar en una empresa es navegar restricciones, políticas y prioridades que nunca aparecen en los casos de estudio bonitos de Behance. Los que critican desde afuera casi nunca tienen idea de las batallas que se libraron adentro.

El camino de vuelta al craft

El diseño siempre ha sido, y siempre será, un oficio. Un oficio que requiere manos en la masa, no solo frameworks y post-its. Los mejores diseñadores que conozco —los que realmente mueven la aguja— son los que nunca dejaron de mover pixeles.

Pensar estratégicamente es importante, claro. Pero si no puedes ejecutar, no puedes diseñar. Y si no puedes diseñar, ¿qué estás haciendo exactamente?

TLDR — El diseño no necesita más pensadores estratégicos. Necesita más gente que haga cosas bien hechas.

Fuentes originales

Bokeh UI: una propuesta de diseño visual

Tue, 21 Jul 2020 00:00:00 GMT

Originalmente publicado como hilo en X/Twitter. Julio 2020.

Los grandes lenguajes de diseño de interfaces tienen una metáfora en el centro. Material Design tomó el papel y la tinta, la física de las superficies, las sombras y la luz. Fluent Design tomó la transparencia, el acrílico y la profundidad. Cada uno encontró un referente del mundo físico y lo tradujo al mundo de las pantallas.

En julio de 2020 empecé a explorar una metáfora que nadie había llevado hasta sus últimas consecuencias en interfaces: la fotografía.

No las fotos. No los filtros. La óptica.

El punto de partida: Microsoft y el showcase

Todo empezó observando algo curioso en Microsoft. En sus materiales de marketing y presentaciones de concepto, usaban efectos visuales que nunca terminaban apareciendo en las interfaces reales de sus productos. Efectos de profundidad, bokeh, desenfoque selectivo. Cosas que se veían espectaculares en el showcase pero que desaparecían en la versión de producción.

La pregunta fue: ¿por qué nadie había intentado llevarlo en serio a las interfaces? ¿Por qué el blur siempre era de fondo y nunca del elemento en primer plano?

Bokeh UI: la propuesta

Lo que empecé a llamar Bokeh UI toma prestados los artefactos de la óptica fotográfica para crear jerarquía visual, profundidad y foco en las interfaces.

La diferencia clave respecto a Material o Fluent es dónde cae el efecto. En Material, las sombras y superficies crean profundidad entre capas. En Fluent, el background blur crea contexto. En Bokeh UI, el efecto va sobre el elemento enfocado y su relación con la profundidad de campo, igual que un lente que aisla un sujeto del fondo.

En la práctica esto significaría: cuando interactúas con un elemento —un botón, una tarjeta, un modal— los elementos que no son el punto de atención se desvanecen ligeramente, como si la cámara hubiera enfocado en lo que importa y dejado el resto fuera de foco. No desaparecen. Se subordinan.

Chromatic aberration: el artefacto inesperado

Otro artefacto de la óptica que exploré es la aberración cromática: el fenómeno que ocurre cuando un lente no maneja correctamente las longitudes de onda de la luz y cada color se refracta en una dirección ligeramente distinta. El resultado visual es ese borde de color —rojo, cian, púrpura— que aparece en los bordes de las fotografías tomadas con lentes de menor calidad.

La aberración cromática es técnicamente un defecto. Pero visualmente tiene algo. Los videojuegos la usan mucho, precisamente porque transmite una sensación de realismo imperfecto, de lente físico, de mundo captado y no renderizado.

En interfaces podría usarse de forma sutil en transiciones o en estados de error, transmitiendo una sensación de distorsión controlada, de que algo salió del plano habitual.

Motion blur: movimiento con peso

El tercer elemento fue el motion blur: el rastro de movimiento que queda cuando un objeto se desplaza rápidamente frente a un sensor. En interfaces, el movimiento suele ser o demasiado instantáneo —sin sensación de física— o con easing curves que se sienten artificiales.

El motion blur aplicado a animaciones de interfaz podría dar la sensación de que los elementos tienen masa, que se desplazan en un espacio con inercia real. No como un filtro encima, sino como parte de la lógica de movimiento.

El reto que sigue abierto

La propuesta terminó con una promesa: explorar estas ideas en prototipos y compartirlos. El reto que sigue siendo válido hoy es que todos estos artefactos se ven bien en fotografía y video, pero trasladarlos a interfaces implica resolver problemas de rendimiento, accesibilidad y consistencia que no son triviales.

¿Cuándo el blur deja de ser jerarquía y se convierte en distracción? ¿Cómo manejas la aberración cromática en pantallas de baja resolución? ¿El motion blur ayuda a entender el movimiento o lo oscurece?

Son preguntas abiertas. Pero la metáfora sigue siendo válida: la fotografía lleva más de un siglo resolviendo cómo dirigir la atención de quien mira. Las interfaces todavía tienen mucho que aprender de ese lenguaje.

Fuentes originales

Spotify, Joe Rogan y la batalla por el futuro de los podcasts

Thu, 21 May 2020 00:00:00 GMT

Originalmente publicado como hilo en Twitter. Mayo 2020.

El mundo podcastero se sacudió con la adquisición en exclusiva de Joe Rogan por parte de Spotify. Les cuento la historia de cómo sucedió esto, la polémica y sus repercusiones.

El ecosistema abierto que nadie quiere perder

Para entender qué está en juego hay que empezar desde el principio. El mundo podcastero lleva varios años existiendo y, a pesar de que fue prácticamente impulsado por Apple, la industria se ha mantenido muy abierta. Mucha responsabilidad tiene la tecnología en la que está basada: RSS.

RSS es un formato web que permite presentar información de forma cronológica. Un montón de cosas en la web adoptaron este formato; lo más reconocible para todos son los blog posts. Curiosamente, nuestros perfiles de Twitter fueron un feed RSS en un inicio, hasta 2013.

Un podcast funciona muy parecido a cuando tuiteas: la única diferencia es que en lugar de caracteres, se sube un archivo de audio. La app con la que escuchas (Apple Podcasts, Google Podcasts, Pocket Casts, Overcast) toma ese audio y te da herramientas para escucharlo cómodamente.

Lo importante: nadie te detiene de subir un podcast. Solo necesitas un lugar donde alojar tus audios que permita mostrarlos en un feed RSS. A partir de ahí los agregadores toman tu feed y lo interpretan. Escuchar estos feeds en la mayoría de los casos es gratuito, lo que hizo que el modelo de negocio más normal fueran los comerciales —aunque los modelos de suscripción también existen.

Cómo Spotify entró al juego y cambió las reglas

Cuando Spotify incursionó en el mundo del podcast, comenzó a hacer algo diferente al resto: tomó los audios alojados en los feeds RSS y los resubió a su plataforma, escudándose en la apertura del formato.

Esto les permite hacer algo que Apple no puede —por cuestiones de privacidad—: tomar control de los audios subidos y agregar comerciales a ellos. Muy parecido a como controlan los ads en la música, pero sin tener que pagar regalías.

La estrategia no se quedó ahí. En años previos, Spotify adquirió compañías alrededor del mundo podcast enfocadas en dos áreas:

Gimlet Media: crear contenido profesional.
Anchor: dar herramientas al podcastero amateur para que el proceso sea simple y accesible.

Definitivamente vieron negocio ahí.

El movimiento Joe Rogan

El anuncio que sacudió todo: el show de Joe Rogan, uno de los podcasts más escuchados del mundo (190 millones de descargas al mes, según sus propios datos), se escucharía en exclusiva en Spotify.

Este movimiento generó inmediatamente críticas sobre las intenciones y consecuencias directas en el ecosistema. Ver cómo una compañía que monopolizó la música ahora toma control de los podcasts es, cuanto menos, preocupante.

La paradoja de Spotify: villano necesario

La ventaja competitiva que tiene Spotify sobre el resto de plataformas es obvia: la base de usuarios que ya tiene por la música es inmensa. Pero hay algo que sí se les puede acreditar: en el último año hicieron que los podcasts salieran del nicho y se masificaran.

El dato es más obvio para los nuevos podcasteros. El efecto Spotify en el crecimiento de audiencia es marcado comparado con el resto de plataformas.

Agreguémosle que Anchor —la compañía que compraron— es la herramienta más usada por nuevos podcasteros, al final simplifica todo el proceso. El 70% de nuevos podcasts se crea en Anchor, o sea, en Spotify.

¿Por qué esto es preocupante?

Es aquí donde el panorama se complica. Si Spotify controla todo de inicio a fin —creación, distribución, consumo— y se convierte en el dominador del ecosistema podcast, eventualmente se perderá la apertura que el mismo ecosistema actual ofrece. Muy parecido a como Facebook domina y controla el mundo de los anuncios digitales.

El escenario aún no está completamente definido. Plataformas como Transistor aún reciben la mitad de sus escuchas desde Apple Podcasts, probablemente porque es difícil que cambies de plataforma una vez que te has "casado" con una.

Pero el primer contacto que la gente nueva tenga con un podcast será a través de Spotify, lo que hará que la balanza se incline a su favor en los próximos años. Recordemos que los podcasts están en pleno proceso de masificación, y Spotify lo está liderando.

Ni siquiera Google, con sus esfuerzos recientes, ha podido rasguñar el efecto Spotify. Apple, por otro lado, parece dormido y sin interés en defender una industria que lentamente se inclina hacia un solo lado, sin un competidor serio que quiera hacerle frente.

El futuro fragmentado

Una hipótesis interesante: eventualmente terminaremos consumiendo podcasts de forma fragmentada, similar a como consumimos series y películas hoy. Pagaremos por plataformas distintas dependiendo de qué queremos escuchar.

Es un futuro posible. Y si se cumple, habremos perdido una de las últimas industrias de contenido que aún funcionaba de forma abierta e igualitaria para todos.

TLDR — Escucho Pocket Casts y no pienso moverme. ¿Tú dónde escuchas tus podcasts?

Fuentes originales

Hilo completo en X/Twitter (mayo 2020)

5 años en CDMX: el año del debut

Fri, 15 May 2020 00:00:00 GMT

Escrito en el quinto aniversario de mi llegada a la Ciudad de México. Mayo 2020.

Estoy cumpliendo 5 años desde que llegué a la ciudad buscando el sueño chilango. Estos son los datos curiosos, las fotos inéditas y el primer capítulo de esa historia.

Era el 2015. Con 20 kilos menos y un par de abrigos para el frío. Un tabasqueño de 23 años decidía ser parte de un estudio de diseño recién parido: 23design.

Dato curioso: esas son las únicas tarjetas de presentación que tuvimos. El futuro era que nos siguieran en Twitter. Teníamos razón.

Llegué acogido por Lulo y finalmente entrenado por Fabs; algo así como mis Qui-Gon y Obi-Wan del diseño.

Dato curioso: tengo muy pocas fotos con Lulo. No lo había notado hasta que tuve que buscar y finalmente encontrar una decente del año pasado en LA.

Llegué con 23 años y unos meses después cumplí 24. Llegué sabiendo muy poco de la vida, asistiendo a mi primer concierto y teniendo mis primeras pedas serias.

Conocí personas como nunca en mi vida, en una cantidad de tiempo muy pequeña. El rush del primer año fue único.

El trabajo: aprender haciendo

El rush incluyó diseñar apps simultáneamente —entre ellas Bridgefy— entre Fabs y yo. Maquetar uno que otro sitio. Hacer uno de los primeros Design Sprints en México con un cliente de Sudamérica.

Dato curioso: en una de las fotos de esa época sale una versión del sitio de 23 que nunca salió a la luz.

La primera oficina

Nuestra primera oficina fuera del depa de Lulo fue un pequeño espacio de 5x5 metros donde cupimos hasta 6 personas.

Dato curioso: salimos en Canal 40 y ahí comenzó mi racha de encuentros con la prensa donde no salía o estaba impresentable. La leyenda cuenta que el video ronda en YouTube.

La Roma y el edificio chueco

Llegué a vivir en un departamento en la Roma, en un edificio chueco que siguió en pie después del terremoto de 2017. Eso me dice algo, aunque no sé exactamente qué.

2015 fue un año increíble y emocionante. El año del debut, el sueño. 2016 vendría con más aventuras y sobretodo tristezas.

Pero esa historia es para otro día.

¿Y tú cuándo llegaste a la ciudad que elegiste? ¿Qué fue lo primero que aprendiste de ella?

Fuentes originales

Hilo de 5 años en CDMX en X/Twitter (mayo 2020)

No le temas a la oscuridad de los Dark Themes

Mon, 10 Jun 2019 00:00:00 GMT

Estar frente a una pantalla por las noches o con malas condiciones de luz es una de las actividades que más cansan nuestra vista y que, sin embargo, cada vez son más comunes.

Después de todo nuestras mamás no estaban del todo equivocadas cuando nos regañaban por pasar demasiado tiempo frente a la televisión argumentando que “se nos podían calentar los ojos”.

Los programadores saben esto y desde hace décadas han encontrado una forma de combatir la vista cansada: evitar las pantallas con fondos blancos.

Alrededor del 70% de los programadores escribe código usando dark themes en sus computadoras, probablemente para soportar hasta altas horas de la noche y no sufrir cansancio en los ojos.

Es irónico que los mismos que crean el software que utilizamos trabajen con dark themes, pero para los usuarios comunes era una opción casi inexistente o poco utilizada, que cada vez más apps y sistemas operativos están abriendo para todos los usuarios.

Hace unos días Apple anunció la introducción del Dark Mode en iOS 13 y un mes atrás lo hizo Google para Android Q.

Sin duda, la disponbilidad de interfaces en dark mode va en aumento. ¿Qué lo está motivando y cuáles son los básicos para implementarlo en un proyecto de diseño?

De eso hablaremos en este post.

Ventajas de vivir en la oscuridad

La batería: una pantalla oscura, es (casi) una pantalla apagada

Retomando el tema de las pantallas OLED, se ha descubierto que el consumo de batería con pantallas más oscuras es menor al que las pantallas más blancas producen. Google habla de hasta un 60% de ahorro de batería en dispositivos con pantallas OLED.

Un caso notable es el de Twitter, que ha tenido un dark mode desde 2016, pero no es hasta hace unos meses que agregó una variante de su tema nocturno con fondos completamente negros, ya que el anterior usaba un tono de azul oscuro.

A primera vista, un fondo más oscuro podría significar más ahorro de batería, pero en la realidad la diferencia de ahorro en batería entre una pantalla completamente negra contra una oscura es muy pequeña. El efecto en la decisión que tomó Twitter probablemente sea inexistente.

La accesibilidad: no solo se trata de invertir los colores

Por años los sistemas operativos han tenido “modos nocturnos forzados” escondidos en las configuraciones de accesibilidad como la opción de invertir colores.

Para muchas personas no tener esa opción podría producirles dolores de cabeza o generarles problemas al tratar de identificar elementos visuales.

El problema con este modo es que invierte todo, incluyendo imágenes y colores, creando una sensación de estar usando un producto roto.

En cambio, el dark mode es un modo invertido consistente y estéticamente más elegante. Es un buen ejemplo de que mejorando las cosas para las minorías puedes hacerlo también para el resto.

¿Cómo diseñar un dark theme?

Una vez que entendemos el contexto por el cual existen los dark modes, seguramente tendremos ganas de hacer uno para nuestros productos digitales.

El reto más grande a la hora de crear un dark theme es escoger los colores correctos, tanto en las superficies de fondo como en textos y elementos de acentuación.

Te dejo unas sugerencias básicas para empezar a implementarlo:

Evita fondos completamente negros (#000000) con textos completamente blancos. Una buena combinación de grises se llevará bien con tu usuario. Incluso Apple usa diferentes gamas de grises en diferentes productos pero ninguno cae en el negro puro.

Ten especial cuidado con la legibilidad del texto. Un texto muy brillante (más cerca al #FFFFFF), es mucho más difícil de leer y tiende a cansar al usuario mucho más rápido. Como en los fondos, usa grises en lugar de blanco puro.
Juega con la analogía del día y la noche. En el caso de las ilustraciones, además de desaturar los colores, puedes agregar elementos como estrellas o nuevas fuentes de luz (como una lámpara) para recrear elementos nocturnos.

Por último, siempre dale al usuario la opción de desactivar el tema oscuro en tu aplicación, independientemente de la configuración de la plataforma para la que estás diseñando. Al introducirlo a la funcionalidad puedes incluso mostrarle que puede desactivarla.

Si bien, estos consejos son básicos, aún hay un vasto mundo de opciones que puedes aprovechar a la hora de crear un dark theme para tu producto digital.

En un siguiente artículo profundizaré más en la creación de un dark theme.

Google I/O 2019: El año en que Google Assistant se volvió imparable

Tue, 07 May 2019 00:00:00 GMT

Notas en vivo y reflexiones del Google I/O 2019. Mayo 2019.

Sundar no puede evitar hacer malos chistes sobre fútbol. Eso no cambia. Lo que sí cambió en este I/O fue la escala de la ambición de Google. Estas son mis impresiones del keynote.

El dolor más grande del Assistant: resuelto

El problema histórico del Google Assistant siempre fue la lentitud en su procesamiento de voz. La latencia entre que hablas y obtienes respuesta hacía que la experiencia fuera frustrante comparada con lo que prometía.

En este I/O lo arreglaron. Lo llaman Next-Gen Assistant, y en la demo en vivo era brutalmente rápido. Si Google ya estaba por delante del resto, con esto se puso 10x más adelantado. Se lo está comiendo vivos a todos.

Y como bonus: ya no necesitas decir "Hey Google" cada vez que necesitas al Assistant. La reducción de fricción en el comando de voz es enorme.

Google Search absorbiendo todo

Search tomará prestado funcionalidades de Google News y Google Podcasts. Nada revolucionario en sí mismo, pero la dirección es clara: Google quiere que la búsqueda sea el punto de entrada a todo su ecosistema.

Google Lens sigue siendo ese producto sin mucho foco que siempre sorprende. Esta vez con una nueva interfaz y funcionalidades para reconocer recibos, menús y recetas. Suena a texto inteligente bien ejecutado. Lo más interesante: también va a funcionar en Google Go, lo que significa que teléfonos de gama baja pueden acceder a esta tecnología.

Google Duplex —que el año pasado asustó a todos por lo real y natural que suena haciendo llamadas telefónicas por ti— ahora hará lo mismo pero en la web. Me pregunto si Duplex podrá romper dark patterns en formularios complicados.

Android Q: los detalles que importan

Hubo varios anuncios de Android Q que me parecieron más relevantes que el hype de los foldables y el 5G:

Live Caption: Subtítulos en tiempo real para cualquier audio en el dispositivo. Ya está en Google Meet, YouTube y Accessibility en Android. Simple y con un impacto de accesibilidad enorme.

Suggested Actions: Esos pequeños detalles que hacen la vida más fácil. Links bien interpretados según el contexto.

Dark Theme all the things: Por fin un tema oscuro oficial en Android. El auditorio lo celebró como si hubiera ganado la Champions.

Focus Mode en Digital Wellbeing: Apagar todo lo que no sea necesario con un tap. No solo para trabajar, también para dejar de trabajar. Suena muy necesario.

Controles granulares de privacidad y seguridad: Más control sobre permisos de ubicación, acceso a datos, etc.

El hardware: Nest Hub Max y Pixel 3a

Rick Osterloh subió al escenario y llegó lo bueno.

Google Home evoluciona a Nest

"Make your home a Nest." Toda la línea de productos del hogar unifica su nombre y branding bajo Nest. El Nest Hub Max es básicamente un Home Hub de 10 pulgadas con cámara integrada, listo para vivir en la cocina.

Lo más interesante no fue la cámara para videollamadas, sino los hand gestures: puedes interactuar con el Hub Max solo con gestos de la mano. Google da muchas razones para tener una cámara en el dispositivo más allá de las videollamadas.

Nada para México, como era de esperarse.

Pixel 3a: el Pixel para todos

Un Pixel de $400 dólares. La idea: "Make tech more available and accessible to everyone."

El Pixel 3a tiene Night Sight. Shots fired. Eso significa que la mejor cámara computacional del mercado en ese momento está disponible en un teléfono de gama media. Los primeros reviews fueron contundentes: "Hace ver mal a cualquier teléfono de $500 USD o menos."

Al parecer habrá Pixels "a" más asequibles cada año. Sueño de nuevo con que amplíen su mercado a México.

No MX. Fuck you Telcel.

El momento que me llegó más hondo

Al final del keynote hablaron de cómo detectan cáncer con inteligencia artificial, y cómo podrían salvar la vida de personas propensas a inundaciones. Mencionaron Tabasco, que en 2007 vivió una de las peores inundaciones en la historia de México.

Esos dos temas están muy atados a mi vida. Google sabe cómo llegar al corazón.

TLDR — Design details. Eso es lo que hace la diferencia entre un producto que funciona y uno que transforma.

Fuentes originales

Hilo en vivo del Google I/O 2019 en X/Twitter (mayo 2019)

Creando un podcast al estilo 23

Thu, 11 Apr 2019 00:00:00 GMT

Era una de esas tantas tardes en los HQ de 23 Design: palomitas, cervezas y pláticas sobre diseño entre varios miembros del equipo alrededor de la barra de la cocina.

La habitualidad de la conversación la había convertido en algo tan natural que por momentos olvidabamos lo valiosas que eran esas tardes.

De pronto, Fabian Luna soltó una de sus tantas ideas: ¿Y si compartimos esto al mundo?

Así surgió la temporada piloto

El jueves siguiente nos reunimos alrededor de la barra como era costumbre con una ligera diferencia: además de la botana habitual, había micrófonos, cámaras y una computadora.

Cada quien aportó lo que pudo. Lo importante era compartir al mundo el conocimiento y dinámica que casi cada tarde surgía en la barra de la cocina.

Así grabamos el episodio piloto, el que le siguió el jueves siguiente, y el siguiente. 2 meses después habíamos creado 6 episodios distintos hablando de temas relacionados al diseño.

Era el espacio perfecto para que distintos miembros del equipo dieran su opinión en temas que dominaban; desde lo que creíamos como diseño bueno o malo, hasta las cosas que considerábamos esenciales para llevar a cabo nuestras tareas como diseñadores.

Con el paso de los episodios y tras recibir feedback de quienes nos veían y escuchaban, hicimosla primera gran mejora visual y auditiva; para el sexto episodio estrenamos cámara y micrófono.

El cambio le dio otra sensación al programa. La Barra dejaba de ser un hobby y comenzaba a sentirse bastante seria.

Aprovechando las mejoras, también nos aventuramos a tener invitados expertos, por ejemplo, en un episodio nos acompañaron especialistas en Ciencia de Datos, quienes nos contaron todo lo que implicaba la Inteligencia Artificialy los errores que normalmente cometemos al hablar de ella.

En ese momento descubrimos el poder que los invitados nos brindaba y para la siguiente temporada nos dimos a la tarea de invitar más.

Si quieres revivir nuestra temporada piloto (que no te lo recomiendo, es doloroso para tus oídos), puedes reproducirla completa y con errores de origen en nuestro canal de YouTube.

Tras el éxito del primer batch de episodios transmitidos en vivo, decidimos llevar el programa a un siguiente nivel.

Era hora de darle forma al experimento con las mejores armas que un estudio de diseño estratégico puede dar: una marca y un plan de distribución.

Lo primero era aprovechar la red de amigos que el grupo podía proveer. Hicimos el llamado a amigos diseñadores, desarrolladores, inversionistas y hasta otros podcasters que quisieran hablar de diseño en el programa.

Nombres como Mono, Santiago Zavala, Yasmine Evjen, Thomas Lasch y Mauricio Angulo S. nos hicieron el honor de unirse a nuestra dinámica grupal para conversar sobre diseño.

Esto no solo nos ayudó a mejorar nuestra distribución fuera de nuestros círculos, también nos presionó para darle forma al programa y crear un framework que pudiera usarse en cada sesión.

Tener invitados no era un juego.

Como dato curioso, esa temporada tuvimos nuestro (por ahora) único episodio completamente en inglés. Recibimos la visita de Yasmine Evjen, Design Advocate en Google quenos contó sobre el trabajo de llevar la palabra de Material Design al mundo.

Ver la primer temporada oficial es menos dolorosa que la temporada piloto, pero igual te encontrarás con palomitas, vasos chocando con la mesa y una que otra risa destroza timpanos. Te recomendamos seguir con cautela.

También cambiamos la forma del contenido: dejamos las sesiones de una hora para grabar sesiones más largas que pudieramos partir en pedazos más pequeños (de 30 minutos).

Este nuevo formato lo llamamos series, con tres o cuatro episodios de un mismo tema enfocados en exprimir al máximo el conocimiento de los invitados.

Así fue el turno de hablar de temas innovadores en el area del diseño: Service Design, UX Writing y UX Research (que al final no salió por causas de fuerza mayor). De nuevo, grandes invitados e invitadas como VIVIANA TRUJILLO, Hernán Ortiz; Nora Tejeda y Gabriela Salinas.

Para cerrar la segunda temporada hicimos episodios especiales estrenando un set exclusivo para grabar podcasts, un par de micrófonos dentro de un cuarto sin eco.

La calidad del audio despegó a niveles que nunca esperamos llegar. Por fin estabamos haciendo justicia a las grandes conversaciones que teníamos, por ejemplo, cuando Jeduan Cornejo nos contó su vida trabajando en Airbnb y los retos que tiene al diseñar y desarrollar en una compañía global.

Aprovechando el nuevo equipo para grabar, decidimos que también era buen momento para mejorar la edición, agregamos intros y outros grabados en post-producción.

La cosa ya no solo era seria, comenzaba a ser profesional.

Como dato curioso en esta temporada, uno de nuestros más grandes fuckups fue tratar de revivir las sesiones en vivo sin un guión de por medio. No lo intenten en casa sin la supervisión de un guión amigos, hacer un podcast es más difícil de lo que parece.

Siendo oficialmente nuestro estreno en el mundo podcast, la segunda temporada se encuentra en todas las plataformas que existen para escuchar podcast. De todas formas, yo les sugiero que.

Tercera temporada: el lanzamiento

Así llegamos al 2019 y con ello, tres meses de producción de la tercera temporada.

La Barra ha evolucionado tanto que ya ni siquiera hay literalmente una barra de por medio, mucho menos palomitas y cervezas (bueno, esas sí pero calladitos); las sesiones ahora las grabamos completamente en un cuarto que adaptamos especialmente para mejorar el audio.

Parte de la evolución de la que hablo incluye un cambio sustancial en nuestro contenido. A partir de ahora tocaremos temas de la vida cotidiana, todos desde la perspectiva del diseño. Temas como movilidad en la ciudad, hasta videojuegos, pasando por la comida o eventos trascendentales como el #metoo.

Creemos que todo tema tiene en algún punto una intersección con el diseño, y en ese punto nosotros vamos a tomar el micrófono y hablar.

Desgraciadamente esto conlleva que dejemos de lado (por ahora) temas que habitualmente le interesan a otros diseñadores, cosas como interfaces de usuario, UX, portafolios, startups o cultura laboral, ya no serán parte.

Y aunque nos duele dejar esos temas, buscaremos una nueva forma de llevarlos a ustedes a través de otros canales que tenemos en 23. Manténganse al tanto de ellos siguiéndonos en nuestras redes sociales.

Para terminar y a un mes de cumplir 2 años, hoy estamos estrenando la tercera temporada del podcast.

No solo incluye una mejora sustancial en el audio (bug fixes and software improvements), también traemos el ya tradicional rediseño de la marca, nuevos host, nuevos invitados, nuevos temas, pero sobretodo la buena vibra con la que La Barra siempre se ha caracterizado.

Escucha el primer episodio de la tercera temporada a partir de hoy en la plataforma en la que te guste escuchar podcasts, estamos en todas (y si no estamos, mándanos un mensajito para arreglarlo).

* para no perderte nuestros episodios semanales.*

Quiero agradecer a todos y todas las que han sido parte del podcast (incluyendo a nuestros invitados) durante estos 3 años, no hubieramos podido llegar tan lejos sin ustedes.

Los mejores podcast de tecnología en español, edición otoño 2018

Wed, 26 Sep 2018 00:00:00 GMT

En inglés hay montones de podcasts increíbles y listas enfocadas diferentes temas. Desafortunadamente no encontré algo similar en español, así que recurrí a mis amigos en Twitter y como siempre, salieron a ayudar.

La lista está orientada a tecnología, venture capital, diseño de productos, desarrollo de software, blockchain, criptomonedas, SaaS, marketing y relacionados; por lo que si estás buscando otro tipo de podcast, tira un hilo y lo armamos.

Un agradecimiento grande a Danny Prol que aportó la base de la lista, prácticamente curada por él.

Sin más, te dejo la lista sin ningún orden específico, te sugiero que te suscribas a todos para no perderte ningún episodio.

Hack

Los hermanos Daniel y Santiago Zavala desayunan todos los fines de semana y platican de la vida, por años bromearon de hacer un podcast con esas charlas y por fin lo hicieron.

Daily

Un podcast diario sobre tecnología en general, Apple en particular, redes sociales, productividad personal y, francamente, cualquier otra cosa que me interese. Presentado por Emilio Cano.

La Tecnologería Entrevistas

Un programa donde hablan con personajes relevantes del mundo de la tecnología en general y de la informática en particular. Presentado por Pablo Trinidad y Frank Blanco.

PodKast de K Fund

Se auto-nombran el primer podcast en español sobre emprendimiento y Venture Capital. Hecho por el equipo de K Fund.

El Valle de los Tercos

Historias de latinos en Silicon Valley: emprendedores, inversionistas, ejecutivos tech y más.

Hijos de la Web

Un colectivo mexicano de creadores de contenido que une diferentes perspectivas y escenarios para opinar sobre temas de actualidad y entretenimiento, música, tecnología, programación, animé, libros, cine e historia.

Binarios

Conversaciones en torno a la tecnología con Angel Jiménez de Luis.

Diseño Cha Cha Chá

Conversaciones con latinos que trabajan en la industria de tecnología. Conducido por Pablo Stanley y Lumen Bigott.

SaaS Product Chat

Un video podcast que se enfoca en la creación, desarrollo y en el lanzamiento de productos Software as a Service (SaaS). Conducido por Danny Prol y Claudio Cossio.

Vostok 6

El podcast de las pioneras, mujeres que vale la pena que conozcáis. Dan a conocer a estas mujeres referentes para que veáis que las mujeres pueden llegar a dónde se lo propongan.

Mas Que Startups

Entrevista e emprendedores y diferentes actores del ecosistema de startups español. Alberto Molpeceres, Gonzalo Valverde y David Pombar conducen el programa.

Blockchain minutes

Sobre blockchain y cryptomonedas, centrado en la tecnología y los miles de usos que hay y habrá, dejando a un lado la especulación y los precios. Creado por Raúl Marcos y Pablo Ventura.

La Barra por 23 Design

Surgido de tardes entre palomitas y chelas dentro de 23 Design, La Barra se ha convertido en el podcast referido al hablar de diseño en México. Con invitados y amigos de compañías como Google, Airbnb, GBM y 500 Startups.

Platzi

Hecho por los chicos de Platzi con diferentes temas alrededor de la educación en línea y la tecnología.

Social FM Podcasts

Noticias semanales de Social Media y Marketing Digital para estar siempre al día. Hosts: Allan Vazquez Braverman y Angel Buendia C.

Ideas al Aire

Creatividad, tecnología y crecimiento personal fomentando la curiosidad y el desarrollo de tu potencial creativo. Conducido por Thomas Lasch.

Cromo.tech

Tecnología, cosas geek y más… en español latinoamericano, mexicano, chilango, y sus variaciones. Con Sergio López, Carlos Fernandez y Mr. White.

Tecnocracia

El podcast en donde hablamos acerca de los últimos temas del mundo de la tecnología.

Si tienes un podcast que te gusta escuchar y no lo ves en la lista, no dudes en mandarme un reply al tuit que ves abajo, con gusto lo agregamos a la lista.

¿Qué tal si hacemos una plataforma para hacer listas y playlist de podcasts para compartir? 😏

Material Design “2”: New approach, same foundations

Thu, 10 May 2018 00:00:00 GMT

4 years ago, Material Design was conceived to improve consistency for all Google products living across different platforms. But it wasn’t until third-parties put their hands on MD that they encountered a big flaw.

The important thing is that they don’t want us to copy Google’s brand. They want us to understand just how much MD can create amazing interfaces, without making us question if it’s possible or not.

There are no constraints anymore neither for the guidelines, nor for the tools.

There are principles, suggestions, and examples to avoid the trap and open a whole new world of possibilities.

Tl;dr: This isn’t different from what we got 4 years ago

But if you read the new guidelines carefully you will see that the core hasn’t changed at all. The paper abstraction is still there, elevation is still there, tint is still there.

They just reinterpreted of the old guidelines to be better understandable on how war every component could go using the Material Foundation and Material Theming.

Old guidelines focused on achieve consistency and stablished a series of rules to improve upon the Android platform.

New guidelines are here to break those chains in conjunction of several tools for designers and developers.

So, don’t ask designers and developers for a redesign of their apps with the “new Material Design”, there is no new MD.

You as a designer or developer can now explore together beyond the limits already stablished. You probably had some ideas on mockups that you trashed because at that time were going too far and there weren’t the appropriate tools to reproduce them.

Now it’s the time to recover those ideas and rethink again on how to express them.

What’s Material Design after all?

I’m completely sure Material Design is not just Roboto, or shadows all over the place, neither cards everywhere.

Material Design is about understanding constraints when building so you can rely more on brand choices to enhance a product made for real people (your users).

For me nothing has changed, we don’t have a Material Design 2.0, the foundations are the same, some components may have been updated but they are relying more on us to get the system beyond just a Google’s theme. They envisioned this since the beginning but failed to deliver because a lack of tools.

At the end, the biggest flaw of MD was it’s own building constraints. Yes, the idea was powerful, Dribbble and Uplabs got full of Material Design explorations, but terribly failed when developers tried to build those explorations.

The good news is to remember that Material Design is a philosophy that applies to everything, even the tools we now use for build.

What to Expect from Material Design 2?

Thu, 26 Apr 2018 00:00:00 GMT

With the Google I/O happening in less than 2 weeks, a few Google apps redesigned, new apps with a revamped design, a redesigned Chrome and the first developer preview of Android P out there, we are pretty sure on something: there’s gonna be at least an update on Google’s Material Design guidelines.

After taking a lot of information from the last weeks on Twitter, I want to share my findings, expectations, and assumptions with you until we hear something official from Google.

Not just a change for the sake of change

As far as we can see from the leaks there will be improvements in details instead of the philosophy itself. The new elements and properties of the existing ones will probably receive a facelift maintaining the paper and ink metaphor. Most of this changes are probably based on research Google did to improve the guidelines and probably Android (and Chrome OS) itself.

Let’s get into the details.

Moaar white space

The first thing you will notice from every screenshots is a white interface. Previously Google suggested the use of color to express branding through interface. Now they are embracing content using colors just when is needed. They want MD to rely more on typography than colors to manage information hierarchy. Even shadows seem to be used in a less drastic way.

This makes the interface cleaner and focused on content but losing some personality in the way. This could be balanced with the expression of other elements that can rely on that personality, depending on the brand of course.

Bigger corner radius

Lots of elements now have corners radius of almost 16 dp. Not only cards, but we are seeing more “pills” text-boxes and circles as buttons. Some had discussed around the perception of an iOS-ish style. For a user-centered perspective round corners and other similarities between platforms will help users get more familiar with a new UI when switching from one to another. In the other hand, this changes make Android loose personality against iOS.

Another argument in favor of the round corners are the studies saying that round corners are friendlier to users.

The only sure thing is that round corners are here to stay, so we will probably need to accept and get used to if we don’t like them.

Some users also spotted rounder icons so it probably means a new set of icons but there isn’t too much on it yet so I will skip on this one.

Brighter and low-caps buttons

The most consistent element on every redesigned app are the new buttons. The most obvious differences from the near-to-be old buttons are the low-caps style and also the use of Product Sans instead of Roboto as the typeface.

My favorite new detail so far is the colored shadows depending on the color of the button. As you can see on the Chrome redesign guidelines when the button is blue, the shadow is blue, when is white, then the shadow is gray.

Refined colors

There are also rumors on a refinement color palette. We got a view on the settings menu from Android P DP1. There were also some leaked commits on the Chromium Gerrit mentioning new colors. The colors were close to what it is on DP1 but not perfectly matched so they are probably still tweaking them.

I’m very excited to see more bluish grays than yellows. In terms of usability, they will probably tweak the palette to work better for contrast.

As I mentioned before, the interface will rely more on this colors for contrast on a white surface.

Titles at the center of the toolbar

This is another change that resembles iOS.

We are seeing the title or logo in the toolbar going from the left to the center. You can see it on new apps like Google Pay and Google Tasks. I’m guessing it is because of the change in the position of elements on the status bar on Android P (probably because of the clock at the left). To maintain visual balance between all elements, the most prominent element needed to take to the center.

Bottom navigation pattern?

The only reference we have is on the new Google Tasks app but it’s probably one change we will see more. It resembles a lot to the old Holo days when we had action icons at the bottom of the screen.

In terms of ergonomics is perfect for the user. All the main actions at the bottom (also applied to bottom navigation bar) is a very friendly pattern to the fingers.

There’s also something weird about having two menus here. Yes, one is navigational (left) but it still not intuitive enough to differentiate one from the other.

Just like the FAB, obvious always win.

A new approach to FABs

Talking about the FAB. This is one is the trickiest and the funniest. We saw a lot of approaches on FABs in the latest years. We were very excited about this one. A big circle button showing the user what’s the main action on the screen? It obviously going to work!

But no, it wasn’t that obvious. First, if the user had other elements on the screen to play with, the FAB loses all the relevance. Then if the icon weren’t self-explanatory enough, the user get confused on what the FAB will end doing.

Lot’s of pain to the user for an ambiguous element so we should expect more defined rules on where, how and when to use FAB buttons. From all elements, this is the one I’m more excited to now more about.

Other components

Selected item from the menu

First spotted on Chrome OS, then on some Android apps. On menus, the selected element was previously just highlighted with a plain rectangle. Now, they also have a rounded side. It works pretty well on a aesthetic perspective. The rhythm of the list now merge better with the section itself without being drastically cut.

Segment controls for Android?

On the onboarding to the new Gmail, I spotted an element that is not showed anywhere else, some kind of selector far different from tabs on current MD but very similar to iOS segmented controls. This could be an exception and the Gmail team just added it because it doesn’t exist but it will be interesting to know what treatment and differences from tabs will have if it even exist.

Less width for tabs

The only aesthetic change without being specifically attached to a functionality is the new small tabs signifiers. The only main difference from the old ones is that they don’t cover the entire width of the tab target.

This was an approach that other products take but with the new Google personality, I think it fits better.

Product Sans everywhere

Last but not least, let’s talk about typography.

There are two main places where we see Product Sans on Google products: titles and buttons. Every other part of the UI still gets Roboto.

They will probably don’t suggest to use Product Sans for third-parties because it still have a limited license use. I will be a surprise if they free it in Google Fonts.

We can expect more rules on using and combining two different typography for third-parties.

Conclusions

I’m on the side that think is good for Android get closer to iOS in terms of feeling and usability. It has a lot of good things for the users. I wrote about it last year, both sides are getting closer and closer and we will get used to it at the end. Remember, is not about Google vs Apple, is about the user, it is always about the user.

We will see more when they explain us at Google I/O. The session I expecting more is the one they will show “how UX researchers helped test, refine, and evolve the latest Material Design guidance”.

There’s always a reason behind every decision and I’ll be happy to see them and also inspire them for my own work.

Thanks for reading!

If you want to contribute to the conversation or think I miss something from the leaks, feel free to comment.

All the info I get came from awesome tweets of the Android community on Twitter. I want to thank you all the guys that report every change on every Google product.

I will put all the links below if you want to read more.

Why Less Features Mean More Value

Tue, 31 Oct 2017 00:00:00 GMT

You are in the shower one day and you come up with the greatest feature ever. You design it, code it, ship it. The next week you have another great idea, you design it, code it, ship it; you keep shipping, shipping and shipping…

The temptation is real. More features mean happier users, right?Well, not really.More features usually mean more unnecessary complexity.

My team and I had the task of redesigning *, *an app that had been around for 2 years and had already gained thousands of users.

We worked closely with them to plan and create the first iteration of their redesigned service.

We faced several challenges during the process but the hardest one was going back to basics and focusing on the main use case, sending and receiving money, and getting rid of the rest.

Here’s how we did it:

Focus on one big thing — and just one

At 23 Design, we prioritize features based on real use cases. For Swap, we knew that people were already using the app for things like splitting a restaurant bill or tallying expenses between roommates.

So we kept those scenarios in mind as we started to design, starting with the interface.

We redesigned the main screen, putting the action of sending money front and centre.

Any other features, like including analytics or physical payment options, were discarded.

Simplifying while keeping users safe

There’s a minimum amount of things to ask in registration forms and there’s always a way to support them, but avoid noise in the process is to understand the context that involves forms.

Every Swap user can only register one device per account for security reasons

That constraint gave us the path to choose number based accounts with a gift: a simple registration form.

We were able to maintain the unique device restriction and also subtracted one important input from the flow.

A complete win for the user!

Asking the right things at the right time

My mom used to say: “everything has its time.”

Asking the user to do something a little different than than what they’re expecting can be irritating and sometimes scary.

Our approach is something we like to call “the right moment”, we only ask for the user’s input only when it makes complete sense to them, without even having to explain it.

This applies when you are asking for payment info. We didn’t ask for it at the initial form, that would be ruthless even for a financial app.

We ask for it when the user naturally understands the process: just after setting up their first transfer when they’re ready to send it.

A happy accident: simplifying other use cases

As designers we get surprised by our own decisions, even when we’ve made them many times before.

As a consequence of making the right decisions while designing the onboarding experience, we discovered we had simplified the amount of steps the user has to take on a second use case.

Transferring money when everything is set up correctly is a whole lot faster.

It now takes only three steps!

Remember: listen to your users

Creating a clear unique path, being resourceful, making transparent decisions and trusting your process. Doing all that with the users in mind will ensure the success of your product.

Now that the new Swap is out, getting real data from users will help us better understand our future options.

Our next challenge is to understand the evolution of the product and translate it into features while keeping it easy to use.

Until the next one!

Los Diseñadores invisibles

Tue, 21 Feb 2017 00:00:00 GMT

—¿A qué te dedicas?

—Soy diseñador.

—¿De qué o qué?

—Diseñador de interfaces.

—Ah, de páginas web.

—…

Para este punto de la conversación, comenzaba mi misión evangelizadora de explicar lo que hago en la vida. Sin embargo, sin entender bien las razones, terminaba fallando.

Desde una perspectiva general, no es difícil imaginar lo que hace un médico o lo que hace un físico nuclear.

Entonces, ¿cómo es que los demás no podían entender lo que hago? O mejor dicho: ¿Cómo es que yo no podía explicar algo que para mí era tan obvio?

“If you can’t explain it simply, you don’t understand it well enough.” — Albert Einstein

Cuestión de enfoques

El problema es que estaba abordando una respuesta desde el enfoque equivocado.

No era hablar de un diseñador de interfaces, diseñador de interacción o diseñador de experiencias, era explorar el concepto del Diseñador con D mayúscula.

Diseñadores que observan constantemente a su alrededor. Que comprenden el funcionamiento bajo la observación. Que se adaptan para explotar esa comprensión. Que detectan patrones en comportamientos. Que leen de diferentes temas y se cultivan de diferentes culturas.

Diseñadores que piensan en soluciones para ese entorno que observan y en el que pueden adaptar ideas que divergen y convergen, no sólo por sí mismos sino con sus semejantes.

Diseñadores que no precisan una sola disciplina. Que requieren de un conocimiento suficiente de muchas otras para acercarse con mayor claridad a la solución de un problema desde un pensamiento crítico.

Lo invisible

El pensamiento crítico de un Diseñador es una cualidad que pasa desapercibida. Sea una página web, un anuncio gigante con una manzana o una silla de madera. El alcance hacia el proceso es invisible y la visión se reduce a las ejecuciones visuales.

El mundo ignora los detalles, las decisiones que se toman detrás, los conceptos aplicados.

Que, para aclarar, no es necesariamente malo.

Si una persona disfruta usar un objeto, ignora por completo las razones; pues sus sensaciones son naturales y por tanto invisibles desde su perspectiva. Lo que normalmente es resultado de un buen diseño.

Pero es justo ese lado invisible del diseño lo que vuelve tan complicado para los demás comprender lo que hacemos.

Para los ajenos es dibujar cuadros por dibujar, es poner un logo en el centro más grande para que se vea más, es decidir el color de la madera más allá de su forma.

Un todo

Una cosa que he aprendido entre diseñadores es que explicar el proceso es complicado sin el contexto adecuado.

Es más bien llevar las conversaciones hacia las razones por las cuales el proceso funciona como un camino para llegar al resultado final, sin expresarlo como algo ajeno.

Es explicar el diseño como un todo, convirtiendo lo invisible en una simple obviedad.

Omar es Fellow en 23 Design desde 2015. Invisible para algunos, especial para todos los demás.

One Design Framework to Rule Them All

Tue, 24 Jan 2017 00:00:00 GMT

It’s common to hear iPhone users say that Android is difficult to use. It’s true. But, and this may shock you, the reverse is also true — when an Android user tries an iPhone for the first time. We expect natural behavior when interacting with our phones and when that behavior is different from what we expected, we get frustrated.

We call these ‘natural behavior’ patterns, and they help users with the hard job of understanding an interface. Every platform has it’s own patterns and the melding-together of these patterns forms design guidelines, which differ from each other depending on their user behaviors.

But that’s changing. We are reaching a point where different mobile patterns are getting closer to convergence regardless of platform.

I’m not saying mobile platforms will be identical in future. They will still look different from one another, but, in the end, feel and work the same. How do we will get there? Let me tell you a story that not many people know and some have even forgotten.

The rise of the “iOS killer”

As you may know, by 2008, there was already a challenge to reinvent the iPhone and it was divided on three fronts. Some wanted a quality device, others, a capable OS and others, a deep connection with the user. One thing connected all three: user interface.

Since then, we keep seeing attempts to approach the perfect mobile interface — the ultimate unified system — for every digital device out there. One of the first was Matias Duarte (former Palm’s VP of Human Interface and User Experience).With one forgotten platform they were close to really competing with iOS: Palm’s webOS.

Palm webOS didn’t just introduce new visual interface aspects, but also new patterns for a mobile platform that was in diapers. Matias Duarte and his team were nailing it. Until Palm was bought by HP, stopping them in their tracks, reducing the platform’s possibilities for expansion and making Matias moved to Google.

Matias started a complete revolution at Google pushing Android into a new era. Interface patterns, cards navigation and a formal Floating Action Button (the big rounded button) that were introduced with webOS, were made official with Material Design. Design guidelines to make beautiful and consistent apps between not only one platform, but every platform. The ultimate unified system.

“The whole point of consistency (and conventions) is to make it easier on users to understand and use things.

Design guidelines are there to help you understand them, especially if you’re not from around here.”

— Matias Duarte, 2013.

A Maturing Platform

Last year was a new chapter in Material Design life and, with the whole designer community using it, it’s now reaching maturity. Designers are, by now, completely aware of the limits of the platform and they are expanding the frontiers with new ideas without damaging the experience and soul of the platform. After all, they were just guidelines.

Matias Duarte’s team was expecting this since the beginning. It was a natural step for the platform and they embraced it as an opportunity to improve the platform. The new chapter was official when the Material Design team launched material.io.

What’s next?

As Google did with Material Design, seeing platform patterns as tools, completely changes the way we see and use them. Like a normal pencil and a pen, two objects that are used to write and draw on specific surfaces. The difference between them are their patterns. You can erase what you draw with the pencil, but the pen gives you a more solid line. Choose wisely one pattern from both objects, put them into a single object and you get a pen with an eraser, an improved object.

This is not just about iOS or Android, both platforms have evolved in their own way and are constantly learning from each other. You can take the best from both and adapt it to do something better. The evolution will continue for sure. One day, we will have the option to make one design for all of them. Until then, keep adapting.

—

Side-note: The logic path (when having small budget with short time), is launching the product with the same design (and engineering) on every platform. It is tempting to have your product everywhere and ready with low costs, but that might hurt you in the long term. My advice would always be to prioritize one platform over the others, depending on your needs. I also still believe, despite the above, that if you can launch on both platforms, it’s imperative to adapt your product to each of them.

The path to becoming an inventor

Tue, 26 Jul 2016 00:00:00 GMT

A few weeks ago, I celebrated my first anniversary working at 23. Since then, a lot of things have been really different in my life. I mean, it’s not just my first year here, but also the first time I live in one of the biggest cities in the world, and the first time I work from almost the beginning to create one of the most recognised design studios in Mexico, where I meet new people everyday, create stuff and make strategy — or the way my inner child likes to call it — being an inventor.

My personal definition of “inventor” has changed over time. As a child, I used to think there was some kind of professional career to become an inventor, you know, the ones that make fun stuff like robots and flying cars. When I grew up, I realised that people who build real things were actually engineers. But now, after trying many times, I’m not trying to become an engineer anymore. When it comes to design, I’m all in. It lets me invent things but on a whole different level. But why did I change my mind from becoming an engineer to pursuing a more idealistic, artistic career? Let’s go back to the beginning of the story… about 15 years ago.

Episode I: Hello World!

It all began with the blessed childhood my parents gave my sister and me. They always tried to give us the best education they could as a low-middle class family. They rapidly discovered my fascination for computers and how easily I was able to understand them. My parents always wanted to encourage me so they enrolled me in a computing course, even though just a few people in my town where interested on the topic.

And there I was, a 10 year old boy with some guys in their 20’s and 30’s, building computers and installing operating systems. As a child, I learned faster than them, but the important thing was that I realised that I was completely in love with technology and that I wanted to invent things related to it.

After some years of learning a lot on PCs, I touched the limit of the platform. I was in high school when the mobile platforms were trying (without great success) to fit into our lives. By 2006, one year before the iPhone appeared, I had a basic Sony Ericsson phone with Java as the main system platform (very different from the ones right now), and, as you might expect, I played a lot with it, adding functionalities to the phone but more importantly, playing with the visual stuff on the system: themes and images. Without knowing it, I was already designing a personalised experience on my personal device.

Episode II: When you just don’t fit in

By 2009, I was deciding my professional future with some personal confusing episodes and family money issues. I wasn’t clear on where to improve my skills, but because of those issues, my final decision was to study Electronic and Telecommunications Engineering at a new university near home, a small school with some (not very clear) ideas on how to be different. It was good at the beginning but after some months I entered into a rush of few empty years.

Discovering that I not only knew how things worked but also why they worked, better than anyone in the same building, even the professors — the ones that were trying to help us have a brilliant future — was a revelation. Everything around me felt boring, senseless, out of place. It took me time to understand that if I wanted to do something meaningful, I had to move on or else I would feel like a T-rex trying to reach food with its small arms. My first thought was that I needed better tools to continue learning and creating, so I dropped out of school.

My next target was Queretaro. I had heard nice things about the city, such as rumors of its developing tech industry. So I gave both the city and myself a new chance. This time, I tried something closer to my past experience: Software Engineering. I thought it would be a new beginning: new people, new mentors, and a real approach to the industry. But they said no. They told me I didn’t fit in. And I believed them so much that I didn’t even apply to another university.I was very scared, but after all the drama, I made a choice: try to get a job in the tech industry without a professional career. The remaining question was how to achieve this.

The first thing I needed was a portfolio, but a product portfolio meant that I needed to design a product. Trying to create something new would be very difficult without ideas, so I decided to redesign a product that already existed, built by someone that also lived in the same city. So I chose one product from his portfolio and started on it, learning the basics about design in the process.

After a month of work, the product was completely redesigned. I visited the guy in his own development agency, showed him the project and I must say, he was amazed but a little bit confused about my reasons. My lack of experience in the industry blocked me from getting the job in the end. That was my second big life failure in less than two months, but this time I got the message. I felt completely different, as if all the work I did really had a big impact on me. The solution wasn’t to get better tools: the tool was in me all the time. I didn’t get the job, but I did get a full understanding on how to design a digital product and the best part, I enjoyed every part of the process and I felt I could design anything in the world. That’s when I realised how the worst day of my life showed me to use my T-Rex mouth with big teeth instead of my little arms.

Episode III: Sprinting a design studio

Sometimes you have to make decisions just because you know it’s time. Months after the events in Queretaro, I moved to Merida, dedicated entirely to learning more about design, and working as a freelancer. Even if I knew that I wanted to be a designer, I decided to keep trying with engineering, thinking (foolishly) that I could do both things at the same time. I applied to a new university, and received approval this time. But then, one happy accident on Twitter changed my life completely.

Lulo, a guy that didn’t know me more than from just a few freelance jobs I had done for him, offered me to participate on his new project in Mexico City. He wanted Fabian Luna and me to be his team, helping others reach higher levels, with design as the main tool. I just needed to say yes, drop out of school again, leave my family, my entire life and everything I knew behind. That was the hard part, but the moment he offered the job, I decided without thinking. All I wanted was to become a real designer, a real inventor.

So I made the trip and after a few weeks I realised how every piece of the past fitted in my everyday work. The code, the logic, the deep understanding of computer systems, all those things I learned before, finally led me to design. But even more importantly, understanding that design is not just about moving pixels but about making top level decisions. All the things that didn’t make sense to me in the past were because I wasn’t designing at all, I was taking decisions on a small scale, not caring about the important stuff at the top level.

Now, over a year later, three failed attempts at engineering careers and more than twenty amazing projects later, I still feel like it’s only the beginning. Knowing how things work is just a small part of the whole view. I code sometimes just for fun and not to forget, but my main path is design, trying to reach the top levels of design strategy, and learning everyday from the best in the industry.

The rest of the story is in the writing right now. The path is long. Who knows where or how will end. All I know is that even when your brain has doubts, it’s very easy to follow your inner child’s dream, like me wanting to be an inventor, it lets you know when you are on the correct path.

Así diseñamos UI para Android con Material Design en 23 — Parte 2

Wed, 13 Apr 2016 00:00:00 GMT

Notas preliminares: Esta es la segunda parte de la serie de posts enfocados en Material Design para Android usando Sketch, la aplicación que usamos en 23 para diseñar interfaces. Si aún no has leído la , te recomiendo hacerlo antes de continuar.En esta parte hablaré de los elementos básicos para diseñar apps: colores, tipografía, iconos y componentes nativos. Todo esto en conjunto será una guía para quienes quieran iniciar o mejorar sus habilidades para diseñar Android en Sketch.

“We used Material’s principles as a guide rather than strict rules that must be followed to the letter.” — Fyza Hashim

Colores

En Material Design, los colores son el punto de partida para implementar el branding sin limitarse a elementos como el logo, además son la mejor forma para diferenciarse de otros productos dentro de la plataforma misma.

Aún cuando tu producto no tiene colores definidos, es muy fácil seleccionar unos con la paleta de Material Design. Google recomienda limitar la selección a tres tonalidades de la paleta primaria y un color de acentuación de la segunda paleta (los colores que comienzan con A).

Naturalmente existen otras soluciones, como la que propone hannah lee clonar la paleta directamente en los colores globales de Sketch para tenerlos listos en cualquier proyecto. Al final, lo importante es tener una paleta de colores bien definida para tu producto y poder trabajar libremente con ella.

Tipografía

Desde 2011, cuando Android 4.0 Ice Cream Sandwich fue lanzado, la tipografía en Android tomó una relevancia mayor. Roboto sustituyó a Droid Sans como la tipografía del sistema, marcando el inicio de una nueva era en el diseño para la plataforma.

“The baseline grid and scale recommendations within material design still apply, regardless of the typeface.” –Google Design

Como ya sabemos, los elementos visuales se acomodan en retículas basadas en cuadrados de 8dp. La excepción a la regla la tiene la tipografía que se alinea a grillas de 4dp. Esto significa que los espaciados entre párrafos deben basarse en múltiplos de 4.

Al no ser un experto en tipografía trato de apegarme al máximo a este tipo de reglas. El truco consistente en tener una guía de estilos tipográficos basados en los que da Material Design y modificarlos con la tipografía del producto. Una vez definida te darás cuenta lo fácil que es aplicarla en un producto.

A continuación les dejo algunos enlaces que profundizan más en el tema, sobre todo en cómo explotar al máximo el uso de tipografías en cualquier plataforma de diseño.

Iconos

La iconografía en Material Design conlleva muchos aspectos. En este post les cuento de 2 de los más importantes: definición y exportación. La parte “fácil” es la primera, la parte confusa es la segunda. Las diferentes densidades de pantalla en Android no ayudan a dejar esto claro, pero yo les ayudaré con eso.

En la fase de definición entra a escena The Noun Project, un sitio que comenzó como un proyecto para recopilar los iconos más comunes y que ahora, logrado su objetivo, es un repositorio de iconos de todo tipo. En 23 esta plataforma nos sirve más para referencia que para obtener los íconos, algo así como las búsquedas que haces en Google Images para asociar palabras con imágenes.

Normalmente, cuando los productos que diseñamos necesitan iconografía especializada recurrimos a paquetes de iconos o, en casos muy raros, iconografía diseñada por nosotros mismos. Si el producto no necesita iconos específicos usamos los que Apple y Google proveen para sus respectivas plataformas. Esto da algunas ventajas, como que la librería de iconos de Google te permita descargarlos listos para ser usados en el desarrollo del producto.

Por otro lado, si usas un paquete de iconos diferente o creas uno propio, debes exportarlos para que el desarrollador pueda usarlos en su proceso. Para eso recordemos un poco las densidades de pantalla en Android y sus tamaños.

La unidad base es MDPI, el equivalente a los assets 1x de iOS. Después, las medidas que nos importan actualmente son HDPI, XHDPI y XXHDPI. Es importante saberlo porque estos son los tamaños en los que exportaremos los iconos.

Una de las opciones para exportar es Android Asset Studio, una herramienta también desarrollada por Roman Nurik. No sólo sirve para exportar de forma correcta los iconos sino para hacer adecuaciones a sus tamaños y proporciones. Si aún trabajas con iconos 9-patch (please, stop!) también incluye una herramienta para crearlos de la mejor forma posible. La desventaja es que hay que trabajar icono por icono, además de que en algunas cosas ya se está quedando atrás.

En 23, la primera opción para entregar proyectos a los desarrolladores es Zeplin. Hasta ahora, es la mejor forma que hemos encontrado para exportar assets en diferentes plataformas (si conocen alguno mejor, no duden en dejar un comentario).

final_final_este_es_el_bueno_02_01_con_detallitos.sketch

Diseñar Material Design tiene su lado especial. Contrario a lo que se cree, el conjunto de reglas que abarca este framework visual no limita en absoluto al diseñador. Fue hecho para ser flexible y abierto, ayudando a mantener cohesión con base en fundamentos que cualquier diseñador debería tener en cuenta. Antes de llegar 23 sabía las reglas, pero fue aquí cuando realmente comencé a explorar su potencial.

Ahora es tu turno, los siguientes pasos van por tu cuenta. Pero si hay algún tema en específico que quieras que profundice, no dudes en preguntar.

¡Hasta la próxima!

No olvides visitar 23 Design para conocer más de nosotros.

Así diseñamos UI para Android con Material Design en 23 — Parte 1

Wed, 25 Nov 2015 00:00:00 GMT

Sketch es fantástico. Como diseñadores de productos digitales, se ha convertido en nuestra herramienta básica; el lápiz y papel del día a día. Lo amamos porque fue hecho precisamente para diseñar productos digitales, tanto el tradicional iOS como Android (novedoso para muchos diseñadores), así como la siempre amada-odiada web, por supuesto.

Ya sea que seamos diseñadores, desarrolladores o ambos, la idea de Sketch es facilitar la tarea al momento de crear prototipos en nuestro flujo de trabajo. Para lograrlo, configurar el entorno es esencial. La personalización ayuda a evitar que acciones simples retrasen el cumplimiento de tareas.

La idea con esta serie de publicaciones no es explicar la filosofía detrás de Material Design, sino cómo ejecutarla en un entorno óptimo entendiendo los conceptos clave. Un entorno que en 23 fuimos definiendo en los últimos 6 meses y que me gustaría compartir. Sugerencias (y críticas) al sistema son bienvenidas.

La cubeta de Legos

De entrada, Sketch incluye algunas herramientas útiles para diseñar en Android. La primera y más importante es el stickersheet que aparece como template desde Sketch 3.3. Este stickersheet es el mismo que Google brinda desde la sección de Material Design y contiene prácticamente todos los componentes nativos, incluyendo grillas, tamaños, estados, estilos… Casi todo.

Para abrirlo es necesario ir a File → New From Template → Material Design. Verán que también existe el template Android Icon Design, del que más adelante platicaré.

Es importante poder copiar y pegar elementos para ahorrar tiempo; por ello, hay que tener abierto el template y el proyecto simultáneamente. Es como si tuviéramos una cubeta de Legos para construir una nave espacial. Además es útil para consultar rápidamente las guías visuales más básicas de Material Design (como sombras, espaciados o tamaños de los mismos componentes), sin tener que entrar a ellas.

Para los desarrolladores Android, muchos de estos elementos se crean usando Android Design Support Library, mientras que en web se utiliza Material Design Lite con elementos material. Aquí unos enlaces para saber más al respecto:

Artboards y unidades de medida

Continuando con la integración nativa que Sketch ya tiene con Material Design, nos encontramos con los artboards *(Insert → Artboard). *Dentro de la lista tenemos la sección Material Design que cubre 4 diferentes tamaños de pantalla: teléfonos con 360 x 640 dp (Sketch lo maneja en pixeles, ahorita explicamos la razón), tablets de 7 y 9 pulgadas y aplicaciones de escritorio.

Hagamos un paréntesis para explicar los pixeles de densidad-independiente (DIP o DP). Son el equivalente a los puntos en iOS y es la unidad de medida fundamental en Android. Fue creada para estandarizar una forma de medida, ya que Android tiene una gran cantidad de pantallas con densidades de pixeles muy variadas.

“Measuring and sizing things in DPs ensures your designs have a consistent physical size across devices of varying density.” — Google Design

La definición matemática es simple: 1dp = 1px @ 1x (donde 1x en Android es 160 dpi; la base). Es muy importante tener esto en cuenta al exportar assets (más adelante los detalles).

Una vez que conocemos la equivalencia de 1 dp, podemos saber el tamaño de las pantallas de cualquier dispositivo en pixeles de densidad-independiente:

dp = (tamaño en pixeles * 160 (1x — MDPI) / densidad de pantalla (1x, 2x, 3x…).

¿Y qué tiene que ver esto con los 360 x 640 dp que Sketch nos provee? Pues ese tamaño cubre la mayoría de los teléfonos actuales. Esto quiere decir que, aunque tengan diferentes tamaños, píxeles y densidades de pantalla, todos comparten la misma cantidad de dp en ancho y alto. Hagamos las matemáticas para comprenderlo mejor:

Moto G: (720 x 1280 px) * 160) / 320 dpi (2x — XHDPI)= 360 x 640 dp

Nexus 5: (1080 x 1920 px) * 160 / 480 dpi (3x — XXHDPI) = 360 x 640 dp

Galaxy S6: (1440 x 2560 px) * 160 / 640 dpi (4x — XXXHDPI) = 360 x 640 dp

La conclusión es que, sin importar el tamaño físico de un dispositivo, la relación entre los pixeles reales y su densidad determina el tamaño que tendrá cualquier elemento en Android.

Aquí algunos enlaces para mayor información del tema:

Grid base y líneas clave

Una vez que tenemos un artboard, es hora de sacar las reglas y escuadras para no perdernos en el diseño e implementación de componentes.

Uno de los mejores trucos para tener en cuenta, es la regla de los múltiplos de 8. Consiste en basar todas las medidas del diseño en múltiplos de 8 (con excepción de iconos y tipografía). Así nuestros grids serán de la base 8dp (pixeles para Sketch).

Hace unos meses, en 23 diseñamos la app de Toky para Android. El perfil de usuario es un buen ejemplo en el uso de esta regla. Las líneas clave marcadas en rosa (16 y 72 dp), están basadas en el grid de 8dp, creando la atmósfera natural de una aplicación nativa en Android.

El grid de 8 dp se establece en las configuraciones de Grid, a 8 px por bloque y sin líneas gruesas (View → Canvas → Grid Settings).

Además del grid, también es necesario configurar las líneas clave (keylines) que nos servirán para diseñar layouts complejos, por ejemplo, listas. Las reglas de Sketch permiten agregar líneas guía fijas.

Activamos las reglas desde View → Canvas → Show Rulers.
Posando el puntero sobre las reglas agregamos tres reglas verticales a: 16dp, 72dp y 344dp (360–16).

En estos enlaces encontrarán más información de las líneas clave, el grid base de 8dp y una app fantástica que todo diseñador Android debe tener en su teléfono: Keyline Pushing, que traza grids encima de cualquier app que tengas instalada. Es excelente para analizar y probar diseños.

¡Fantástico! Ya tenemos nuestro lienzo listo para recibir amor.

En la segunda parte de la serie puedes conocer más a fondo sobre colores, tipografía e iconografía.

Google I/O 2014: el día que Material Design cambió todo

Wed, 25 Jun 2014 00:00:00 GMT

Originalmente publicado como hilo en X/Twitter. Junio 2014.

Era junio de 2014 y el Mundial de Brasil tenía a todo México paralizado.

Para mí era diferente. Tenía dos Mundiales ese mes.

Mi otro Mundial

La noche del 24 de junio empezaron a filtrarse los primeros videos de Google desde San Francisco y escribí sin pensarlo:

"Se van a ir filtrando videos de Google desde estas horas en adelante. Desde este momento hago stand-by al Mundial por el Google I/O."

Y antes de irme a dormir:

"A dormir porque mañana hay Google I/O desde temprano. Les tendré los dos días llenos de ello, mi otro Mundial."

La neta, así se sentía. Google I/O pesaba igual que un cuartos de final. Quizás más.

Diez segundos

El 25 de junio, a las 11 de la mañana hora de México, estaba con el stream abierto y el feed de Twitter corriendo en paralelo.

"7 minutos para iniciar, aquí sus links para ver el partid... Google I/O #io14"

El lapsus era intencional. Había un partido de Brasil ese mismo día y en mi cabeza los dos eventos competían exactamente igual.

Y entonces, justo cuando el keynote estaba a punto de comenzar, el universo mandó una señal:

"Messi anota a 5 minutos de que el Google #io14 comience... Es una señal."

"10 segundos... Está por empezar. #io14"

Maestro Matías Duarte

Sundar Pichai abrió el keynote. Android One. Los números. Y luego subió al escenario alguien que para mí ya era un ídolo.

"Maestro Matias Duarte :´)"

Pues sí, la carita llorando de emoción. Matías había rediseñado Android desde Ice Cream Sandwich. Holo era su creación. Para los diseñadores de Android que seguíamos esto de cerca, era lo más cercano a un ídolo que existía en el ecosistema.

Y entonces dijo la frase:

"Design define your experiences and emotions." —Matías Duarte

En ese momento apareció Android L en pantalla.

Android L es malditamente hermoso

No tuve que pensarlo:

"Android L es malditamente hermoso."

Lo que veíamos no era una iteración de Holo. Era otra cosa completamente. Superficies con masa y física real. Color usado con intención. Animaciones que no decoraban el movimiento sino que lo explicaban. Un nombre: Material Design.

"Ya se ha lanzado material justo ahora sobre diseño."

El spec completo disponible en ese momento para leer. Un libro de texto que cambiaba las reglas del oficio.

"Material Design estará en todos los productos de Google, todos."

Todo en todas partes

El keynote no paró en Android.

Android Wear para la muñeca — SDK disponible ese mismo día. Me fui con el Moto 360 en mente desde el primer minuto. Android Auto para el carro, diseñado en contexto. Android TV con una interfaz que llegó de sorpresa: "una especie de Material Design con CardsUI con Now con WOOOOOOOOOOOOOOOOOOOOOOOOW."

Y el anuncio que nadie esperaba: apps de Android corriendo en Chrome OS.

"¡Chrome OS y Android juntos! BIIIIIIIIG EXPLOSION #io14"

Material Design no era solo el look de un teléfono. Era la gramática compartida de toda una plataforma.

Las sesiones: haciéndome experto

Terminado el keynote comenzaron las sesiones técnicas. Y ahí empezó la parte buena: los detalles.

Switches que comunicaban más información. Grids para los íconos, por fin. Nueva paleta tipográfica. El teclado, hermoso en su nueva versión. Notificaciones con tres niveles de privacidad. APIs para animar íconos.

"Entre más conozco de Material, más me enamoro de él."

Solo una cosa no me convenció: los NavButtons. Los describí como "simples placeholders" con la esperanza de que cambiarían. Spoiler: no cambiaron en mucho tiempo.

Día 2: desde la universidad

Al día siguiente tenía clases. Pero mis clases ese día eran Material Design.

"Todo mi schedule de sesiones de mañana es sobre Material Design, ya leído el libro me haré experto."

El spec completo era exactamente eso: un libro. Cientos de páginas sobre principios, movimiento, tipografía, color, patrones de interacción. Un documento de diseño sin precedente en el mundo del software.

La sesión de Roboto. Las animaciones con peso físico. El Floating Action Button y su lógica contextual.

"I love the Frequently Action Button, it tells the user what to do next, it is so intuitive."

El paradigma

Al final del segundo día llegó la observación que lo ponía todo en perspectiva:

"La verdad es que lo único que mantenía a los diseñadores en iOS según que era 'más bonito'. Material Design cambia este paradigma."

En 2014, eso era mucho decir.

Por años la narrativa era que iOS era la plataforma del diseño. Si te importaba la calidad visual, usabas Apple. Android era potente, pero no bello.

Material Design cuestionó eso. No con argumentos, sino con un spec de cientos de páginas, un sitio en vivo, APIs disponibles ese mismo día y una keynote donde un diseñador —no un ingeniero— se robó el show.

Lo que quedó

Google I/O 2014 no fue el evento más visto de ese junio en México. El Mundial seguía. Alemania seguía. Messi seguía.

Pues sí.

Pero para los estudiantes de diseño que estábamos atentos, ese 25 y 26 de junio de 2014 marcó un antes y un después. Material Design no solo rediseñó Android. Rediseñó la conversación sobre lo que podía ser el diseño de software.

Hoy, más de una década después, sus huellas están en prácticamente todo el diseño de interfaces que existe. Los principios de elevación, la tipografía con escala, el motion como comunicación.

Ese fue mi otro Mundial. Y lo ganamos.

Fuentes originales

El poder del feedback

Thu, 05 Sep 2013 00:00:00 GMT

Yo era de aquellos que solo comparten sus diseños hasta haberlos terminado. He tenido este problema de seguridad en mi en el que me cuesta recibir críticas al trabajo que tanto me ha costado, ese miedo constante a ser rechazado por mis esfuerzos. Finalmente una simple palabra puede desmoronar una gran idea, así de crudas son las críticas, pero si algo he aprendido en el último mes es que las críticas han estado mucho tiempo mal comprendidas. Mostrar nuestro trabajo a los demás tiene una sola finalidad que roza con la crítica pero que es más poderosa: recibir ese feedback por parte de otros ojos que hará de nuestro trabajo algo más universal y posiblemente más creativo.

No es nada del otro mundo, es una de esas sugerencias que encontramos en cada “25 things a designer should do to improve his work” o “50 ways to become a better designer” y demás. Es de esas cosas que leemos, damos por hecho que no es importante y nos enfocamos en lo demás. Y cuando estamos en pleno desarrollo nos damos cuenta de que hay ciertas cosas que no podemos pasar por alto (increíblemente nos sorprendemos por eso siempre), durante el proceso de dibujado salen a relucir detalles que podríamos implementar en el trabajo final pero que ignoramos si será beneficioso del todo para el usuario (en el que al final de cuenta nos enfocamos, sea en forma de actividad o de individuo).

En mis primeros trabajos realicé muchas cosas mal por saltarme pasos, en la mayoría de los casos obviando el proceso, pero apenas caía en algún hueco dejado a lo largo del proceso me molestaba conmigo mismo por lo profundo del error y sobre todo por lo evitable. Muchos de esos errores eran fácilmente superables si en algún momento del dibujado hubiera solicitado feedback a usuarios y comunidades de diseñadores. Pero simplemente me sentía tan orgulloso y con tanta razón que lo creía innecesario, pagando muy caro mis errores, sufriendo trabajos finales inauditos.

Todas estas formas de bloquearse, de cegarse y de ignorar terminan alejándonos del increíble poder que el feedback puede darnos a lo largo de nuestros procesos de diseño. Les pondré un ejemplo sencillo que me sucedió hace poco. Durante el diseño de una aplicación Android (pasa en general) se descubren muchas formas de presentar información, siempre hay que tomar decisiones, primero por la opción que realice cabalmente lo que necesitamos, segundo la que cumpla con los requisitos de estética. Normalmente en la primera no tengo problemas pues en la mayor parte de los casos la lógica decide, en el segundo punto dejo mi lado artístico volar (no demasiado) y permito al diseño adaptarse en ciertas circunstancias. El problema viene cuando logro diseñar y cumplir de diferentes formas de lo que necesito y me encuentro entre dos o más opciones para decidir que cumplen con los puntos anteriores. Ahí fue donde entraron en juego los poderes del feedback. Tomé mis dos diseños de la misma pantalla, los compartí en la comunidad de diseñadores Android y vualá, la consecuencia fue increíblemente decisiva.

Lo primero que detecté fue la misma ambigüedad que yo tenía en la decisión, pero había una diferencia con respecto a mis observaciones, esta vez estaban fundamentadas en la experiencia (o no) de cada uno de los que comentaron mi trabajo. Yo no he vivido o hecho lo mismo que ellos y aunque quizá ellos tampoco, pero generaron muchísimas opiniones respecto a lo que les presenté en diferentes formas. Y no solo eso, sino que las sugerencias me permitieron variar de dos hasta cuatro (pudieron ser más) formas distintas de mostrar la información. ¿Eso no generó más fragmentación en la decisión? Para nada, varias de las sugerencias me permitieron combinar lo mejor de cada una para al final, decantarme por la mejor, generada, como no por los comentarios de la comunidad.

¿Lo mejor de todo? ¡La comunidad me felicitó por mi trabajo! No hubieron críticas, obtuve contactos y gané prestigio con una simple publicación. Pero hay que tomarlo con calma, no siempre sucederá así y es necesario estar listo para recibir críticas duras en cualquier momento. Y no deben tomarse a mal, las críticas deben contribuir con el mismo efecto que una sugerencia. Finalmente quien tiene la última palabra sobre nuestro trabajo somos nosotros y (normalmente) nosotros decidimos que dejar o no dejar.

Si eres de los que no comparten su trabajo por la razón que sea, te invito a que hagas la prueba, las ventajas son muchísimas y las descubrirás en cuanto lo hagas. Encuentra la comunidad correcta para mostrar tu trabajo, desarrolla bien tu problema al describirlo, haz las preguntas correctas y verás lo mucho que te ayudarán en el proceso. Y en el caso de los diseñadores, te sugiero que realices esta actividad en casi todas las etapas, pero sobre todo en la etapa del sketching y realización de prototipos, donde se deben solucionar el 80% de los problemas, no dudes en repetir el proceso de feedback las veces que sea necesario. Como punto final, recuerda siempre que tu trabajo es tan valioso que los demás agradecerán que lo compartas, por algo se llama feedback o retroalimentación, tu me das, yo te doy.

¡Hasta la próxima!

Tapas que no abren a la inversa

Mon, 19 Aug 2013 00:00:00 GMT

En los últimos días entre la comunidad de diseñadores, sobretodo enfocados en el diseño de aplicaciones Android han sucedido una serie de debates acerca del seguimiento de las guías para el diseño de las aplicaciones, mejor conocidas como Holo, debate que ha existido desde que Google rediseñó totalmente su sistema operativo móvil en su versión 3.0+ (Honeycomb) pero que desde el lanzamiento de la app de Clima de Yahoo! se ha puesto en la mesa con énfasis y que hoy se marca un parte aguas en el proceso de los debates con la llegada de Timely, un reloj alarma lanzado por Bitspin, también creadores de Tasks, aplicaciones con diseños exquisitos basados principalmente en las guías de diseño especificadas por Google para el desarrollo en el ecosistema mismo.

“It is not often when you run into an app that demonstrates both best and worst design and implementation out there. But Yahoo! has done it with their weather app for Android. This app is a sad example of what ignorance of the platform and its guidelines can do to an app that has a massive potential to be one of the all time greats.” — Juhani Lehtimäki

Debates acerca de si una aplicación en Android deba llevar necesariamente los lineamientos Holo para poder ser calificadaa como hermosa, intuitiva y divertida. Debates que llegaron a tener en Matias Duarte una opinión con respecto a ella y que ha causado mucha expectación, explicando que nadie está obligado a implementar las guías de diseño pues solo son eso, guías, no reglas, pero que están hechas para facilitar el entendimiento del diseñador y el usuario en el ecosistema manteniendo una unificación principalmente en la interacción con el mismo.

“ Who can operate these terrible televisions? They look great, yes! Dominate the whole room, because they get larger and larger, but you operate these things … it’s still a problem. ” — Dieter Rams

Podemos encontrar muchas incongruencias en la app de Clima de Yahoo!, buenos diseñadores como Juhani Lehtimäki generaron polémica al detallar las razones por la que no siente cómodo usando la aplicación; otros como Taylor Ling fueron más allá y rediseñaron la aplicación para hacerla sentir acorde a la plataforma sin perder su núcleo y lo que la distingue, en este caso la innovadora forma de presentar el clima con el nuevo sello Yahoo! impulsado por Marissa Mayer. Los debates fueron fuertes, los detractores del purismo consideran que la belleza de la aplicación es natural y que no se necesita tener objetos de diseño del ecosistema en la aplicación. Duarte incluso ironiza con los debates en su publicación sobre el tema:

Depending on who you are this is either “a brave and liberating stand for creative freedom, releasing Android from a stilted hegemony of cookie cutter designs,” or “a horrifying violation of the one true design, confusing users to no end, and reinforcing the image of Android as an incoherent jumble.” Yeah.

Precisamente hoy apareció un argumento potente en el debate en forma de aplicación, la ya mencionada Timely. Una aplicación que cumple cabalmente con las guías de diseño Holo pero que no se vuelve aburrida y repetitiva en ningún momento. Genera innovación en casi todos los terrenos (incluso en el de distribución de contenido) presentándose como el ejemplo perfecto para los puristas (#HOLOYOLO) en el ámbito. Solo es cuestión de probarla para darse cuenta del efecto que genera en el ecosistema, no me extrañaría que en adelante muchos diseñadores piensen inspirarse en este grandioso producto, me atrevería a decir que puede ser un parte aguas en el diseño de aplicaciones en Android.

“Many seemed to think that following design guidelines somehow limits creativity or makes all apps look the same. That’s absolutely not true and Timely Alarm Clock app is the best example of this ever released. ” — Juhani Lehtimäki

Dieter Rams con sus diez principios para un buen diseño, especifica que un buen diseño es, entre otros: útil, estético, innovador e intuitivo. Esto en la aplicación de Yahoo! es totalmente aplicado, la información del Clima presentada es tan rica que supera a muchas en ese ámbito, es hermosa en su exterior, presentando transiciones que le dan el toque innovador y en gran sentido, sus funciones son intuitivas. ¿Entonces que es lo que hace que no sea completamente aceptada por los diseñadores en el ecosistema Android?

“Conscistency is there to help your users” — Matias Duarte

Yahoo! y todos los desarrolladores son libres de diseñar sus apps como quieran, pero usar ese tipo de aplicaciones que mantienen poca consistencia con el resto del ecosistema hace que se sientan incongruentes y fuera de lugar. Es tan sencillo como imaginar una aplicación de Windows Phone 8 en iOS, podrá ser hermosa y mantener una estética congruente consigo misma pero el hecho de alojarse en otro ecosistema hace que pierda consistencia. Dieter Rams también habla de que un buen diseño es amigable con su ambiente y libre de obstrucciones. Esto es que un buen diseñador debe ser capaz de adaptar el núcleo de su diseño en ecosistemas distintos sin perder consistencia en cada uno. Ejemplos hay muchos pero el que más me impresiona es el de Twitter que padeció durante mucho tiempo de inconsistencia en sus diseños y que ahora puede enorgullecerse de tener aplicaciones adaptadas estéticamente en varias plataformas sin perder su núcleo, generando congruencia entre cada aplicación y consistencia con el ecosistema en el que se aloja.

Tampoco estoy diciendo que una aplicación que no siga línea por línea las guías será un fiasco o no se sentirá del todo correcta en Android, no explicaré que es realmente Holo (mal entendido en muchos aspectos) para los diseñadores, desarrolladores y usuarios porque una vez más Lehtimäkilo explica bien en su artículo. Pero podemos encontrar algunos desarrolladores que modifican estas guías y generan productos totalmente consistentes con el ecosistema sin respetar las reglas en su pureza haciendo alarde de creatividad como Falcon Pro de Joaquim Verges. En otros casos podemos ver integración casi en modo fusión de dos plataformas como lo que presenta Microsoft en sus últimas aplicaciones desarrolladas para Android, los casos de SkyDrive y Outlook los más notables. Incluso el mismo Google ha diseñado sus productos en diversas plataformas,manteniendo su núcleo intacto, la más significativa en iOS, dando un ejemplo de adaptabilidad estética como pocos.

Es claro que el rediseño que Yahoo! le está dando a sus productos no sufre por ser feo puesto que no lo es, su problema ni siquiera va en el aspecto de uso o la presencia de bugs; en cambio si lo es en el contexto erróneo en el que se envuelve, la inconsistencia en la plataforma en la que se desarrolla, aspectos que podrían mejorar o no, según sus propios criterios (a tomar en cuenta que los usuarios están fascinados por el rediseño y pocos se quejan por su incongruencia, punto a favor para los no puristas). Sin embargo, es un hecho que como diseñadores, desarrolladores y usuarios (cualquiera que usted sea) seamos capaces de adaptarnos al mismo entorno sin perder nuestras raíces. Al final de cuenta, somos seres adaptables en mayor o menor medida y esa quizá sea nuestra mejor cualidad.