Atomize

Chrome Extension Experiement, 2020











Overview


Atomize is a chrome extension that allows break down the DOM elements of the website. My vision is products that help the users to analyze the structure of the website to understand it easily. I want to create a chrome extension that allows to the users to atomize the HTML DOM elements and visualize it. The user could study and understand the sturcture of the website through it. 





< Possible final form >









Structure


It has three buttons and one slider. First button grab the DOM elements and the second button get rid of the CSS and gather all the elements. And the slider allows to the users that control the structure of the elements. To see the structure, I add “perspective” button, which gives the perspective view to contents and I was experimenting to figure out how to make it legible. A slieder is working on progress. 





















Test and Learn



During the process, I have kept experimenting with visual aspect like perspective and the lines. And I have learned how to make a chrome extension from the scratch and the journey of this project is still on the way.
 




















Copyright 2021, Jaekook Han