Entrevista a Pimpampum.net con Daniel Julià y Anna Fuster

Hola, Anna y Daniel. ¿Podéis explicarnos a qué os dedicáis y cuál ha sido vuestra relación con la UOC y con Mosaic a lo largo de estos años?

A- Lo podríamos resumir en que nos dedicamos al diseño y desarrollo de proyectos interactivos en el ámbito web. Tenemos una pequeña empresa desde 2007, Pimpampum.net.

D- Las plataformas que utilizamos para los proyectos convencionales son CMS, como WordPress o Drupal, y para proyectos más complejos, frameworks, como Laravel (todos ellos basados en PHP). Digamos que todo nuestro trabajo se centra en cuatro estándares web: HTML, PHP, CSS y JavaScript.

Pero también tenemos una vertiente creativa que hemos cuidado desde el principio. En nuestra web aparece en el apartado «lab» https://www.pimpampum.net/es/lab. Uno de nuestros lemas es la «programación creativa». A final del año siempre tratamos de crear una felicitación para nuestros clientes que es algo creativo o experimental, y cuando es posible lo aplicamos también a proyectos convencionales.

D- En paralelo, ambos ejercemos la docencia en algunas universidades. Yo, en concreto, estoy desde 2010 como profesor colaborador en la UOC en temas de desarrollo web (backend, CMS)

A- Y yo soy profesora asociada de la UPF, doy la asignatura Guion y Diseño de Proyectos Interactivos en el grado de Comunicación Audiovisual, y además coordino y doy clase en el posgrado en Diseño Web de EINA.

Con la UOC tenemos una relación que también viene de lejos. A parte de que Dani es colaborador, siempre nos apuntamos a los eventos que organizan los estudios de multimedia. No nos perdemos ninguna Jornada UX, ni el Modern Web Event. Nos sentimos parte de esta comunidad, después de tantos años. ¡Y ahora somos fans de Despacho 42! 🙂

¿En qué consiste la programación creativa?

D- Podemos ver la programación creativa como una forma de arte. Creo que la programación es una de las herramientas más potentes en cuanto a posibilidades de creación que proporciona. El formato resultante puede ser cualquiera, audio, imagen, vídeo, redes sociales o realidad aumentada, entre otros.

Muchos de los proyectos que hemos hecho dentro de nuestro «lab» han sido por simple experimentación. También son un campo ideal para explorar nuevas posibilidades de creación que después se pueden aplicar a proyectos reales.

La programación creativa tiene intrínsecamente un componente de juego o experimentación, no tiene por qué haber previamente un objetivo claro definido. Muchas veces se hace a base de experimentación, prueba y error, muchas iteraciones, etc.

A- Al principio, hicimos varias aplicaciones que utilizaban Flickr, justo cuando hubo el boom de estos servicios que permitían que cualquier usuario publicase contenido en la web. Todos ellos ofrecían API que permitían reutilizar su contenido para crear nuevos proyectos.
Desgraciadamente, estos proyectos con Flickr ya no funcionan porque estaban hechos en Flash.

D- Aparte del mundo de las API, un campo que nos interesa mucho es el de las visualizaciones interactivas. Por ejemplo, realizamos una aplicación para BBVA que mostraba los flujos de transacciones de las tarjetas de crédito en un mapa que los visualizaba.

De hecho, uno de nuestros proyectos basados en Flickr lo convertimos a JavaScript/Canvas y todavía se puede utilizar. Mapr es una visualización de fotos geoposicionadas. Lo podríamos definir como una «herramienta para pintar con hashtags geográficos».

En 2001 se publicaba el primer número de la revista Mosaic. ¿Podéis recordar a qué os dedicabais en ese año?

D- Si no recuerdo mal, yo todavía estaba en la empresa Lost Boys trabajando en varios proyectos web. Uno de los que más recuerdo es la tienda Caprabo online. Esto ya era después de la explosión de la burbuja puntocom del año 2000. La empresa no tardó mucho en cerrar como muchas otras. Parecía que internet estaba en una crisis muy grave, y que no tenía mucho futuro, pero nada más lejos de la realidad, como se ha demostrado después.

A- Yo justo en 2001 trabajaba en una empresa donde buena parte de los proyectos consistían en desarrollar portales, los típicos que tenían buscador, chat, postales… Y en septiembre me incorporé a un grupo de investigación del IUA, donde trabajamos en proyectos más experimentales.

¿Recordáis cómo eran las páginas web en 2001? ¿Qué grandes momentos destacaríais en la evolución del diseño web desde entonces hasta ahora?

A – ¡Lo recuerdo perfectamente! De hecho, siempre digo que es muy fácil poner fecha a las webs porque padecen «tics» de diseño, modas que vienen y luego se van. En 2001 todas las webs tenían pestañas, y concretamente todas con las esquinas cortadas en ángulo. También fue una época en que nos fascinaba el píxel, recuerdo pintar todas estas esquinas píxel a píxel, para que quedaran perfectas. También más o menos por aquella época pasamos del estándar de pantallas de 800 × 600 píxeles a 1024 × 768. Por algún motivo que desconozco un día decidimos que ya podíamos diseñar para 1024 × 768. ¡Se abrían un montón de posibilidades!

¡Y no nos olvidemos de Flash! Consiguió crear una web paralela, en 2001 todos querían su web en Flash con una prehome animada, siempre con el logo dando vueltas. Y para poder ver estas animaciones que pesaban un montón, mientras esperábamos que se cargasen, eran necesarios los preloads, otro género con entidad propia. ¡Qué tiempos aquellos!

De aquellos días hasta ahora la evolución ha sido muy grande. Tengo la sensación de que en aquella época todavía no había un lenguaje, estábamos definiéndolo. Al menos en mi entorno no se hablaba de UX, UI, SEO… De hecho, Google justo empezaba a ser conocido entonces.

Hoy en día, en cambio, hay unos estándares de los que es difícil escapar si buscas la máxima eficiencia. Además, tienes que diseñar para cualquier tamaño de dispositivo, que la web pese poco, que el diseño permita un buen SEO, y recientemente, por fin, la accesibilidad está siendo tomada más seriamente. Todos estos aspectos condicionan el diseño.

Por otro lado, la evolución de CSS también influye en el diseño. Antes, para hacer unas esquinas redondeadas hacíamos auténticas maravillas con imágenes y tablas, o las sombras de las cajas, que también eran imágenes. Otro cambio radical que hemos incorporado sin más es la posibilidad de trabajar con fuentes más allá de las del sistema. Yo siempre cuento a mis alumnos que cuando empecé a trabajar la decisión sobre qué tipografía utilizar era tan sencilla como decidir si con serifa o sin serifa y que una vez decidido, por ejemplo, que quería sin serifa tenía Arial o Verdana. De vez en cuando, utilizaba Trebuchet, Tahoma… era lo más que había.

Ahora creo que estamos en un momento que todavía no hemos sacado el máximo partido a grid en CSS. Aunque la utilizo en casi todos los proyectos, tengo ganas de explorar las posibilidades específicas que ofrece a nivel de diseño, creo que se puede hacer mucho más.

D- Yo creo que en general la evolución de la web ha ido cada vez más desde un simple repositorio de documentos interconectado a convertirse cada vez más en una herramienta imprescindible para el día a día. Seguramente ya no se da tanta importancia al diseño de una web como a la utilidad que pueda tener. Ya en este siglo tuvimos la época dorada de los blogs y los RSS, posteriormente la época de las redes sociales, luego el cénit de las aplicaciones móviles, que afortunadamente no ha conseguido «matar» la web, pero la ha hecho adaptarse con el diseño «responsive», y ahora creo que estamos en la época de lo que se llama la web3, que incluye el blockchain, el machine learning y la inteligencia artificial.

En nuestro caso nos preocupa recurrentemente una «enfermedad» que llamamos «appitis», algunas instituciones o empresas a menudo se inclinan a tener una aplicación móvil en lugar de una web estándar. En muchos casos no le vemos sentido.

Una aplicación de móvil no reside realmente en internet, no es indexable, seguramente tampoco es accesible y muchas veces está en plataformas cerradas. Además, en el fondo la gente es muy reacia a instalar una aplicación si no es para algo realmente muy útil y que va a utilizar a menudo. La mayoría de las webs para instituciones como ayuntamientos, etc., se consultan esporádicamente, y no tiene sentido en este caso crear una aplicación para ello. Afortunadamente, creemos que esta pandemia de «appitis» se está acabando y confiamos que en el futuro soluciones como las PWA (Progressive Web Apps), las webs que se pueden instalar en el escritorio del móvil e incluso funcionar sin conexión a internet, poco a poco vayan tomando protagonismo para estos casos que he comentado.

¿Recordáis alguna página web de hace veinte años que os gustase especialmente?

A- Yo recuerdo la primera web que me fascinó, debería ser allá por 1998. Se llamaba Technosphere y en ella creabas unas mascotas virtuales que cobraban vida y evolucionaban sobre la base de principios de la vida artificial. Una especie de tamagochis. Mandaban actualizaciones de su vida vía email, pero demasiado a menudo recibías la triste noticia de que habían muerto…

De hecho, en mi primera web, un trabajo para la universidad, la referencié, y puse una imagen de uno de los bichos que había creado:

De 2001 la web que más recuerdo comentar con mis compañeros era la de Kaliber 10000, k10k.net. Era un portal con un montón de recursos sobre diseño, pero lo mejor era el diseño de la propia web, hecho todo en pixel art:

Y un poco más adelante fue un gran hit la Million Dollar Homepage, donde podías comprar cada píxel de la página para colocar lo que quisieras. ¡Veo que continua activa!

D- Recuerdo descubrir el buscador Google en esa época, fue una mejora muy destacable con su algoritmo de PageRank. Anteriormente se utilizaba, por ejemplo, un buscador que se llamaba Altavista. Existía también Astalavista, un buscador de la «dark-web», podríamos llamarlo, donde podías encontrar cosas para hackers, códigos de registro para programas, etc. Pero algo a destacar de aquella época era la posibilidad de crearte tus propias páginas web. El propio navegador Netscape (que tuvo su época dorada a mediados de los noventa) permitía ponerlo en modo edición y podías crear fácilmente tu propia página web copiando recursos de otras, y diría que la mayoría de la gente en esa época lo hacía.

¿Y podéis recomendarnos algunas webs actuales?

D- En el campo del arte generativo es muy interesante Fxhash, una plataforma de código abierto (beta, muy reciente) para crear y recopilar NFT generativos en el blockchain de Tezos. En poco tiempo se ha creado una comunidad muy grande de artistas (creadores) y coleccionistas de este tipo de arte y, en mi caso particular, me ha animado a publicar varias cosas ahí.

Y dentro del campo del arte digital también es muy interesante la plataforma Hydra, que permite crear código para generar visuales en directo en el propio navegador utilizando este lenguaje.

Como reflexión, una de las cosas más interesantes que ha pasado en internet en los últimos años es que cada vez hay más herramientas que funcionan directamente en el navegador sin necesidad de instalar ninguna aplicación.

Otro ejemplo sería Audiotool; en este caso, se trata de un secuenciador de audio muy completo, sería impensable tener algo así solo hace unos años.

A- Yo no descubriré ninguna web espectacular, más bien me fijo en webs corrientes que están bien hechas.

Pero por mencionar webs que me parecen útiles, por ejemplo aprendo mucho de las guías de estilo que publican empresas como, por ejemplo, IBM y, cómo no, la de Material Design.

A nivel de CSS me encantan los experimentos de Jen Simmons y su canal de Youtube Layout Land o la de Rachel Andrew, donde aprendí mucho de lo que sé ahora de Grid Layout. Es una suerte tener personas como ellas que comparten su conocimiento cuando los demás todavía estamos empezando.

Finalmente, otro personaje interesante es Pablo Stanley; me encantan sus cómics sobre el sector del diseño y echo mucho en falta nuevos episodios del pódcast Diseño Chachacha.

Vuestro trabajo como profesores os lleva no solo a desarrollar proyectos web, sino a reflexionar sobre el proceso de diseño.

D- Es cierto. Nuestro trabajo como profesores tiene la ventaja de que nos obliga a estar continuamente al día de las novedades en los campos del desarrollo web. Es una motivación para estar siempre aprendiendo cosas nuevas, cosa que en este campo es imprescindible.

En este sentido, ¿qué aspectos os parecen importantes para transmitir a vuestro alumnado?

A – Aparte de que una web sea usable y sea agradable a la vista, que esto cualquier alumno lo entiende a la primera, creo mucho en transmitir valores, que son muy propios de este ámbito.

La mayoría de los alumnos busca inspiración en webs como Awwwards, en la que prima la espectacularidad, el diseño por el diseño, la animación… Creo que estos referentes, aunque sean muy atractivos, no nos ayudan a entender cuáles son los fundamentos de la web.

Por ejemplo, la cultura de compartir, de que todos nos beneficiamos de lo que han hecho los demás. El primer día que abro el inspector y les muestro que allí está todo el código de la web lo primero que les sorprende es que cualquiera lo puede copiar. Y cuando les digo que sí, que es lo más normal y que es como más se aprende, les estalla la cabeza. Es cuando ya van aprendiendo más que entienden que no se trata de copiar y pegar sin más, sino de utilizar algo que ha hecho otro como base para tu proyecto.

Aparte de esta filosofía de compartir, también hago mucho énfasis en la accesibilidad, no solo a la hora de plantear el diseño, sinó también permitiendo que el usuario elija cómo lo quiere ver; somos conscientes de que nuestra propuesta debe ser adaptable. Y que no pasa nada.

Finalmente, hay que reflexionar sobre la sostenibilidad: ¿es necesario ese vídeo de fondo que ocupa toda la pantalla, ese carrusel con cinco fotos extragrandes, cargar 10 tipografías?

Todos estos aspectos que tienen que ver con la responsabilidad nos harán tomar unas decisiones de diseño que no serían las mismas de no haberlas tenido en cuenta.

D- Creo que es importante que entiendan que hoy en día seguramente deberán especializarse en algún campo. No solo existen el diseño y la programación, sino que el abanico de posibilidades es muy grande; por ejemplo, la analítica de datos, temas de accesibilidad, UX…, la lista es casi interminable. En general se puede hablar de dos ramas principales, diseño y desarrollo. Y cada una de estas ramas se va bifurcando; por ejemplo, el diseño en diseño gráfico, maquetación, diseño de interacción, usabilidad, etc., y el desarrollo en frontend y backend, y luego ambos se van bifurcando en múltiples plataformas, lenguajes, etc. Con lo que es imposible conocerlo todo. En los principios de la historia de la web sí era posible.

¿Podéis hacernos un breve repaso por alguno de vuestros proyectos?

D- La mayoría de los proyectos que hacemos son institucionales para ayuntamientos u ONG; por ejemplo, últimamente hemos hecho la web del proyecto «School to School» de la Fundación Vicente Ferrer. Es una web donde las escuelas de la India y de aquí comparten materiales (imágenes y vídeos) sobre un tema con el objetivo de acercar la cultura de la India a las escuelas de educación primaria.

Otro de nuestros proyectos es la web «Voluntariat ambiental» para la XCN (Xarxa de Conservació de la Natura). Un punto de encuentro para voluntarios y entidades que quieren trabajar a favor del medio ambiente en diferentes ámbitos.

En todos estos proyectos nos dedicamos a hacer el diseño totalmente a medida y la implementación y desarrollo, normalmente sobre CMS como WordPress o Drupal.

A- También hemos trabajado para el CCCB con Bioscopi, un proyecto que recoge los talleres de animación documental asociados a las exposiciones.

Además, desde hace bastantes años colaboramos con el Ayuntamiento de Barcelona en algunos proyectos. Es un tipo de web muy funcional, con unos requisitos muy estrictos, pero nos sentimos muy cómodos en este tipo de proyecto también. Por ejemplo, en 2013 desarrollamos la web de la transformación de las Glorias de Barcelona, con una visión a largo plazo, ya que tenía que permitir adaptarse a todas las fases del proyecto. Todavía está activa.

Otra web a la que le tenemos especial cariño es la del Institut Català d’Antropologia. Fue uno de los primeros proyectos que realizamos como empresa, en 2007, un Drupal que aguantó 12 años hasta que en 2019 se decidió que necesitaba una renovación total. La rediseñamos y pasamos a WordPress.

Una de vuestras últimas colaboraciones con la UOC ha sido el diseño de la web del congreso ISEA. ¿Podéis explicarnos algo sobre este proyecto?

D- Nos ha hecho mucha ilusión colaborar en este proyecto por la afinidad que tenemos con los temas que se tratan en el congreso. Además, la web tiene algunos detalles de animaciones interactivas que nos ha encantado integrar.

A- Ha sido un proyecto muy gratificante, ya que el tema nos resulta cercano y además partíamos de una gráfica muy potente. Nuestro trabajo ha consistido en adaptar este estilo gráfico al ámbito web y añadir detalles interactivos, pequeños elementos que nos invitan a jugar con ellos, pero siempre sin perder el foco de que se trata de una web de un congreso.

Cita recomendada: Mosaic. Entrevista a Pimpampum.net con Daniel Julià y Anna Fuster. Mosaic [en línea], diciembre 2021, no. 196. ISSN: 1696-3296. DOI: https://doi.org/10.7238/m.n196.2139