Luc Grenier


Hello!

I’m a creative designer and maker from Boston, MA, US.
I have cross-functional design expertise with both digital
 
_ motion graphics _ 3D modeling _ shader rendering _ web design
–and physical media.
_ print _ product _ publication _ installation _ experiential design

Selected Work


Interactive Data Visualization
Motion Graphic Social Campaign
Concept Print Product
Play Set Product
Poster Designs
Publication Designs


About Me



2023
հաստատակ.html
Client: personal work
Work: web design, data visualization


VISIT WEBPAGE




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.


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 bookArmé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.