Ejemplo diseñador personalización con diseñador de varias modelos de pegatinas

En este producto al cliente se le ofrece poder comprar pegatinas de diferentes formas con personalización gráfica para cada tipo de pegatina.

El cliente puede ajustar en el producto:

El ancho y alto de la pegatina.
La forma de la pegatina.
El material.
Acabados especiales.
La cantidad de unidades de pegatinas según opciones de cantidad. Compra mínima de 100 unidades de pegatinas.
El precio del pedido se muestra en tabla relacionada con las opciones de tiempo de producción.

En este producto el selector de lienzos de personalización muestra sólo uno. El correspondiente al tipo de pegatina seleccionada por el cliente en la característica llamada "Corte de pegatinas".

Creando del lienzo para personalización gráfica de uno de los valores de la característica "Corte de pegatinas"

Preparación de archivos:

Archivo JPG para la miniatura. Tamaño igual o inferior a 1 MB.

Archivo PNG con fondo transparente con una imagen de la forma de la pegatina. Esta imagen va a ocultar lo que esté fuera de la zona transparente del PNG. Y además indicar el margen de sangrado.

Archivo PNG con fondo transparente con un icono de carga de imagen y opcionalmente con un marco de línea discontinua según el perímetro de la imagen. Esta imagen se utilizará para definir el área de reemplazo.

Creación del lienzo:

Nombrar el lienzo

Ajustar modo de color en "A todo color"

Ajustar tipo de imagen a subir en "Ambos"

"Texto" deshabilitado permitir añadir texto al cliente

Especificar para la vista del lienzo el ancho de 15 cm y el alto de 15 cm.

Cargar la imagen de miniatura preparada.

Guardar cambios

Edición del lienzo:

Subir la imagen PNG con la transparencia de la forma.
Opcional resetear el área de impresión y definir el área de impresión según el último objeto seleccionado. Esto redimensionará el área de impresión adaptándolo a la imagen que se ha utilizado.
Ir a interfaz de capas y bloquear la imagen para que el cliente no pueda manipularla.

Cargar la imagen preparada para mostrar y usar como área de reemplazo.
Escalar la imagen al tamaño del área de personalización y posicionar en la ubicación del área a personalizar. Definir la imagen como área de reemplazo haciendo clic en el icono de nube en la capa.

En interfaz de capas colocar la capa de la imagen PNG con la transparencia de forma en posición delante (clic en icono flecha arriba de la capa). O reposicionar manualmente.

Guardar cambios.

Repetir el proceso para crear los lienzos de los otros modelos de forma de corte de pegatinas con las imágenes correspondientes

Vinculando lienzo:

En este producto se ha vinculado el lienzo correspondiente a cada valor de la característica "Corte de pegatinas". El cliente al seleccionar un modelo de corte de pegatinas el selector de personalización de lienzo mostrará la imagen miniatura correspondiente al modelo seleccionado. El cliente al hacer clic en el selector de personalización accede al lienzo de personalización de ese tipo.

Previa selección del área de reemplazo el cliente carga su diseño y puede transformarlo. El cliente ve en tiempo real los cambios de la personalización. La imagen subida por el cliente quedará oculta en las zonas no transparentes del PNG que está bloqueado y verá los márgenes de sangrado y la línea de corte. Una vez conforme con la personalización para que sea guardada hace clic en botón "Hecho" , y la aplicación le lleva a la página del producto para que pueda añadirlo al carrito.

Cuando se añade al carrito el producto personalizado con el diseñador la aplicación guarda la personalización provisionalmente para que una vez tramitado el pedido esté disponible para descarga en el pedido.

Ver las siguientes capturas de pantalla el producto desde la vista del cliente.