InicioProductosProductosWebBlocks UIWebBlocks CMSQuizTemDoDoneHerne PanelWebBlocks PlayWebBlocksEnfoqueArchivoContacto
Current WebBlocks UI documentation rendered with package assets
WebBlocks UI

Interfaces HTML-first que personas e IA pueden leer

Un sistema de UI visible en el código fuente, construido a partir de patrones explícitos, tokens de diseño y contratos de componentes, sin hacer de un runtime de framework la base.

Hablar sobre WebBlocks UI
fklavye.net WebBlocks Laravel ve AI odaklı ürün ekosistemi
fklavye.net · servicios web

Un producto, bases compartidas

WebBlocks UI se desarrolla con patrones reutilizables de interfaz, publicación y operación dentro de una familia de productos coherente.

Aktif fklavye.net ürünleri için görsel vitrin
Producto en la práctica

De la interfaz a la operación diaria

Una superficie de producto enfocada convierte decisiones explícitas en software que permanece claro, mantenible y listo para evolucionar.

Mira: Por qué WebBlocks UI (Episodio 01)

Un recorrido de 90 segundos por el modelo de seis capas, demos de código wb-* en vivo y patrones reales ya publicados. Montaje provisional: la subida oficial a YouTube llegará pronto.

Capacidades principales

Una base de UI práctica con reglas explícitas

WebBlocks UI mantiene comprensibles en el código fuente la estructura de la interfaz, las decisiones visuales y el comportamiento de los componentes.

Patrones HTML-first

Los patrones parten de HTML semántico que se puede inspeccionar, copiar y adaptar sin reconstruir un árbol de componentes oculto.

Tokens de diseño

Los tokens explícitos coordinan el color, el espaciado, la tipografía, las superficies y los estados de interacción en todas las interfaces del producto.

Contratos de componentes

Los componentes exponen una estructura clara y un comportamiento esperado para que desarrolladores y herramientas de operador puedan usarlos de forma coherente.

Sin runtime de framework como base

Los patrones básicos de UI no requieren un runtime de framework de aplicación ni una cadena de compilación npm como condición de partida por defecto.

Enfoque técnico

UI visible en el código fuente como disciplina de producto

El sistema favorece las bases nativas de la web, la mejora progresiva y una documentación que se mantiene cercana a los patrones que describe.

Bases nativas de la web

La plataforma del navegador ofrece la capa base, mientras que las utilidades y componentes añaden un vocabulario de producto coherente.

Mejora progresiva

El comportamiento interactivo se añade sobre un marcado ya usable, en lugar de convertirse en un requisito previo para entender la interfaz.

Contratos legibles por IA

La estructura visible en el código fuente y las convenciones explícitas facilitan que los agentes de IA y las herramientas de operador inspeccionen y modifiquen las interfaces de forma segura.

Interfaz real del producto

Un sistema de UI que se documenta a sí mismo

La documentación actual de WebBlocks UI, generada íntegramente con los activos, primitivas, patrones y hooks de JavaScript incluidos en el paquete.

Documentación actual de WebBlocks UI con navegación para fundamentos, layout, primitivas, iconos, patrones, utilidades, JavaScript y playground.
Página principal de la documentación de WebBlocks UI mostrando el sistema de patrones basado únicamente en el paquete.
Estado actual

En desarrollo activo de producto

WebBlocks UI es un producto activo. La documentación mostrada arriba se genera con el propio paquete actual; los patrones y ejemplos públicos seguirán ampliándose con las versiones estables.

Preguntar sobre WebBlocks UI
Límite operativo claro

Requisitos y estado de entrega

Lo que necesita el paquete actual, lo que sigue siendo opcional y cómo se gestiona hoy el acceso.

HTML-first, sin runtime de framework

Usa HTML estándar con el CSS incluido. Los iconos y el runtime de interacción son opcionales; no hay dependencia de Node, npm ni de ningún framework para su consumo.

Fija la versión que despliegas

Las aplicaciones deben consumir una versión concreta del paquete o del CDN y mantener el contenido y la identidad de marca específicos del producto en el proyecto anfitrión.

Adopción guiada por la documentación

La documentación y el playground actuales son las superficies de adopción visibles en el código fuente. Contacta con fklavye.net para preguntas de integración o de producto.