1. Web Design
  2. UX/UI

Consejo rápido: cómo crear maquetas en perspectiva en Sketch

Scroll to top

Spanish (Español) translation by Carlos (you can also view the original English article)

Manipular gráficos en tres dimensiones (añadiendo perspectiva con un punto de desvanecimiento, o con un plano isométrico) puede ser realmente útil para las maquetas. En este consejo breve, vamos a utilizar un plugin llamado “Magic Mirror” para ayudarnos a crear perspectivas en Sketch.

Mira el screencast

Please accept preferences cookies to load this content.

Digamos que estás trabajando en una aplicación para iOS y quieres en el sitio web una imagen hero de alguien sosteniendo un iPhone, mostrando la interfaz de usuario de la aplicación con cierto ángulo. Lograr esto mediante los métodos tradicionales en Sketch es un poco complicado, así que vamos a usar un plugin de Sketch llamado Magic Mirror para que nos ayude.

Instala Magic Mirror

Hay dos formas de instalar este plugin; ya sea descargándolo e instalándolo desde el sitio web, o usando Sketch Toolbox para ayudarte a gestionar los plugins de manera más intuitiva.

Una vez instalado, dentro de Sketch ve a Plugins > Magic Mirror 2 > Enable Magic Mirror.

Define un área

Con todo configurado, ahora tienes que definir un área dentro de Sketch, seleccionarla, y luego especificar una mesa de trabajo dentro del cuadro de diálogo de Magic Mirror. El contenido de esa mesa de trabajo se reflejará en tu área seleccionada. Usando nuestro ejemplo de la aplicación para iOS, podríamos obtener algo como esto:

magic mirrormagic mirrormagic mirror
Área reflejada con la mesa de trabajo del «iPhone 7 Plus».

Con tu mesa de trabajo reflejada ahora en el área seleccionada, puedes rotarla y voltearla, e incluso (en la versión pro del plugin) elegir una resolución @1× o @2×.

Plantillas

Un aspecto agradable de este plugin son sus plantillas. Visita el sitio web y encontrarás toda una sección con plantillas disponibles listas para usarlas. Algunas de ellas requieren la compra, pero la mayoría son gratuitas.

Device and Wood is freeDevice and Wood is freeDevice and Wood is free
“Device and Wood” es gratuita

Concluyendo

Así es como puede utilizar el plugin Magic Mirror para ayudarte a crear maquetas con perspectiva. Espero que esto te haya sido útil, ¡y no te olvides de revisar lo que está de moda en la categoría de plantillas de Sketch en Themeforest!

Sketch templates category on ThemeforestSketch templates category on ThemeforestSketch templates category on Themeforest
Elige entre aproximadamente 100 plantillas de Sketch en Themeforest

Lectura útil