CarbonViz ♻️

Making the climate impact of your web browsing visible.

CarbonViz is a browser extension that visualizes the environmental impact of our digital activities by displaying real-time data consumption and associated CO2 emissions while browsing the web.

🌍 About

Every day, we consume data that travels across the internet. Accessing online content seems normal and obvious, but "online" means that data travels from somewhere to our favorite browser. This journey is neither easy nor free. Dematerialization is very costly in terms of resources, infrastructure, and ultimately energy costs.

CarbonViz addresses this issue by seeking to improve perception and understanding of digital energy issues. To better represent this information, analogies were chosen in co-creation with concerned users. CarbonViz aims to raise awareness of the cost generated by our daily use of the Web.

✨ Features

• Real-time monitoring: View your data consumption and CO2 emissions as you browse
• Visual analogies: Easy-to-understand comparisons to help grasp the environmental impact
• Cross-browser support: Available for Chrome, Firefox, Edge, and Safari
• Privacy-focused: The data stays on your device and is not shared with third parties
• Educational: Raises awareness about digital environmental impact

🚀 Installation

Chrome Web Store

1. Visit the Chrome Web Store page
2. Click "Add to Chrome"
3. Confirm the installation

Firefox Add-ons

1. Visit the Firefox Add-ons page
2. Click "Add to Firefox"
3. Confirm the installation

Microsoft Edge

1. Visit the Chrome Web Store (Edge supports Chrome extensions)
2. Click "Allow extensions from other stores" if prompted
3. Follow the Chrome installation steps

Safari

1. Visit the AppStore page
2. Follow the Safari extension installation guide

🛠️ Development

Prerequisites

• Node.js (version 16 or higher)
• npm or yarn package manager
• Git

Local Setup

1. Clone the repository

2. Install dependencies\

cd webpack
npm install

1. Build the extension\

npm run build

Development Mode

1. Start development server

   npm run watch

2. Load the extension in your browser

   For Chrome/Edge:

   • Open chrome://extensions/ (or edge://extensions/)
   • Enable "Developer mode"
   • Click "Load unpacked"
   • Select the root folder (containing the manifest.json file)

   For Firefox:

   • Open about:debugging
   • Click "This Firefox"
   • Click "Load Temporary Add-on"
   • Select the manifest.json file from the root folder

   For Safari:

   • Open the Safari settings
   • Click on "Developper" tab
   • Click on "Add a temporary extension"
   • Select the manifest.json file from the root folder

Available Scripts

• npm run build - Build the extension for production
• npm run watch - Run the webpack bundler in watch mode

📄 License

This project is licensed under the Mozilla Public License 2.0 (MPL 2.0) - see the LICENSE file for details.

🏫 About HEIG-VD

CarbonViz is developed by HEIG-VD (University of Applied Sciences and Arts Western Switzerland).

Contact: [email protected]

🔒 Privacy

CarbonViz respects your privacy:

• All the data stays ON YOUR DEVICE and will NEVER BE SHARED with third parties.

📞 Support

For questions, suggestions, or issues:

• Open an issue on GitHub
• Contact: [email protected]

---

Help make the web more sustainable! 🌱