Bankaool web

Public site for a Mexican banking institution, including consumer and business products, support, legal content and lead capture.

Visit website ↗

Bankaool homepage with digital account opening and a mobile app preview — The homepage combines a direct proposition, the mobile product and immediate access to download.

The challenge

A banking site has to balance product communication, regulatory requirements, accessibility and a large amount of audience-specific content.

My contribution

I worked on the Next.js and React implementation, component system, product routes, forms, branch maps, consent-aware analytics, performance and SEO foundations.

Key decisions

Render products from typed configurations so blocks can be reused without forcing every page into the same template.
Keep content in the repository and prerender it to reduce runtime dependencies.
Validate forms with Zod and apply origin checks, rate limiting and sensitive-data redaction on the server.
Derive metadata and the sitemap from the same sources that feed the routes.

The product in use

Screenshots captured while running the project or reviewing its published version.

Bankaool Mi Cuenta Móvil product page — Product pages reuse a declarative structure for benefits, requirements, steps and legal details.

Outcomes

The product catalog can grow through shared components while keeping an individual narrative per page.
Primary routes are ready for static generation, consistent metadata and accessible navigation.
Product, support and regulatory information live in one coherent experience.

Tech stack

Next.js 16React 19TypeScriptTailwind CSS 4Zod