LILAOHU: asesoría legal clara, también en pantalla.
Junio de 2026 · sitio en línea
El sitio de una consultora legal y contable de Oruro y, detrás de él, un panel para publicar boletines, guías y modelos en PDF, y un portal donde cada cliente ve solo los documentos que el estudio le comparte.
Tecnología
HTML5
JavaScript
Firebase- Cloud Storage
- Google Sign-In
CSS3- Bootstrap
- Firestore
- PDF.js
- WCAG 2.2 AA
Servicios
El proyecto
Cliente e idea
LILAOHU S.R.L. es una consultora legal y contable de Oruro que asesora a empresas y personas en derecho comercial, tributario y aduanero, auditoría legal y, pronto, contabilidad. Necesitaba un sitio que transmitiera la seriedad del estudio y una forma ordenada de hacer llegar sus documentos a cada cliente.
Reto y objetivos
El estudio comparte con sus clientes boletines semanales, guías, calendarios y modelos de contrato, y lo hacía por correo y WhatsApp: archivos sueltos, sin saber quién los había abierto. Necesitaba un solo lugar para publicarlos, decidir quién ve cada uno y saber quién ya los leyó, con la misma imagen seria del sitio.
Solución y resultado
Diseñamos un sitio sobrio en el verde y el dorado de la marca, con una página por área de práctica y contacto directo por WhatsApp, llamada o correo. Todo el sitio cumple el nivel AA de accesibilidad: contraste, foco visible, zoom y títulos en orden.
Detrás del sitio construimos un panel donde el estudio publica cada documento en PDF y decide si lo ve todo el padrón o solo ciertos clientes, y un portal donde cada cliente entra con su cuenta de Google, ve lo nuevo, lo lee en pantalla y lo descarga.
Asesoría clara
Áreas de práctica explicadas sin jerga.
Un portal por cliente
Cada cliente ve solo sus documentos.
Publicar sin ayuda
Boletines, guías y modelos desde el panel.
Resumen del proyecto
Funciones principales
Dos públicos, una misma marca: el visitante que busca un abogado de confianza en Oruro y el cliente que ya trabaja con el estudio y espera su boletín de la semana. Cada uno tiene su puerta y las dos se ven igual de cuidadas.
Un sitio que inspira confianza
La portada dice en una frase qué hace el estudio y lleva a contactar en un toque. El verde profundo y el dorado vienen del logo, y la tipografía Poppins con acentos en Playfair Display le da un tono serio sin ser frío.
Cada área con su página
Derecho comercial, tributario y aduanero, y auditoría legal tienen su página con lo que incluye el servicio y un acceso al resto de las áreas. El contacto es directo: WhatsApp, llamada o correo, sin formularios que se pierden.
Un panel que resume el día
Al entrar, el equipo ve cuántos clientes activos tiene, qué publicó esta semana, cuántas lecturas hubo y quién leyó qué. Desde ahí publica un material, da de alta a un cliente o crea una categoría con un clic.
El portal del cliente
Cada cliente entra con Google y encuentra sus documentos con lo nuevo marcado, un buscador y un filtro por categoría. Los lee en pantalla con un visor propio o los descarga, y el estudio sabe que ya los abrió.
Desarrollo
Metodología
El sitio se genera como páginas estáticas con nuestro motor propio, rápido y fácil de mantener, y se publica en Firebase Hosting. El panel y el portal usan Firebase Authentication con Google, Firestore para los datos y Cloud Storage para los PDF, que se muestran con PDF.js. Todo se prueba en local con los emuladores de Firebase y datos de demostración, sin tocar la información real de los clientes.
Proceso
Mapa del sitio
Tres puertas: el sitio para todos, el portal para cada cliente y el panel para el equipo del estudio. Las páginas de servicio comparten una plantilla y suman las áreas nuevas sin rediseñar nada.
- Nosotrosel estudio
- Quiénes somos
- Profesionales
- Serviciosáreas de práctica
- Derecho comercial
- Derecho tributario y aduanero
- Auditoría legal
- Área de prácticaplantilla
- ContactoWhatsApp, llamada y correo
- Oficina en Oruro
- Portalacceso con Google
- Mis documentos
- Visor de PDF
- Panelequipo del estudio
- Inicio y actividad
- Material
- Categorías
- Usuarios
Interfaz
Un panel a la medida del estudio
El panel lleva el verde y el dorado del logo y se ordena alrededor de lo que el equipo hace cada semana: ver qué pasó en el portal, publicar un material y elegir quién lo recibe, y mantener en orden categorías y clientes.
Calidad
Accesible para todos
Medimos el sitio, el panel y el portal con axe-core en escritorio y celular, y corregimos cada hallazgo hasta llegar a cero.
Contraste que se lee
Los textos secundarios llegan a 6,7:1 sobre blanco y el botón dorado lleva texto oscuro, con 8,5:1. Los estados del panel (activo, inactivo, específico) también cumplen el mínimo AA.
Todo con el teclado
Los menús desplegables se manejan con flechas, Enter y Esc; los formularios atrapan el foco y lo devuelven al cerrar, y las confirmaciones empiezan en «Cancelar». En el celular se puede ampliar la pantalla sin límite.
Proceso
El estudio en el bolsillo
El equipo publica un boletín desde el celular y el cliente lo lee donde esté. Por eso el panel y el portal tienen su propia barra inferior, tarjetas en lugar de tablas y la acción principal siempre a mano.
Proceso
Páginas completas
La portada del sitio presenta al estudio de principio a fin, y la del panel reúne en una sola vista lo que pasó en el portal.
Marca
Tipografía
Una sans geométrica, clara en pantallas pequeñas y firme en los títulos. La acompaña Playfair Display en cursiva para las palabras que importan, como «legal y contable», un guiño a la tradición del derecho.
Poppins
RegularMediumSemiBoldBold
Marca
Colores
El verde profundo y el dorado salen del logo del estudio y sostienen todo, del sitio al panel. El negro cálido se usa para el texto y para los botones dorados, que con texto oscuro se leen sin esfuerzo.
Conclusión
LILAOHU tiene hoy un sitio a la altura de su trabajo y, listo para su siguiente etapa, un portal donde cada cliente recibe sus documentos en orden y el estudio sabe quién los leyó.
Casos
