Le Puzz
Sunny Sunday Circular é un tabloide cheo de misterios.
Le Puzz é un sistema de comercio electrónico maximalista para tendas boutique, construído sobre unha base bicolor: amarelo intenso tipo panal combinado con negro puro, sobre un fondo gris perla frío. O seu estilo é unha mestura entre un xornal antigo e un crebacabezas: o corpo do texto está en Times con serifas, mentres que os titulares están nunha fonte personalizada, Times Now, rompendo deliberadamente coas convencións tradicionais do comercio electrónico que se basean en fontes sans-serif. A propia interface mantense sinxela e baseada en cuadrículas, o que permite que o impacto visual sexa transmitido polo envase do produto (composicións densas e ilustradas cheas de xoguetes). Os controis da interface son bastante robustos: botóns cun bordo negro sobre un fondo amarelo, iconas en forma de pílula, tarxetas cun radio de 12 px e un espazado xeneroso entre letras para maiúsculas pequenas, o que lle dá incluso ao botón "ENGADIR RÁPIDO" un toque editorial.
Unha cuadrícula clásica de comercio electrónico cun deseño editorial distintivo. A cabeceira é unha tira amarela en forma de panal cun bordo negro de 1 ancho, que alberga un logotipo centrado e unha fila adicional de botóns de navegación. Abaixo, enriba dunha cuadrícula de tres columnas de produtos sobre un fondo gris, hai unha cabeceira de benvida centrada na fonte Times Now. O elemento principal é un bloque de fotos centrado con esquinas redondeadas (40), flanqueado por dúas tarxetas de produto. Mantense o ritmo das seccións: amplo espazo vertical (30), superficies amarelas e grises alternadas e unha anchura máxima de aproximadamente 4,5 cm, centrada na páxina. As tarxetas de produto teñen o mesmo tamaño e están dispostas nunha ordenada cuadrícula de tres columnas con espazos de 5 cm. O deseño é simétrico e está ligado á cuadrícula, sen composicións asimétricas nin elementos superpostos.
O elemento visual é a fotografía do produto. As caixas dos crebacabezas están fotografadas de cheo sobre un fondo branco/neutro e logo colócanse sobre un fondo de estudio azul cálido ou natural. A imaxe principal mostra unha persoa sostendo varias caixas de crebacabezas, un obxecto de estilo de vida, capturado con enerxía natural. A propia embalaxe é rica, ilustrativa e maximalista: unha multitude de xoguetes, produtos alimenticios e personaxes en cores primarias brillantes con contornos negros grosos, deseñados para parecer unha ilustración dun libro infantil esparexida por un crebacabezas de 500 pezas. Sen gráficos abstractos, sen renderizacións en 3D, sen iconografía máis alá dunha única lupa: os propios crebacabezas son a linguaxe visual.
Paleta
Marca
- Honeycomb Yellow
#ffd931— A cor principal da marca, a barra de título, os botóns de acción principais, o estado activo da navegación, a cor de subliñado da ligazón, o recheo de acento: a única nota de cor arredor da cal xira todo o demais.
Neutro
- Carbon Black
#000000— O texto principal, os bordos grosos, os contornos dos botóns, os contornos das iconas e o texto de navegación son a base estrutural de todo o sistema. - Ink Black
#231f20— Texto secundario, texto principal, bordos dos botóns, bordos dos campos de entrada: unha cor lixeiramente máis cálida, case negra, para unha sensación máis suave. - Pearl Gray
#c8cbcd— Lenzo de páxina, fondos de tarxetas de produto, un escenario rechamante onde aparecen as cores amarela e negra. - Fog Gray
#a6a8aa— Superficies de insignia tenues, fondos de chip secundarios e recheos sutís na interface de usuario. - Smoke Line
#d6d6d6— Divisores finos, separadores discretos de mesa/tarxetas.
Tipografía
de 11 a 47 px · 6 pasos
- Times Now — substitución: Playfair Display · contornos 100, 400 · Unha fonte serif para titulares e subtítulos, que se usa para títulos principais, nomes de produtos e títulos de seccións. A fonte ultralixeira de 100 puntos cun paso entre liñas de 47 píxeles crea unha sensación editorial alta e case condensada; as letras condensadas (alturas de liña de 0,87 a 0,90) permiten colocar titulares grandes preto do texto que os acompaña, imitando un póster impreso.
- Times — substitución: Times New Roman · contornos 400 · O corpo do texto con serifas é unha escolla inesperada para unha tenda en liña, xa que lle dá a todo o sitio un aire literario, semellante ao dun catálogo. O pequeno interlineado (1,15) fai que os parágrafos sexan compactos e lexibles.
- Helvetica Neue — substitución: Helvetica · contornos 100, 400 · O texto pequeno na interface de usuario, o texto nos botóns e o microtexto están configurados en fonte de 11 px cun espazado entre letras grande (0,0730 em), o que crea a sensación de escribir en maiúsculas mesmo a unha temperatura corporal confortable.
Intervalos e forma
| Propósito | Significado |
|---|---|
| Densidade | denso |
| Paso básico | 15px |
| Radio do botón | 12px |
| Radio da tarxeta | 12px |
| Sombras | sen bordos en vez de sombras |
| Entre seccións | 30-40px |
| Largura da páxina | 1200px |
A IA creará o teu sitio web ao estilo de Le Puzz e o encherá
- Enche con produtos e publicacións a través da ligazón: Instagram, TikTok, Facebook.
- Transfire contido do teu sitio antigo: só tes que especificar o enderezo.
- Deseño moderno no mellor motor: React ( Next.js) con renderización de servidor e optimización SEO listas para usar.
- Optimización SEO totalmente automatizada para resultados de busca e recomendacións de redes neuronais.
Estilos semellantes
- Agence Foudre — A portada da revista é dunha cor rosa suave que lembra ao batom.
- INVERSA — Un terminal de campo topográfico á medianoite. Un panel de comandos escuro, onde unha fonte editorial masiva e unha única capa de marcadores verde neón se superpoñen a imaxes de satélite da Terra, cada etiqueta monocromática, coma se lese as coordenadas da misión.
- Acne Studios — Un espazo de galería minimalista cheo de fotografías vibrantes: unha revista de moda disposta sobre mármore
- GTE — Terminal comercial detrás da iluminación da galería
- Diabla — Un patio mediterráneo ao mediodía: paredes rosadas descoloridas polo sol, un toldo de lona vermella brillante e titulares editoriais con serigrafía que se estenden polo ceo.
- Subset — Boutique editorial feita de liño cru
- Cursor — Un acolledor taller de pergamiño, iluminado por brasas fumegantes
- MindMarket — Un acolledor libro de conto de fadas sobre papel crema: un lenzo editorial amigable onde grandes titulares de Inter e personaxes de papel recortados conviven nunha superficie suave como unha pegatina bañada polo sol.
- Lamborghini — Cor negra da carrozaría na sala de exposicións, baixo os focos: un coche amarelo
- Amplemarket — Un lugar de traballo bañado polo sol cheo de confeti
- Getharvest — Un escritorio na hora dourada: un lenzo cor crema cálido, postais brancas colgadas no lenzo e unha única chama laranxa brillante.
- Drive Capital — Póster retro de viaxe por estrada en papel quente