Decir «hacemos webs a medida» no basta.
Cualquiera lo dice. Queríamos que la propia web lo enseñara, y que el día a día del estudio —clientes, cobros, contratos, correo— se llevara con herramientas hechas con el mismo cuidado que lo que entregamos.
CASO 06 / ZERO ART · PROYECTO PROPIOMARCA + WEB VIVA + CLIENTES + GESTIÓN
Lo que hacemos para otros,
primero lo hicimos para nosotros.
La marca, una web que se mueve, un analizador para quien todavía no nos conoce, un área privada para cada cliente y la app con la que llevamos el estudio: clientes, cobros, contratos, facturas, correo y un asistente propio. Todo diseñado y programado en casa.
Las pantallas son capturas reales de la web, del área de clientes y de la gestión en su modo de demostración, con negocios y datos inventados.
- Cliente
- ZERO ART · el propio estudio
- Alcance
- Marca · Web · Clientes · Gestión
- Tecnología
- WordPress + 3 plugins propios
- Hecho
- Diseño y código, en casa
01 / EL CASO EN 30 SEGUNDOSUn estudio pequeño
Un estudio pequeño
que vende criterio tiene que demostrarlo.
Un sistema entero, sin piezas de alquiler.
Una marca que se comporta. Una web viva con casos que se pueden probar. Un analizador y una carta para empezar. Un área de clientes. Y una app de gestión con correo propio, contratos, facturas y su asistente, Zeta.
Lo que enseñamos es lo que usamos.
Cada herramienta que proponemos a un cliente la hemos probado antes en nuestro propio estudio. Y cuando un cliente entra en su área o recibe un contrato, ve la misma marca, el mismo cuidado y el mismo orden.
- 3plugins propios de WordPress, sin tema ni plantillas
- 9secciones en la gestión, más su asistente
- 6tipos de documento: contratos, presupuesto y acta
- 6películas de caso, programadas a mano
02 / MARCAUna misma idea.
Una misma idea.
Todos sus estados.
La Z se reduce a tres segmentos: dos horizontales que fijan los límites y una diagonal que los conecta.
De esa decisión sale todo lo demás: la retícula de la web, el cursor de partículas, el icono de la app, el sello de los documentos y la forma en la que el campo vivo recibe al visitante. Berenjena para la presencia, papel para leer, violeta para actuar y citron para lo que está vivo.
SímboloSistema tipográficoColorRetículaMovimientoDocumentos
Una Z. Tres decisiones.
La retícula fija los extremos; el trazo recorre la forma. La proporción permanece aunque cambie la escala.
Símbolo resuelto
Del orden al carácter.
Tres segmentos paralelos se reorganizan. El central cambia de dirección y conecta los otros dos: aparece la Z.
Símbolo resuelto
Berenjena#462235 · presenciaPapel#F1F0E9 · lecturaVioleta#6552DF · acciónCitron#E5ED9F · lo vivo
ORGANIZAAaDM Sans
CONTRASTAAaInstrument Serif
ANOTAAaDM Mono
03 / LA WEB VIVAUna web que no se lee:
Una web que no se lee:
se recorre.
La portada tiene dos mitades. A la izquierda, el contenido, limpio. A la derecha, un campo de tinta y partículas que acompaña todo el recorrido: responde a lo que necesita quien visita, forma el símbolo de cada proyecto al llegar a él y se remueve con el cursor o con el dedo.
PRUÉBALO · CAMPO DE PARTÍCULASZERO ART
GRABACIÓN · PORTADA
Películas programadas.
Cada caso tiene su película. No es un vídeo editado: está escrita en código, se reproduce en la página por capítulos y se exporta fotograma a fotograma para la portada.
Pruébalo en cada proyecto.
Mover obras en Cimenta, elegir fechas en Lamacido, pedir turno en Pisaben o calcular un alquiler en Proa: cada caso se entiende tocándolo.
Pasar de un caso a otro.
Una barra de proyectos y una transición propia llevan de un caso al siguiente, y cada caso se abre también en una ventana sin salir de la portada.
Hasta el cursor.
Un cursor de partículas que se estira con la velocidad, se curva en los giros y reacciona a lo que se puede pulsar. En el móvil, el campo responde al dedo.
04 / PARA LOS CLIENTESAntes, durante
Antes, durante
y después de contratarnos.
ANTES · /tu-proyecto/
Analiza tu web.
Quien tiene web escribe su dirección y la ve a rayos X: unas 35 comprobaciones reales de SEO, estructura, móvil y velocidad, marcadas sobre su propia portada, con la comparación frente a su competencia y un informe para compartir.
DURANTE · /clientes/
Su área de cliente.
Cada cliente entra con su usuario y ve su proyecto: en qué punto está, sus entregas, sus cuotas con el enlace para pagarlas, sus documentos, el chat con el estudio y el visto bueno final.
UNA PUERTA, TRES ACCESOS
Cada uno entra donde le toca.
El botón «Acceso» de toda la web abre tres puertas: cliente (su proyecto, cuotas y documentos), trabajador (la gestión del estudio) y exportador (empresas que nos traspasan los archivos de un cliente). Y quien aún no tiene web empieza por una carta que dibuja su proyecto mientras escribe.
- ClienteProyecto, cuotas, documentos y chat
- TrabajadorLa gestión del estudio, según sus permisos
- ExportadorSube los archivos de un cliente, nada más
05 / LA GESTIÓNTodo el estudio,
Todo el estudio,
en una sola app.
La app con la que trabajamos cada día. Clientes, cobros, agenda, notas, documentos, mensajes, correo y facturas están entrelazados: tocas un cliente y aparece todo lo suyo. Se abre a pantalla completa en el ordenador y se usa con una mano en el móvil.
Lo que toca hoy.
Cobros vencidos con su botón de WhatsApp o de «Cobrado», la agenda del día, los mensajes sin leer y lo que Zeta ha visto que hay que mirar.
De la solicitud al contrato.
La solicitud de la web se convierte en cliente, se le prepara el contrato desde una plantilla y se le envía su acceso al área de clientes.
Las cuentas, claras.
Las cuotas cobradas se facturan con numeración correlativa, y la previsión de cobros de los próximos meses se ve de un vistazo.
EN VIVO · DEMO CON DATOS INVENTADOS
No te la enseñamos: pruébala.
Es la gestión de verdad, con negocios de ejemplo. Nada sale de tu navegador y se reinicia al recargar.
LO QUE HAY DENTRO
Trece pantallas. Elige una.
01 / HOY
Buenas tardes: lo que toca.
- Cobros vencidos y de hoy, con «Copiar enlace», WhatsApp y «Cobrado» a un toque.
- La agenda del día, los mensajes sin leer y las solicitudes nuevas de la web.
- La previsión de cobros de los próximos meses.
02 / CLIENTES
Una ficha por cliente.
- Servicios, cuotas, accesos, documentos y mensajes en una tarjeta.
- Filtros por estado: con cuotas, vencidos, pagados.
- Desde la ficha se escribe, se cobra o se crea un documento.
03 / FICHA
Todo lo suyo, al tocarlo.
- Su acceso al área de clientes: usuario, contraseña y botón para enviárselos por WhatsApp.
- Quién es, qué ha contratado, cómo paga, sus cuotas y su entrega.
- Mensajes, documentos, notas, correos y su nube de archivos.
04 / CUOTAS
Pagos a medida.
- Entrada y cuotas con el número, el importe y las fechas que se acuerden.
- Cada cuota con su enlace de pago, que el cliente ve en su área.
- Al marcarla cobrada, sale su factura.
05 / AGENDA
Un solo calendario.
- Reuniones, llamadas, plazos y entregas.
- Los cobros previstos aparecen solos en su día.
- Las notas con fecha también.
06 / NOTAS
Un cuaderno que entiende.
- @cliente enlaza la nota a su ficha; #etiqueta la clasifica.
- Escribir «viernes» o una fecha la pone en la agenda.
- Listas de tareas con su avance, colores y notas fijadas.
07 / DOCUMENTOS
Contratos y documentos.
- Contrato web, de app y de marca, presupuesto, acta de entrega y documento libre.
- Borradores, definitivos, enviados y aceptados, en columnas.
- Sale en PDF o en Word, o se envía al área del cliente para aceptarlo.
08 / CONTRATO
Del borrador a la aceptación.
- Cláusulas escritas a medida del proyecto: objeto, calendario, precio, propiedad intelectual y datos.
- Estados con fecha: borrador, definitivo, enviado y aceptado.
- Registro de aceptación con la huella SHA-256 del texto aceptado.
09 / MENSAJES
El chat con los clientes.
- Lo que escriben desde su área llega aquí, con aviso por email.
- Respuestas rápidas para lo de siempre.
- Cada conversación, junto a la ficha del cliente.
10 / CORREO
El buzón del estudio, dentro.
- Recibidos, enviados, borradores, archivo y spam del correo propio del estudio.
- Los correos de clientes llevan su ficha al lado.
- Atajos de teclado para moverse, responder y archivar.
11 / FACTURAS
Facturación sin sustos.
- Se emiten desde las cuotas cobradas.
- Numeración correlativa por año: ZA 2026/031.
- Cada factura congela sus datos; para corregir, rectificativa.
12 / USUARIOS
Quién entra y qué puede tocar.
- Trabajadores con permisos por área: clientes, documentos, facturas, correo…
- Exportadores que solo pueden subir archivos de un cliente.
- Y los accesos de los clientes, en el mismo sitio.
13 / ZETA
Un asistente propio.
- Mira cobros, facturas, contratos y mensajes, y avisa de lo que hay que mirar.
- Entiende peticiones en castellano normal, como un contrato con sus cuotas.
- Con una clave de Claude, razona y redacta, siempre en borrador.
Y EN EL MÓVIL
Con una mano, entre visita y visita.
Navegación abajo, crear con el pulgar, hojas que se cierran deslizando y la misma información, ordenada para pantalla pequeña.
06 / POR DENTROLo que no se ve
Lo que no se ve
también está diseñado.
Seis plantillas, ninguna de copiar y pegar.
Contrato web, de app y de marca, presupuesto, acta de entrega y documento libre. Se rellenan con los datos de la ficha, se ajustan por cláusulas y el cliente los acepta desde su área. Queda el registro: fecha, persona y huella SHA-256 del texto.
El correo del estudio, sin salir de la app.
Un cliente de correo escrito para la gestión, conectado al buzón del estudio por IMAP y SMTP. La contraseña del buzón se guarda cifrada y no llega nunca al navegador. Cada correo de un cliente aparece con su ficha al lado.
Numeradas, congeladas y sin borrar.
Numeración correlativa por año. Cada factura congela los datos del emisor, del cliente y los importes en el momento de emitirla, y no se borra: si hay que corregir, se emite una rectificativa.
Cuotas como se acuerden.
Número de cuotas, importes, meses y fechas a elegir. Cada cuota lleva su enlace de pago, el cliente la ve en su área y el estudio la marca cobrada con un toque, o recuerda el pago por WhatsApp.
Cada trabajador ve lo suyo.
Permisos por área para el equipo, exportadores que solo suben archivos y clientes con su propio acceso. Lo que alguien no puede usar ni siquiera se le muestra, y el servidor lo bloquea igualmente.
Las claves, guardadas como se debe.
Los accesos de cada cliente (hosting, dominio, redes) se guardan cifrados y solo se muestran a quien tiene permiso. Las contraseñas del área de clientes se comprueban como huella, con límite de intentos.
Un asistente que no hay que alquilar.
Un sistema propio que mira la gestión mientras trabajas y entiende peticiones en castellano. Opcionalmente se conecta a Claude con una clave que vive cifrada en el servidor: entonces entrevista, redacta y lo deja todo en borrador. Nada se envía sin un clic.
Ayuda que llega con contexto.
Un tercer plugin pone un chat de soporte dentro de la gestión de nuestros clientes. Lo que escribe su equipo llega al estudio con la pantalla, el dispositivo y los errores técnicos, para resolverlo antes.
CÓMO ESTÁ HECHO
Sin piezas de alquiler.
WordPress como base, y encima tres plugins propios: la web del estudio, la gestión y el soporte. Sin tema, sin constructor visual y sin plantillas: el HTML, el CSS y el JavaScript están escritos a mano, y las películas, en código.
- ZERO ART — Web del estudioLa web, el área de clientes, el analizador y las solicitudes.
- ZERO ART — GestiónLa app del estudio: clientes, cobros, documentos, facturas, correo, nube, usuarios y Zeta.
- ZERO ART · SoporteUn chat de soporte dentro de la gestión de nuestros clientes, que llega al estudio con la pantalla, el dispositivo y los errores técnicos.
Si lo hemos hecho
para nosotros,
podemos hacerlo para ti.
Una marca con criterio, una web que trabaja y, si hace falta, las herramientas para llevar tu día a día. Empieza analizando tu web o cuéntanos qué necesitas.
Conoce el diseño de marca y el desarrollo web a medida.