Skip to main content

E3. Diseñador Módulo - Crear lienzo Interfaz

1. Crear lienzo interfaz primer paso


image.png
Elemento

Función

Crear lienzo

Botón texto que abre la interfaz de creación de un nuevo lienzo.



2. Crear lienzo interfaz segundo paso

Al hacer clic en botón crear lienzo.

image.png

Elemento

Función

Nombre

Nombre a asignar al lienzo. Requerido.

image.png



Descripción

Para reflejar información de interés para los administradores.

image.png

Modo de color selector

Permite limitar la personalización según modo de color. Disponibles opciones de a uno, dos, tres, cuatro colores y  "A todo color".  

image.png

Tipo de imagen a subir selector

Permite limitar la personalización según el tipo de imagen a subir. Disponibles cuatro opciones, ninguno, vector (SVG) , trama (mapa de bits JPG o PNG) o ambos (trama y vector).

image.png


Texto habilitado

Botón para permitir o no al cliente añadir y editar un texto. En magenta lo permite. En blanco no lo permite.

image.png


Ancho

Tamaño de ancho del lienzo. Afecta a al tamaño de ancho de la vista del diseñador.

image.png

Alto

Tamaño de alto del lienzo. Afecta a al tamaño de ancho de la vista del diseñador.

image.png



Botón emplear medidas definidas en el producto

Marcado (en magenta),  si hay una característica de tipo tamaño, el lienzo se adaptará automáticamente.  Si se marca este botón:

  • No se puede subir ningún archivo desde el gestor al lienzo.
  • No se debe vincular el lienzo a ningún valor .

image.png

Miniatura

Imagen para la vista del selector de lienzos desde el lado del cliente. Tamaño máximo 1 MB (380 x 380 pixeles a 72 ppp). Requerido.


image.png



Botón "CREAR"

Guardar el nuevo lienzo creado.


3. Interfaz en modo lista actualización lienzo 

image.png

Elemento

Función

Miniatura y botón

Vista desde el gestor de la imagen miniatura del lienzo creado.

image.png
En el supuesto de tener más lienzos creados en un producto, por cada uno se mostrará su imagen miniatura, y su nombre.


image.png

Actualizar

image.png

Botón para acceder a la interfaz de actualización  del lienzo.

Duplicar

image.png

Botón duplicar lienzo

Eliminar

image.png

Botón eliminar lienzo.



4. Interfaz general de actualización de lienzo 

image.png

Elemento

Función

Botón "VOLVER AL PRODUCTO"

Para volver a la interfaz principal de la ficha de producto.

Botón "VER EN LA TIENDA"

Para ver el diseñador en la vista del cliente.

Botón "GUARDAR"

Guardar cambios hechos en el lienzo.

Botón "RESETEAR ÁREA DE IMPRESIÓN"Se entiende como área de impresión el tamaño del lienzo.

Botón "DEFINIR EL ÁREA DE IMPRESIÓN SEGÚN EL ÚLTIMO ELEMENTO SELECCIONADO"Ajusta el área de impresión al tamaño del objeto del archivo seleccionado de una capa.




5. Herramientas menú izquierdo  - Interfaz crear lienzo

image.png

Elemento

Función

Subir archivo

image.png

Botón para abrir subida de archivo. Cada archivo se añade como una capa.

image.png

Gestor de capas

image.png

Abre el gestor de capas. Vista de una capa.

image.png


5.1 Interfaz de capas

image.png


Elemento

Función

Botón 

image.png

Cambiar color de capa (archivo subido).

Nombre del archivo

La capa se crea con el nombre del archivo subido.  Y se la asigna un número de capa.
Para ver el nombre completo del archivo que tiene la capa,  poner el cursor encima.

image.png



Icono de flecha arriba

Botón poner capa delante de todas.


image.png


Icono nube con flecha

Botón establecer capa como área de reemplazo. La capa que está en este estado es en la que el cliente podrá subir archivos.
Puede haber más de un área de reemplazo en un lienzo.

image.png

Icono bloque líneas

Ordenar manualmente las capas. al poner el cursor encima se convierte en un aspa que permite hacer clic y arrastrar la capa a otra posición.

image.png

Icono candado

Botón para bloquear capa.
No bloqueada

image.png

Sí bloqueada

image.png

Icono x en un círculo
image.png

Botón para eliminar capa.



El ajuste de modo de color "A todo color" es el único que permite la subida de imágenes de tipo mapa de bits y de tipo vector. El resto de modos de color sólo permiten carga de vectores.


Además de estos elementos de la interfaz se encuentra la columna derecha. Es la parte de visualización. En ella hay más ajustes para el lienzo. Una de las interfaz a tener en cuenta es la siguiente:





Se ha limitado el tamaño máximo del archivo de imagen jpg o PNG a subir por el cliente a una medida de 3.500 x 3.500 px. Tamaños superiores a este pueden alterar el correcto funcionamiento de la aplicación.

El diseñador no redimensiona la imagen. Al pedido llegará la imagen en el tamaño y resolución subida por el cliente.

Para envío de imágenes de tamaño superior utilizar aplicaciones web gratuitas para envío de archivos de mayor tamaño que el limite especificado. Como por ejemplo; Wetransfer.


A continuación se muestran y explican ejemplos de productos creados para personalización con el diseñador.


Elemento

Función

Crear lienzo botón

Botón texto que abre la interfaz de creación de un nuevo lienzo.

Eliminar

Botón eliminar lienzo

Duplicar

Botón duplicar lienzo

Guardar cambios. 

Botón guardar.