Project Overview
This simple web interaction built with p5.js allows users to place visual markers of Armenian architecture across the screen, mirroring the typological frequency of a collected dataset.
VISIT THE SITE
Goals
This project seeks to visualize a set of data expressively. With simple clicking and window resizing interactions, the viewer can reflect on data's capacity to repeat the same visual signs which have remained greatly unchanged since their formation, and “its legacy to a land which is still searching for its most profound cultural roots.”
Context
The data set represented in this project is taken from Claudio Gobbi’s photo book– Arménie Ville –wherein Gobbi documents over 125 Armenian churches in a continuous flow across over 25 countries from Western Europe, to Russia, the Middle East, and the land in the Caucuses to which Armenians are indigenous. Classifying each church into architectural typologies designated by the appearance of their topmost dome.
Design Process
Prior to generating any code for the web-based visualization, I created 3D modeled assets in Blender that represented the individual architectural typologies.
Using a p5.js canvas along with HTML and CSS, I generated an interactive experience which lets users click to place the visual markers of Armenian architecture across the screen, mirroring the typological frequency of the collected dataset.
Final Product
While making sure the site could be resized, and that the resizing would create even more expressive datasets, I also included a vertical ticker that denotes every image placed upon clicking, and a counter that keeps track of the amount of times each image is placed.