Extract and inspect web design metrics through Chrome extension!
MPL-2.0 License
Web Design Scraper is a tool to extract objective web design measurements from a web page. This repo contains the early implementation of the web design scraping concept that we coined in our research paper.
The extracted web design measurements from this tool can be used for:
The JSON output can also be used as machine learning inputs for:
Currently this tool can extract the following design information:
There are more measurements planned to be included in this tool.
To run this project, you can either install the published version from the chrome web store or build it by yourself.
This repo might contain the more updated version of the tool than the published one.
You need node.js installed in your machine to build the chrome extension. If you have it already, please follow the following steps to build the extension:
Clone this repository and open the folder in terminal.
Run the following commands:
npm install
npm run build:chrome
The commands above will produce the chrome extension inside ./chrome-ext-dist
folder.
Then, you can run the extension by sideloading the ./chrome-ext-dist
folder to Google Chrome.
This tool is built by using TypeScript, React, Webpack, SCSS, Farbic UI, Vibrant, Jest, and other libraries.
Copyright © 2020 Web Design Scraper Team
Web Design Scraper code is licensed under MPL-2.0. Images, logos, docs, and articles in this project are released under CC-BY-SA-4.0.
Libraries, dependencies, and tools used in this project are tied with their licenses.