Framer

Framer
Información sobre la plantilla
Framer.jpg
GéneroDiseño de Interfaces

Framer . Entorno de trabajo de diseño "todo en uno", es una herramienta para dibujar, prototipar y compartir proyectos entre equipos. Combina la familiaridad de la edición visual con la flexibilidad del código. Todo un flujo de trabajo de diseño, ahora en una interfaz inteligente.


Funciones principales

  • Diseño:

Su diseño de herramientas es muy parecido a otros programas. Cuenta con un algoritmo de diseño automático ademas de una agrupación inteligente lo cual hace que su uso sea agradable.

Otra de sus características es poder dibujar con una precision perfecta en su vista de diseño para luego pasar a la parte de código y agregar animaciones. La interfaz de diseño de Framer será familiar para la mayoría, con un lienzo grande, una vista previa del dispositivo y un conjunto de herramientas completo. Al igual que muchas de las otras herramientas gráficas que ya utiliza, Framer Design ofrece las mismas formas y texto de inserción, todos fácilmente diseñados con el panel de propiedades. En este sentido, es una herramienta que ha sido optimizada para sentirse familiar.


  • Código:

Utiliza una biblioteca de componentes para agregar interacciones nativas y flujos de aplicaciones multipantalla. Auto-Code hace que llevar tus diseños a la realidad sea simple como la inserción de una animación o evento. Gracias a su estilo esto se puede hacer utilizando los controles deslizantes o editando directamente en el lienzo. No importa cómo te gusta trabajar, Framer siempre mantiene tu código intacto para ti.


  • Colaboración:

Framer cuenta con un servicio de guardado en la nube, la cual permanece fuera de la vista hasta que esté listo para una segunda opinión. Entonces es tan fácil como un solo clic para abrir un panel de control y compartir tu trabajo con el mundo. Obtenga los comentarios que necesita, luego vaya de vuelta a la creación de prototipos.

Características

  • Maquetación:

Framer incluye funciones automatizadas como la agrupación de elementos, plantillas adaptables y la correcta distribución y alineación de cada pieza del diseño, manteniendo proporciones y jerarquías.

  • Dibujo:

El programa permite crear iconos personalizados empleando un editor de vectores que cierra automáticamente los trazados, aplica curvas perfectas y exporta el resultado en formato SVG. Al elemento creado se le pueden aplicar posteriormente todo tipo de efectos de relleno y color.

  • Componentes:

Incluye una serie de componentes interactivos, tales como botones, campos de texto y reproductores de vídeo. Cuando se crea un componente, este puede editarse de manera que los cambios se reflejen en todas las iteraciones del mismo en la maquetación. Los elementos se guardan en una librería y pueden añadirse al diseño con sólo arrastrar y soltar. También es posible integrar datos en tiempo real, obtenidos de APIs, fotos y localizaciones, por ejemplo.

  • Interacciones:

Las microinteracciones son una parte importante de la experiencia de usuario y por ello se integran en los diseños de Framer de forma sencilla a partir de una serie de elementos pre-diseñados tales como areas en las que los elementos pueden desplazarse vertical u horizontalmente (scrolls), cabeceras fijas, y también transiciones entre pantallas que se pueden previsualizar inmediatamente en un simulador de un smartphone o tablet.


  • Tienda:

La tienda integrada en el propio programa permite adquirir componentes visuales y de código para crear nuevos proyectos más rápido o mejorarlos con interacciones y kits de UI. Los componentes se instalan fácilmente y basta con arrastrarlos sobre la ventana principal para integrarlos en el diseño.


Fuentes