Cuadernograma: Web Viewer for Notebooks from the José Vial Armstrong Archive

Project financed by the National Cultural Heritage Service (SERPAT) to visualize the artistic, disciplinary, and cultural work of founders and professors of the School of Architecture and Design at Pontificia Universidad Católica de Valparaíso.

Mockup de la app para visualizar las páginas de los cuadernos fundadores

Project Background

The José Vial Armstrong Historical Archive of the PUCV School of Architecture and Design requested our support in designing and building a platform to navigate the artistic, disciplinary, and cultural work of the School’s professors and founders through their personal notebooks and logbooks.

The implementation is based on a postgraduate project that sought to explore the spatialization of ideas in the notebooks of architects and designers from the Archive. The research focused on analyzing how inscriptions (drawings, writings) are organized and articulated on the pages of these notebooks, with the aim of revealing patterns and understanding the role of space in the creative process.


“Architects’ and designers’ notebooks are far, very far, from containing anything conclusive. The entries on their pages are raw, incomplete, hesitant, and often cryptic, as their purpose is to think, not to produce.

The search begins by glimpsing possible keys to creativity and creative thinking in these entries, and that the veil of authorial intimacy and the “inconclusiveness” of the entries could also shed new light”.

Cuadernograma. Spatialization of ideas in the Founding Notebooks AHJVA – Francisca Oñate

Colección de páginas de cuadernos de los fundadores de la e[ad]

Data Structure

As a starting point, we received extensive project documentation, which included among other things, a definition of the data structure to organize each notebook, its pages, and entries.

This structure allowed us to outline the scope of the graphic and technological support required for the viewer. Then, we defined the system’s IT architecture: where the information would be published and how it would be consumed for visualization.

We proposed that the notebooks and pages be published in special forms within Casiopea, the School’s semantic wiki for study and archive, in order to facilitate the management and maintenance of the information repository. The viewer was defined as an external application, consuming information via the Semantic MediaWiki API.

Esta imagen tiene un atributo ALT vacío; su nombre de archivo es diagrama-cuadernograma-1024x940.png

UI Design

We worked on the UI proposal based on the content structure the School’s team developed for categorizing all the pages. We suggested that the homepage display a random gallery of pages from all notebooks, highlighting the diversity of available material. The main attributes and categories were used as filters to access related pages, prioritized within the proposed layout.

In the individual page and notebook views, the layout is based on showing the double-page spread, which links a verso page to its corresponding recto page, allowing for a better recreation of the author’s original context of use.

Vista del visualizador web en una página específica

Technical Implementation

For the project’s implementation, we used the Laravel framework, which allowed us to build a lightweight middleware with a complete index of the pages and notebooks published in the Casiopea wiki. For integration with the data source, we leveraged our experience in REST API implementations to extract information from the wiki and present it according to the originally defined data structure.

Cuadernograma currently features a total of 9 notebooks and almost 900 pages, representing only 1% of the total existing notebooks to date.

More information about the project:

You have any doubts?

Contact us

hola@bloom.lat