Diseño web Shopyy: Lash & Wigs, looks y detalles de producto

Descripción general del proyecto

En la web Shopyy de Lash & Wigs conectamos los looks de cabello y maquillaje con el detalle de los productos. Un collage de modelos presenta la categoría y después reúne mechones, pestañas y fotos de uso en una misma exposición. Banners de modelos, cuadrículas blancas y pie negro conectan colecciones, comparaciones y fichas.

ServiciosSectorPlataforma
Diseño y desarrollo web ShopyyBelleza y cuidado personalShopyy
Necesidades del proyectoMercado objetivoEstilo de diseño
Conectar looks de cabello y maquillaje con detalles del productoTienda en inglés con precios en dólares estadounidensesBanners con collage de modelos, cuadrículas blancas y pie negro
Presupuesto del proyectoEntregablesPlazo de entrega
CNY 6,800Inicio, estructura de categorías, fichas de producto, diseño adaptable y páginas de marca y contacto15 días

Reto de diseño

Pelucas y pestañas necesitan mostrar el efecto completo y su forma concreta. Las modelos establecen el estilo; fotos claras explican rizos, longitud y envases, dando a cada imagen una tarea distinta.

Estrategia: conectar el look con los detalles

El collage de modelos introduce la categoría; después, mechones, pestañas y fotos de uso comparten exposición. El inicio orienta, las categorías comparan y las fichas explican aspecto y opciones. Navegación y enlaces unen los niveles.

Poppins es la tipografía principal y Helvetica aparece en algunas explicaciones. Tamaño, peso y ancho de párrafo jerarquizan títulos, navegación y texto. Collages, cuadrículas blancas y pie negro continúan por las páginas, con grupos compactos y más aire entre secciones para imágenes, explicaciones y acciones.

Movimiento y funciones al servicio de la elección

Las fichas usan miniaturas de distintos ángulos y opciones de longitud. En móvil se conservan el contador de imágenes y la navegación plegada. Las interacciones ayudan a ver el producto y elegir longitud; el ritmo principal procede de secciones y desplazamiento.

Inicio: del look a los productos

Lash & Wigs: Inicio: del look a los productos

Combinamos imágenes de varias modelos en un banner horizontal con LASH & WIGS en el centro. Debajo aparece Top Sellers, reuniendo mechones rizados, pestañas y fotos de uso.

El texto blanco se superpone a las modelos, rodeado por una cabecera sencilla. La imagen establece el estilo y la lista blanca inferior presenta productos concretos: primero el look, después la selección.

Más vendidos: un lugar para cada formato

Lash & Wigs: Más vendidos: un lugar para cada formato

Mostramos mechones, sets de pestañas y fotografías de uso juntos, con tarjetas del mismo ancho para distintos formatos. Nombres y precios van debajo para comprobar el producto después de observar su forma.

La lista conserva fondo blanco y espacios regulares entre tarjetas. Los rizos oscuros se distinguen del fondo claro y los envases de pestañas de colores también son reconocibles en la cuadrícula.

Pestañas: formatos iguales para comparar modelos

Lash & Wigs: Pestañas: formatos iguales para comparar modelos

La categoría reúne efectos puestos, envases de sets y pestañas individuales en una cuadrícula. Título y herramientas del catálogo quedan arriba para definir el ámbito antes de comparar.

Nombres y precios breves aparecen bajo las imágenes, compactos dentro de cada tarjeta y con más espacio entre filas. Texto blanco y negro y fondo claro destacan contornos y colores de envases.

Mechones: rizos y longitud en zonas próximas

Lash & Wigs: Mechones: rizos y longitud en zonas próximas

La foto grande del mechón de rizo profundo va a la izquierda; nombre, precio, longitudes y acciones, a la derecha. El contorno domina la imagen y los botones de longitud se agrupan en una zona.

Un título sans serif grande y bordes claros distinguen opciones de longitud. El acceso amarillo al pago destaca abajo, manteniendo áreas independientes para imagen y especificaciones.

Detalles: explicar rizos e información de uso

Lash & Wigs: Detalles: explicar rizos e información de uso

Más abajo siguen la imagen grande y las miniaturas de varios ángulos; la columna derecha describe el producto en párrafos cortos. Fotos y texto continúan en dos columnas y después enlazan con reseñas.

Las miniaturas mantienen separaciones fijas y las explicaciones se agrupan con subtítulos y espacios. El cabello oscuro conserva contornos claros sobre blanco para pasar de la forma general al detalle.

Página de marca: contexto comercial en pocas palabras

Lash & Wigs: Página de marca: contexto comercial en pocas palabras

La página About Us presenta el negocio de ExcitingFashion en párrafos breves. Conserva la cabecera de producto y termina en un pie negro de comunidad y navegación, marcando límites claros.

Texto ligero y espacios amplios entre párrafos mantienen sencillo el cuerpo blanco. Esta página añade contexto sin repetir fotografías de productos y diferencia la función de cada sección.

Contacto: reunir los canales de comunicación

Lash & Wigs: Contacto: reunir los canales de comunicación

Bajo el título se agrupan indicaciones, WhatsApp y correo en una estructura de texto simple. Los canales quedan juntos para elegir cómo contactar después de leer.

El cuerpo blanco se separa del pie negro; texto a la izquierda e interlineado claro ayudan a encontrar información rápidamente, con un ritmo más ligero que las fichas.

Inicio móvil: conservar el banner y el orden de productos

Lash & Wigs: Inicio móvil: conservar el banner y el orden de productos

En móvil aparece primero el collage, luego Top Sellers y grandes fotos de producto. Conservamos el tema del escritorio para presentar la categoría de cabello y maquillaje también en pantallas estrechas.

La navegación superior se convierte en iconos y las fotos aprovechan más ancho. Espacio vertical entre banner, título y productos da a cada sección una zona de lectura propia.

Ficha móvil: mostrar primero la textura del cabello

Lash & Wigs: Ficha móvil: mostrar primero la textura del cabello

La ficha móvil empieza con la imagen grande y su número; siguen nombre, precio y longitud. Rizos y fibras ocupan suficiente superficie para confirmar primero la forma.

El texto se ajusta al ancho móvil, con espacio claro entre título y precio. Las columnas pasan a vertical, conservando el recorrido de imagen a especificaciones.

Conclusión: conectar la colección con sus detalles

En Lash & Wigs, la relación entre look y detalles guía collages, cuadrículas blancas y pie negro en inicio, categorías y fichas. Las imágenes expresan el tema, el texto explica y catálogo y opciones permiten avanzar. El móvil mantiene la secuencia para una experiencia visual y de navegación coherente.

Planifica una web Shopyy clara para tu marca

Comparte tu sitio actual, materiales de marca y páginas necesarias. Revisaremos productos, mercado y prioridades de contenido para definir juntos páginas, diseño y funciones adecuados.

AIRSANG

Reservar una consulta sobre Shopyy

Cuéntanos sobre tu marca y las necesidades de tu web para planificar juntos páginas, diseño y funciones.

    Creative Solutions for Global Brands

    AIRSANG delivers cost-effective website design and development, brand visuals, and cross-border ecommerce solutions for brands worldwide.

    Shopify Development

    WordPress Development

    Diseño de interfaces web

    Amazon Design