# Horizonte Brokerage

Canonical page: https://www.buildwithcarlos.dev/projects/horizonte-corretora/

I rebuilt a brokerage website as a connected set of 24 pages. Short introductions, detailed reading sequences, paired comparisons and local interactions each retain a distinct place in the experience.

Status: Previous frontend work, reconstructed

Scope: 24 routes covering seven investment topics, five service areas, a platform illustration, six learning tables, explanatory pages and a sample contact flow

## Where this started

The earlier site had its own architecture, separate from the institutional and corporate-banking websites. Its 24 routes ranged from compact topic pages to long-form explanations, with a catalogue, service section and several utility destinations.

The challenge was to keep that variety coherent. I needed to reconnect the reading paths while replacing historical claims, inconsistent numeric tables and financial actions with content and interactions appropriate for a fictional portfolio demonstration.

## My part

- Implemented: I developed the earlier frontend in collaboration with designers, including its navigation and interaction behavior. The historical visual design was a shared contribution.

- Reconstructed: I reconstructed the page system using the portfolio’s Horizonte. identity, generated photographs and independently written Portuguese copy. The interactive examples remain local to the page.

## Decisions

### Give each page its own structure

The catalogue does not expand into one repeated template. Funds use category cards, property funds use side-by-side disclosure answers, and pension and treasury topics unfold through longer sequences. The learning page keeps its six-table structure.

### Make the routes work together

Overview pages, exclusive menus, related links and section anchors connect the full route inventory. A six-selector contact example demonstrates validation, reset and confirmation without collecting personal information or sending a message.

### Carry one identity across the system

The shared wordmark, Montserrat type and ivory/violet palette tie the pages together. Generated scenes with fictional adults give the reconstruction a human visual presence without implying a real team or customer endorsement.

### Use motion to clarify sequence

Introductions arrive before their actions; cards enter as complete units. The shell stays visible, and reading remains available through reduced-motion and no-JavaScript alternatives. Motion follows the content hierarchy rather than adding a separate layer of activity.

### Write for the demonstration itself

I rewrote the page copy, comparison answers, table cells, policy explanations and sample-screen text for this version. The mobile screen and Home Broker are illustrations, tax sections contain no rates, and the prototype provides no accounts, transactions or financial advice.

## Evidence

- [Rendered Horizonte Brokerage homepage showing its actual headline, navigation, photograph and primary action](https://www.buildwithcarlos.dev/cases/horizonte-corretora/home-hero-desktop.jpg)

  Actual browser capture of the reconstructed homepage, verified on 10 October 2026. The screenshot preserves the rendered interface and its fictional imagery.

  [Source](https://www.buildwithcarlos.dev/demos/horizonte-corretora/)

## Looking back

The scale of the site made the relationships between pages as important as any individual layout. Rebuilding those connections let me preserve the variety of the original frontend while giving this version an independent voice and a clear scope.

## Project note

This reconstruction presents earlier frontend work I implemented in collaboration with designers. The identity, generated photography and newly written content are adapted for the portfolio; all depicted people are fictional. It does not represent an operating brokerage, offer advice or products, claim business results, or attribute the original design solely to me.

## Related links

- [Open the 24-page reconstruction](https://www.buildwithcarlos.dev/demos/horizonte-corretora/)
