Saltar al contenido

Apagada

El caso, de cerca

El proyecto

Se rediseñaron las páginas clave: la cobertura por países, las guías de facturación con mapa interactivo y la cobertura técnica, para que un contenido complejo se lea fácil.

Debajo, un CMS en Webflow de más de cien fichas con referencias cruzadas, alimentado desde Notion: el equipo edita donde ya trabaja y la web se actualiza sola.

El reto

Mejorar el diseño de páginas y componentes concretos y montar un CMS de más de cien elementos conectado con la base de datos del cliente.

Los detalles

Grabado en la web tal como se entregó, en Webflow. Hoy invopop.com es otra web.

01El mapa. Los países con factura electrónica obligatoria; al pasar, la ficha de cada uno.
La ficha de un país, en la web de Invopop
02La ficha de un país. Requisitos de factura y e-reporting, formato y plazos, sincronizados desde Notion con WhaleSync.
03Bajo control con la consola. Documentos, espacios de trabajo, facturas y flujos: cada apartado de la consola se enseña al pulsarlo.

De Notion a Webflow

Notion es la base de datos principal. WhaleSync sincroniza cada ficha campo a campo con el CMS de Webflow: casos de éxito, costes locales de facturación y los datos de cada país.

Color

La paleta de Invopop, por lo que se usa en la web entregada. Pasa por encima de cada color.

Fondo#FEFEFC58,2 %
Verde Invopop#00423538,2 %
Gris#6B727D2,1 %
Tinta#0B0B101,5 %

Uso medido en las grabaciones de la web entregada: cada píxel cuenta para el color más cercano; fotos y degradados aparte.

Tipografía

Titulares y texto, SöhneMuestra de Söhne
Detalles, Geist MonoMuestra de Geist Mono

Movimiento

Cómo se mueve Invopop, en su propia grabación. Arrastra la línea de tiempo.

00:00 / 00:00Tiempo por fotograma 16.7 ms
  • El mapa

    Los países con factura electrónica obligatoria; al pasar, la ficha de cada uno.

  • La ficha de un país

    Requisitos de factura y e-reporting, formato y plazos, sincronizados desde Notion con WhaleSync.

  • Bajo control con la consola

    Documentos, espacios de trabajo, facturas y flujos: cada apartado de la consola se enseña al pulsarlo.

Por dentro

Herramientas

  • Figma
  • Webflow
  • Notion
  • WhaleSync

Cómo está hecha

  • CMS en Webflow con referencias entre colecciones
  • Sincronización Notion → Webflow con WhaleSync
  • Localización de Webflow en inglés y español, con SEO por idioma

En cifras

  • +100 fichas de CMS
  • 2 idiomas
  • 3 tipos de cliente en el mapa

Conclusión

El contenido por país ya no pasa por la web: el equipo lo edita en Notion y WhaleSync lo sincroniza campo a campo con el CMS de Webflow, en inglés y en español.

Más de cien fichas con referencias cruzadas alimentan la cobertura, las guías y el mapa.

Lo que cuentan

«Nos los recomendó un amigo emprendedor y ha sido una gran decisión. Desde el primer día se integraron perfectamente con nuestras herramientas y manejaron la integración de más de cien elementos de CMS con agilidad. Eric y Andoni responden en minutos y despliegan en horas. Superaron nuestras expectativas.»
Juan MolinerCofundador de Invopop
«Aquí va el testimonio del cliente sobre este proyecto: dos o tres líneas, con su retrato al carboncillo. Marcador para Eric.»
Nombre del cliente (marcador)Cargo, empresa