Limpieza residencial y comercialBranding

Limpiaba desde hacía años y nadie sabía su nombre

Una empresa de limpieza de San José que llevaba años entrando en casas particulares sin que nadie supiera cómo se llamaba. Le construimos la marca entera —manual propio, uniforme, papelería, señalética, vehículo y sitio web— dibujada desde el primer trazo para sostener también el trabajo comercial que todavía no hacía.

Cliente: Bay Area Janitorial Cleaning Services
Tipo de negocio: Limpieza residencial y comercial
Área de servicio: Branding
Ubicación: San José, California
Año: 2026

Servicios entregados

Diseño de marca
Manual de identidad
Papelería
Uniformes y textil
Señalética
Rotulación de vehículo
Diseño web
Desarrollo web
Hosting y despliegue

24 + 24páginas de manual de identidad y páginas de web, todas construidas sobre la misma marca

Visitar el sitio

El reto

Bay Area Janitorial llevaba años limpiando casas particulares en San José. Un solo servicio, hecho bien, y ni una sola pieza que dijera quién estaba detrás. No una marca floja: ninguna. Cada volante lo resolvía quien lo imprimiera, el uniforme no decía nada, la camioneta iba desnuda y la web era una plantilla que no se parecía a nada de lo anterior. El trabajo entraba por recomendación, de una casa a la de al lado, y justo ahí estaba el techo: el boca a boca llega hasta donde llega, y para tocar la puerta de una oficina o un edificio hay que parecer una empresa antes de que te abran. Había que empezar por el principio, y el principio era decidir qué aspecto tenía esta empresa.

Lo que hicimos

Lo hicimos entero, del identificador al despliegue. La marca no se dibujó para el negocio que era, sino para el que iba a ser. La pregunta —¿casas u oficinas?— se respondió poniendo las dos: una casa a un lado, los edificios al otro, y entre ellos la espuma y los utensilios, todo montado sobre una ola que los une. El día que se entregó ese identificador, la empresa aún solo limpiaba casas; los edificios llevaban meses dentro del logo esperando su turno. La construcción se levantó sobre las proporciones de la letra «B» a 23 puntos, y de ahí salió un manual de veinticuatro páginas: área de respeto medida en el valor X, reducciones probadas hasta el 30 %, cinco variantes del identificador, dos azules primarios con cuatro colores de apoyo, Montserrat en cuatro pesos, el sistema gráfico de ondas y burbujas, y seis maneras de romperlo dibujadas una por una. Después lo bajamos a lo que se toca: overall, papelería, colgador de puerta, toalla, señal en A, bandera y rotulación del vehículo. Y sobre esa base construimos el sitio: la paleta convertida en fichas de diseño, con el contraste de cada combinación fijado en pruebas para que nadie pueda romperlo por descuido, y la Montserrat original del manual servida al navegador en vez de una copia parecida.

El resultado

Una empresa que antes no tenía imagen ahora se reconoce igual en el bordado del overall, en el vinilo de la camioneta y en la pantalla del teléfono, porque las tres salen del mismo archivo y de la misma regla. Y la camioneta rotulada trabaja también cuando está parada: cada casa donde entra a limpiar deja un anuncio en esa calle durante toda la jornada. Hoy el negocio se presenta como lo que es —residencial y comercial— sin tener que explicar antes quién es, que es justo lo que le faltaba para pasar de las casas a los edificios. La web son veinticuatro páginas que se sirven ya escritas, sin que un servidor tenga que componerlas en cada visita, y funciona igual de bien en el móvil, que es desde donde llama la mayoría. El teléfono y el correo están a un toque desde cualquier página, y un botón flotante compone el mensaje de WhatsApp con el nombre y la consulta ya dentro, para que al negocio le llegue una petición y no un «hola».

Quiero un proyecto así

El manual de marca

Una casa y unos edificios, sin elegir

La primera decisión fue no partir el negocio en dos. El identificador pone la casa a un lado y los edificios al otro, y entre ellos la espuma y los utensilios, todo sobre una ola que los une y que después reaparece por todo el sistema gráfico. La construcción no se dejó a ojo: se levantó sobre las proporciones de la letra «B» a 23 puntos, y esa medida es la que reparte los elementos y el texto.

La X que mide el aire, y hasta dónde encoge

Alrededor del identificador queda un margen libre igual al valor X de su propia construcción, y ese espacio no lo ocupa nada. La reducción también se probó: hasta el 75 % el imagotipo completo sigue leyéndose; por debajo entran las versiones simplificadas, y al 30 % ya solo trabaja el símbolo de los destellos. En la web esa regla vive dentro del componente que pinta el logo, así que no depende de que alguien se acuerde.

Dos azules que mandan, cuatro que acompañan

El Azul Francés es el color de la marca y el Azul Gris lo sostiene; detrás vienen la Niebla del Océano, la Nieve Brillante, el Grafito y el Girasol Oro. Cada uno se documentó con su HEX, su RGB y su CMYK, y en la web se le añadió algo más: su relación de contraste medida. El azul principal da 9,96:1 sobre blanco y sirve para texto; el Azul Gris se queda en 2,74:1 y el oro en 1,79:1, así que ninguno de los dos puede pintar una letra sobre fondo claro —y hay una prueba automática que lo impide—.

Montserrat, y solo cuatro pesos

Una sola familia para toda la marca, en Medium, SemiBold, Bold y ExtraBold. El manual reparte los papeles —los pesos altos para titulares y rótulos, el Medium para el texto corrido— y la web no añade ninguno por su cuenta. Los archivos que se sirven al navegador son exactamente los del paquete de identidad, no una versión parecida descargada aparte: es la diferencia entre que lo impreso y lo digital se parezcan y que sean lo mismo.

Cinco versiones para cinco sitios distintos

El imagotipo completo es la versión por defecto. El logotipo deja solo el texto cuando la franja es estrecha. El isotipo trabaja cuando la marca ya está identificada en el contexto. Los destellos dentro del círculo hacen de favicon. Y la versión en óvalo es obligatoria en cuanto debajo hay una fotografía, que es donde una marca sin fondo propio se pierde.

Ondas, burbujas y un degradado

El sistema gráfico no se inventó aparte: son tres piezas que salen del propio identificador. Las líneas onduladas repiten su ola, el degradado central aporta el brillo, y las burbujas con destellos conectan con lo que hace el negocio. En la web las burbujas no son un adorno estático —flotan—, pero la animación es CSS puro y su desplazamiento se mide en porcentaje del contenedor, no de la ventana: así una banda baja y un héroe alto se comportan igual sin configurar nada.

Seis maneras de romperla

El manual dedica una página a lo que no se hace, dibujado y no solo enunciado: colores fuera de la paleta, cambios de proporción, sombras, elementos movidos, otra tipografía y rotaciones. No están ahí para limitar a quien diseñe, sino para que la marca sobreviva a las manos por las que va a pasar. En la web esas seis prohibiciones dejaron de depender de la buena memoria: el logo solo se pinta a través de un componente que conserva su proporción, y ni el código ni la revisión admiten una sombra o un giro encima.