Design Ops poniendo foco en cómo organizamos Figma
¿Qué tenemos que tener en cuenta a la hora de plantear la organización de nuestros archivos y proyectos en Figma?
Antes de nada, vamos a hacer un poco de recap sobre las Design Ops.
¿Qué son las Design Ops y de que se encargan exactamente?
Son las operaciones definidas para optimizar, escalar y aumentar el impacto de nuestros equipos de diseño y velar por su salud. Cómo se puede intuir de esta explicación se desgranan múltiples procesos que tienen impacto en diferentes aspectos de la vida de nuestros equipos de diseño. En este artículo nos vamos a centrar en la organización de nuestra herramienta de trabajo, Figma, cómo optimizarla según las necesidades de los equipos y del ecosistema de nuestra organización.
Si quieres saber más sobre Design Ops, aquí podrás leer el artículo que publicamos hace unos meses en el blog de Interactius.
Empecemos por el principio, Figma
Figma es la herramienta clave de colaboración por excelencia para equipos de diseño. Gracias a ella, varias personas pueden estar creando, visualizando, comentando o iterando un mismo archivo simultáneamente. La colaboración tiene infinidad de beneficios, pero a su vez, tantas personas trabajando e iterando un mismo espacio deja en evidencia que cada maestrillo tiene su librillo, por lo que en cuanto nuestros equipos comienzan a hacerse cada vez más grandes, la necesidad de definir normas de uso se hace cada vez más necesario.
Es importante destacar, que pese a que Design Ops se centra en los equipos de diseño, tiene un impacto real en las diferentes áreas de las organizaciones, en cómo trabajamos juntos, no sólo como equipo de diseño, si no, cómo nuestra área se interrelacionan con el resto de equipos.
Tal y como vamos a ver en este artículo, entender cómo consumen los diferentes departamentos de nuestra organización nuestros archivos de Figma va a tener un impacto en cómo definimos el orden de los mismos.
Es importante alejarnos de nuestras necesidades particulares (aunque han de estar presentes) para abrazar las necesidades globales y tenerlas en cuenta para que la organización de nuestro sistema de archivos funcione para todas.
¿Cómo empezar definiendo una buena organización de tu sistema de archivos?
Si tu equipo de diseño no cuenta aún con unas reglas estandarizadas de organización de tu sistema de archivos en Figma, alguna idea de como empezar:
- Evalúa el AS IS del sistema de organización actual.
Mapea la situación teniendo en cuenta cómo los usuarios interaccionan en los diferentes puntos con el sistema actual.
- Haz una investigación de cómo lo hacen otras compañías similares a la tuya.
Te aconsejo que no tomes como referencia compañías muy diferentes o de una medida mucho mayor a la tuya, ya que los procesos pueden ser mucho más complejos, así que empieza cimentando unas buenas bases y deja que todo evolucione según su momento.
- Plantea un Workshop a diferentes niveles para evaluar el AS IS.
Primero con el equipo de diseño que hace un uso directo de Figma, y luego, con las diferentes áreas de la organización implicadas en consumir los archivos generados por el equipo de diseño, developers, project managers, marketing, etc.
- Define una nueva propuesta y evalúa recibiendo feedback, si es necesario itérala, y cuando esté cerrada, lánzala, explícala, y resuelve dudas.
- Por una fecha en la que hacer un alto en el camino, pasados unos 6 meses podría ser un buen momento para poder valorar su implementación y volver a recibir feedback de todas las partes implicadas.
Qué aspectos es importante que tengas en cuenta en tu nueva propuesta de organización
1. Define cómo se organiza el sistema de archivos en Figma.
La mejor manera de hacerlo es evaluando cómo se organiza el ecosistema de tu organización. Lo mejor es que traslades dicha organización al planteamiento estructural de archivos de Figma.
Si os organizáis por clientes, lo óptimo sería organizar las secciones a partir de cada uno de ellos, del mismo modo, si trabajáis por squads, la organización de los archivos debería partir de estos equipos, así como si se organiza por plataformas, etc.
2. Piensa en las personas que van a hacer uso de nuestros archivos y librerías.
Nuestro objetivo es que las personas encuentren y hagan uso de las cosas de la manera más fácil y rápida posible.
Al final todo se resume en hacerle la vida más fácil a las personas:
- Ordena los archivos teniendo en cuenta el uso que se va a hacer de sus diferentes apartados.
- Otra buena práctica es crear archivos template o starter de nuestros archivos o librerías/UI Kits. Así, los diseñadores no han de empezar de 0 definiendo todos los apartados y assets del proyecto y parten de una semilla con la definición estructural que sirve como punto de partida.
- Si tu organización consume diferentes UI Kits es importante que los estandarices, de esta manera optimizamos el trabajo tanto de diseñadores como de desarrolladores.
3. Organiza tu archivo de Figma evaluando la necesidad del proyecto.
A continuación enumero algunos puntos que podría tener este template de inicio:
- Cover. Más adelante cito que has de tener en cuenta en la creación de tus Covers.
- To Develop. Pantallas finales con specs para desarrollo.
- Instrucciones. Cómo navegar por el archivo. Esta sección es útil para que los diferentes stakeholders que consumen nuestro archivo sepan cómo han de hacerlo.
- Acerca de. Explicación del proyecto, información relevante, fechas, duración y links externos (Notion,Coda, Miro, Jiras, informes de research, lo que se considere oportuno).
- Demo. Prototipo/s (Final)
- UI – IOS, ADN, Web – Secciones de proyecto con su versionado.
- Rituales. Critiques, sesiones de cocreación, las dinámicas que se han llevado a cabo en el proceso.
- Playground. Sección para hacer pruebas e iterar
- Prototipo para test
- Wireframes
- Workflows
- Investigación
- Graveyard. Sección de diseños residuales o descartados.
(Importante tener en cuenta lo comentado anteriormente, organiza estas secciones dando prioridad en el orden según frecuencia de uso).
4. Estandariza todo lo que se pueda.
De inicio puede parecer muy restrictivo. Las normas y leyes siempre se pueden repensar, pero asimilarlas y hacer un buen uso de ellas nos va a ayudar a optimizar la escalabilidad y esa es una de las grandes premisas de Design Ops.
5. Estandariza el sistema de nomenclatura.
Define la estructura de los nombres de archivo, de los covers, de las secciones, de las subsecciones, todo lo que se pueda.
6. Covers.
Las Covers son el identificador de nuestro archivo a primer golpe de vista. Para que las Covers sean de ayuda a los usuarios de estos archivos, estas han de mostrar sólo información relevante que ayude a diferenciar el proyecto con claridad. Si no, te seguirán preguntando dónde pueden encontrar el archivo aquel…
Un buen ejemplo de lo que podrían mostrar dichas Covers, es el siguiente:
7. Define procesos de validación siempre que sea necesario.
Por ejemplo, es necesario que los diseñadores de tu equipo tengan claro cómo se comunica, genera e implementa un nuevo componente en la librería core. Todos estos pequeños procesos que van surgiendo en nuestro día a día deberían estar definidos previamente y cada uno de los miembros del equipo debería ser conocedor.
8. Crea rituales para chequear el sistema de organización e iterarlo.
Vivimos en constante cambio, así que en nuestro nuevo paradigma organizativo hemos de contemplar el cambio como un checkpoint más.
Puedes crear checks quincenales de seguimiento, un espacio en abierto dónde dejar feedback, o lo que consideres.
Lo importante es saber que esto sólo va a funcionar si se construye, teniendo en cuenta las necesidades de todas las partes implicadas.
Desde el punto de vista de Design ops, dedicar 15 min a la organización, sea cual sea tu rol, siempre será un tiempo bien invertido. Incluso si eres el único diseñador de tu equipo, nunca se sabe cuando tu equipo puede ser más grande y en ese momento tendrás parte del trabajo hecho y bien estructurado.
En Interactius sabemos que invertir en Design Ops requiere un coste, pero los beneficios a largo plazo son innumerables. ¿Sabes que lo necesitas pero, aún no acabas de ver claro cómo implementarlo o por dónde empezar exactamente? Ponte en contacto con nosotros y te ayudamos.
Fuentes
Este artículo no habría sido posible sin:
Una nueva manera de trabajar en Figma: de local a global
How to use Figma as file storage? It really helped our Product Design team to organize files
MASTERCLASS: Cómo organizar el sistema de archivos y proyectos en Figma
Organising Design Work in Figma — A Systemic Guide and Framework
