Flujo de trabajo con plantillas
Las plantillas gratuitas de Figma para aplicaciones móviles pueden darle a un proyecto de diseño de aplicaciones un punto de partida visible. Elige un diseño que se ajuste a tu tarea, sustituye el contenido de ejemplo y comprueba si el flujo sigue teniendo sentido.
Un enfoque basado en plantillas comienza con un patrón de pantalla existente; el diseño de aplicaciones general comienza con el problema y elige un patrón después. La comparación siguiente concreta esa diferencia.
Una plantilla útil aporta una estructura de pantalla, un patrón visual reutilizable y algo concreto que evaluar. El trabajo consiste en decidir qué partes merece la pena conservar.
Necesitas mostrar una idea de reservas a alguien que no puede evaluarla solo con una lista de funciones.
Adapta una pantalla pertinente para que la conversación se centre en las opciones, las etiquetas y la siguiente acción, no en la decoración.
Estás comparando dos formas de organizar el proceso de pago en una aplicación móvil.
Usa una plantilla como una de las opciones y evalúa su jerarquía según la tarea, en lugar de tratarla como una solución definitiva.
Una pantalla de ejemplo tiene un aspecto cuidado, pero su navegación puede no ajustarse al contexto de uso del dispositivo previsto.
Conserva la estructura de contenido útil mientras revisas las expectativas de la plataforma, los espacios y las áreas táctiles.
Puedes editar una pantalla, pero no sabes qué cambiar primero.
Avanza desde la tarea principal del usuario hacia las etiquetas, los estados y la prioridad visual en una secuencia deliberada.
Trata la plantilla como un borrador que debes examinar, no como un atajo para evitar las decisiones sobre el producto.
Anota quién usa la pantalla y qué necesita conseguir. En diseño de aplicaciones, «reservar una cita» ofrece una orientación más clara que «crear una pantalla de inicio moderna».
Busca una plantilla con una tarea y una jerarquía de contenido similares. Comprueba sus condiciones de uso y si se puede editar antes de dedicarle tiempo; una coincidencia visual por sí sola no basta.
Introduce etiquetas y contenido realistas. Sigue la acción principal hasta la siguiente pantalla y después revisa los estados que falten, como errores, resultados vacíos y confirmaciones.
Usa esta comparación en paralelo para decidir si un diseño móvil existente te ayuda con tu tarea concreta de diseño de aplicaciones.
| Punto de partida con una plantilla de Figma | Punto de partida general para el diseño de aplicaciones | |
|---|---|---|
| Primera decisión | ¿Qué pantalla existente se ajusta mejor a la tarea? | ¿Qué debe conseguir el usuario? |
| Material inicial | Un diseño existente, si su creador lo pone a tu disposición | Una descripción de la tarea, un flujo preliminar o un lienzo en blanco |
| Ventaja inicial | Una jerarquía visible que se puede evaluar y modificar | Libertad para definir la estructura antes de darle estilo |
| Riesgo principal | Conservar elementos atractivos que no contribuyen a la tarea | Dedicar demasiado tiempo a decidir por dónde empezar |
| Trabajo de contenido | Sustituir los textos, las imágenes y los datos de ejemplo | Definir las necesidades de contenido antes de organizarlo |
| Trabajo sobre el flujo | Comprobar qué ocurre antes y después de la pantalla proporcionada | Trazar el flujo antes de perfeccionar cada pantalla |
| Pregunta de revisión | ¿Qué se debe eliminar o adaptar? | ¿Qué estructura se debe crear? |
Esta guía está relacionada con Figma; App Design no es Figma y no proporciona ni verifica una biblioteca de plantillas de Figma.
Esta página no proporciona un archivo específico de Figma ni confirma que un archivo de terceros siga estando disponible.
Qué hacer en su lugar
Comprueba la procedencia de cualquier plantilla que encuentres, incluidas sus condiciones de acceso vigentes.
Una pantalla creada para otra aplicación puede ocultar decisiones pendientes sobre tus usuarios, el contenido y la navegación.
Qué hacer en su lugar
Compara cada elemento destacado con la tarea que anotaste antes de conservarlo.
Una plantilla descrita como gratuita puede tener condiciones de atribución, redistribución o uso comercial.
Qué hacer en su lugar
Lee la licencia del creador correspondiente al archivo exacto que planeas adaptar.
Una pantalla bien diseñada no demuestra que alguien entienda el flujo o pueda completar la tarea.
Qué hacer en su lugar
Recorre situaciones realistas y observa dónde las etiquetas o los siguientes pasos generan dudas.
Describe la tarea del usuario, el contenido que necesita la pantalla y la acción que viene después. Tanto si adaptas una plantilla externa como si empiezas sin ella, esas decisiones dan una base más sólida a tu trabajo de diseño de aplicaciones.
Busca plantillas compartidas por sus creadores y comprueba las condiciones actuales de acceso y uso de cada fuente. Esta página explica cómo evaluar y adaptar una plantilla; no es un directorio de plantillas de Figma.
Depende de la licencia del archivo específico, no de la palabra «gratis» en un resultado de búsqueda. Revisa sus condiciones de uso comercial, atribución y redistribución antes de incorporarlo a un producto.
Una pantalla existente puede facilitar la evaluación de la jerarquía y el espaciado. Aun así, los principiantes deben sustituir el contenido de ejemplo, comprender el flujo previsto y cuestionar los elementos que no aportan valor a su aplicación.
Anota primero la tarea principal y una secuencia aproximada de pantallas. Después podrás elegir una plantilla porque se adapta a esa secuencia, en lugar de adaptar el producto a un diseño que resulta cómodo.
Esta página no promete ningún archivo de Figma ni una biblioteca de plantillas, y App Design no está afiliada a Figma. Usa estas recomendaciones para planificar un flujo de trabajo basado en plantillas y verifica cualquier recurso de terceros en su fuente original.