Proyectos · Caso

Qi Gong Barcelona, una tradición milenaria con los precios puestos

Diseño webIdentidad digitalDesarrollo WordPressSalud y bienestar 2024
Qi Gong Barcelona, una tradición milenaria con los precios puestos
qigong.barcelona · 5 páginas · 7 tarifas públicas
El encargo

Cai Yutian empezó en las artes marciales a los ocho años, en Pekín, con el maestro Zhao QuanFu. Ahora enseña Qi Gong en Barcelona y hace Tui Na, el masaje terapéutico de la medicina tradicional china, en una clínica del barrio del Congrés. Un profesor, una práctica y ninguna estructura detrás.

El encargo era su primera web. No un catálogo ni una tienda: la página que convence a alguien que ha oído hablar del Qi Gong y no sabe si es para él, que explique qué es, quién lo enseña y qué cuesta, y que acabe en un correo o una llamada.

Qué hicimos

Empezamos por el silencio. Agua quieta a pantalla completa, un verde pino casi negro como único color de marca y una serif incluso en el menú —algo que casi nadie hace—. Antes de contar nada, la web tenía que sonar a lo que vende: calma y ninguna prisa.

Pusimos las siete tarifas en la web. Cuatro de Qi Gong y tres de Tui Na, con lo que entra en cada una: clases semanales, meditación guiada mensual, sesiones individuales y packs de cinco y de diez. Quien enseña solo no puede permitirse que el precio sea una conversación incómoda por correo.

Contamos a la persona, no el método. El retrato del maestro, su historia desde Pekín y las fotos reales de clase —corrigiendo a una alumna, un grupo en un centro cívico— hacen el trabajo que ningún texto sobre la energía vital puede hacer. La web se vuelve creíble ahí.

Diseño, web y programación desde cero. WordPress con tema hijo propio, Bellefair y Raleway autoalojadas en el servidor en vez de servidas desde fuera, y cinco páginas: inicio, nosotros, QiGong, Tui Na y contacto, esta última con formulario y mapa. Las cuatro primeras se levantaron el 20 de febrero de 2024; la de Tui Na llegó en abril, cuando arrancó el servicio.

La clave

Publicar los precios fue la decisión de diseño, no una ficha técnica. En un sector donde casi nadie los enseña, poner las siete tarifas —packs incluidos— antes de que nadie pregunte es lo que separa a un profesor de un misterio. Todo lo demás está construido para que ese momento no chirríe: aire, un solo color y ningún reclamo.

8
años tenía el maestro cuando empezó, en Pekín
7
tarifas publicadas, sin letra pequeña
6
beneficios del Qi Gong explicados uno a uno
5
páginas en toda la web
2
disciplinas: Qi Gong y Tui Na
1
color de marca en todo el sitio
Cómo está hecho

La pareja tipográfica es Bellefair, una serif de contraste alto, para todo lo que se mira, y Raleway para todo lo que se lee. Las dos van autoalojadas con @font-face, no cargadas desde Google Fonts: es una decisión técnica, no el valor por defecto del constructor, y se nota en que la web no depende de un tercero para pintar su titular. El detalle raro del sistema es el menú, a 24 px en serif; el cuerpo va en Raleway a 17/26,9.

De color hay uno solo: el verde pino #02423F, con cuarenta y dos usos como texto y diez como fondo. Lo acompañan un filete verde al 14 % de opacidad, un verde grisáceo para el texto sobre fondo oscuro y un blanco roto cálido. Los botones son píldora completa, 25 px de radio, y los campos del formulario casi rectos, 3 px: ese contraste es el único gesto expresivo de toda la web.

Debajo hay poca máquina y está bien así. WordPress con tema hijo propio, contenido a 1.140 px con mucho aire vertical, formulario de contacto con consentimiento de privacidad y un mapa incrustado con la dirección de la clínica. Sin reservas en línea, sin tienda y sin área privada: cinco páginas que el cliente puede mantener y que no se rompen solas.

Cómo fue
01El encargoUn maestro, una práctica y ninguna web
02La decisiónEmpezar en silencio y acabar con los precios puestos
03La webFebrero de 2024: cuatro páginas y el sistema entero
04La ampliaciónAbril de 2024: Tui Na, con sus tres tarifas
Galería · el proyecto en imágenes (clica para ampliar)
Una portada que empieza por el silencio. Qué es el Qi Gong y para qué sirve, sin rodeos. El maestro, en su clase y no en un banco de imágenes. La misma calma en una pantalla de bolsillo. El segundo servicio, añadido dos meses después de abrir. Dónde es la clase y cómo apuntarse, en la misma pantalla. Siete tarifas publicadas, sin pedir que llames para saber el precio. Tipografía grande y línea corta: se lee de pie.
Concepto y sistema · moodboard, tipografía, componentes y composición
La decisión de partida: primero el silencio de una foto a pantalla completa, después los precios sin rodeos. Una serif también en el menú, un solo verde y botones en forma de píldora de 25 píxeles. Una portada que ocupa toda la pantalla y siete bloques que alternan blanco y verde. El titular mide 46 píxeles en los cuatro anchos: la portada no se achica, se recorta. El único movimiento de la web es un botón que se vacía al pasar por encima.
Así diseñamos todos los casos →
"Tradición Milenaria, Enseñanza Moderna"qigong.barcelona

¿Quieres un resultado así para tu proyecto?

Siguiente proyecto

Poni Club Catalunya, cuatro escuelas en un patio y cuatro puertas en la portada