Cómo cortan imágenes los diseñadores de UI
Las imágenes recortadas son uno de los productos que los diseñadores entregan a los desarrolladores. Una vez completado el borrador del diseño, los diseñadores deben cortarlo en imágenes que se puedan convertir fácilmente en páginas. Cuando los diseñadores cortan imágenes, necesitan usar herramientas de corte. Por ejemplo, Mockup puede cortar imágenes automáticamente (admite borradores de diseño de Sketch, Adobe XD y PS). Los diseñadores solo necesitan marcar los recortes en el borrador del diseño y cargarlo en Mocket. Úselo simplemente como cliente, no se requiere trabajo manual y los desarrolladores pueden descargarlo y usarlo de forma independiente.
¿Cómo recortar la imagen? En realidad, es muy simple: (Tome el corte de PS como ejemplo)
Paso 1. Instale y abra el complemento
Después de instalar el complemento, abra PS y busque Mockup en el complemento "Ventana> Funciones extendidas", seleccione y ábralo. Inicie sesión con su cuenta de la plataforma Mock.
Paso 2. Marcar los cortes
En el borrador de diseño completo, seleccione la capa o grupo que desea cortar y haga clic en "Marcar cortes". Se agregará "-e-" antes del nombre y "Marcar corte" cambiará a "Cancelar marca corte", luego se completará el corte de marca.
Paso 3. Subir a Mocke
Después de marcar el dibujo cortado, cargue el borrador del diseño al proyecto en la nube con un solo clic. El ingeniero de desarrollo puede descargar el dibujo cortado de forma independiente haciendo clic en. a la derecha Seleccione la imagen cortada en el panel lateral y haga clic para descargar.
Además del corte automático de imágenes, hay más funciones de resaltado:
1. Compresión de recorte de imágenes: seleccione el recorte de imágenes en el panel derecho.
2. Selección de plataforma y aumento: iOS, Android, Web
3. Descarga, selecciona y corta la imagen en un solo paso.
Mocker también admite el corte automático de Sketch y Adobe XD. Simplemente descargue el complemento:
Dirección de descarga:
Mockker: /download/idoc-ps. /?hmsr=baiduzhidao
Boceto:/descargar/idoc-sketch
adobe XD:/descargar/idoc-xd