Marca · Imágenes y texturas

Imágenes y texturas

Tratamiento fotográfico y recursos gráficos definidos en el styleguide original (hojas 05–06). El sitio del DS es 100% tipográfico/grid/logo — sin fotografía todavía — pero la regla queda documentada para reportes, redes y presentaciones que sí la usen.

Fotografía

Regla obligatoria: escala de grises o desaturada, con acentos en lima #B5FF00. Nunca color completo, nunca lima como color de piel/fondo — el lima es acento, no relleno.

01 Alto contraste

Luces duras, sombras profundas. Nada de tonos medios planos.

02 Tecnología

Overlays de datos/HUD cuando aporten, nunca decorativos.

03 Acción

Capturas en movimiento — rendimiento, no pose.

04 Enfoque

Encuadres cerrados. El dato o el gesto, no el paisaje.

Sin archivo de foto real todavía en el proyecto — reference/ no tiene fuentes fotográficas versionadas. Esta página documenta la regla para cuando exista un asset real; no se fabrica una foto de stock para "completar" la demo.

Texturas de marca

Cinco recursos definidos en el styleguide (hoja 06). Dos ya construidos y en uso real en el sitio; tres pendientes.

Implementada Malla de datos

Grid blueprint fijo detrás de todo el sitio (.mesh en BaseLayout.astro), enmascarado con un radial-gradient para desvanecerse hacia los bordes.

Implementada Pixel grid

PixelField.astro — el píxel del isologo como motivo de datos. Modo cascada (materializa desde un ancla) o uniforme (densidad pareja, para fondos).

Pendiente Líneas dinámicas

Líneas finas, punteadas o en ángulo recto — transmiten conexión y flujo. Sin implementar aún.

Pendiente Contornos topográficos

Curvas de nivel como fondo de datos. Sin implementar aún.

Parcial Gradiente lima

Usado puntualmente (ticks de Frame.astro, acentos), no como fondo de sección todavía.

Patrones de datos

Las 4 texturas que Chart.astro superpone al color en donut/pie/polarArea (pattern, default true) — no depender solo del color para distinguir segmentos (daltonismo, impresión en B&N). Réplica en CSS puro para esta muestra; en el gráfico real son CanvasPattern.

Diagonal /
Diagonal \
Puntos
Cruz