MR.MANOLO REY GARCÍACONTACT
SYSTEMSHOW I WORKABOUT
BACK TO SYSTEMS
PROGRAM.DETAIL / 02 OF 09FINISHED · VALIDATED

Investment Project Visualisation Platform

A web application for recording, monitoring and analysing investment projects with traceability and physical-financial control.

STATUS
FINISHED · VALIDATED
VISIBILITY
PUBLIC
ROLE
Sole author, end to end: experience, frontend, data, migration and testing.
PRODUCT / LIVE INTERFACE
CASE SUMMARY
V2documented evolution09documented views93unit and integration tests12Chromium E2E scenarios

Case summary

01

Problem

PIV had to evolve from static pages and spreadsheets into a transactional application without losing inherited formulas or data.

02

Intervention

The experience, frontend, data model, migration and tests were redesigned. Production cutover remains out of scope until an authorised validation is completed.

03

Outcome

The application brings consultation, operations and analytics together, keeps the history of records and leaves a trace of every change. Production cutover remains pending.

04 / UI

Visual system

Typography and tokens documented for PIV.

TYPOGRAPHYAa

Nunito 400–800

PIV

A web application for recording, monitoring and analysing investment projects with traceability and physical-financial control.

NEXT STEP
PRODUCT PALETTE
#213362Text and buttons#17254EDeep backgrounds#1B4472Navigation and hover#07519DLinks and focus#00AEE3Accents and indicators#FFCD00Focus and active navigation#EE7C00Financial indicators#A8CF45Success and active state#A24646Errors and destructive actions#CD2180Financial series#F5F7FACanvas#FFFFFFPanels and cards

Nunito structures headings, body copy and controls. Structural blues are combined with semantic colours for status, financial series and actions.

05 / SYSTEM

Engineering & evolution

Product evolution and documented process.

STACK
  • React 19
  • TypeScript
  • Vite 8
  • TanStack Query 5
  • Chart.js 4

The interface uses synthetic fixtures and irreversible redactions. Institution, people, email addresses, real codes, infrastructure and credentials are omitted.