Instructables Web Project Save Organizer

WHAT IT DOES

Instructables Web Project Save Organizer transforms complex Instructables project pages into a structured, trackable building experience. When you open any Instructables project, the tool automatically scans the page and identifies all project steps, including their titles, images, embedded videos, and content length. It builds a collapsible table of contents that displays every step with its title and visual indicators for media content. The panel provides checkboxes next to each step, allowing you to mark steps as completed as you work through the project. A progress bar tracks your overall completion percentage and step count. Your progress is automatically saved per project URL, so you can return to any project days or weeks later and resume exactly where you left off. The tool also extracts materials and tools lists from the project page and creates a combined checklist with checkboxes, letting you track which supplies you have gathered before starting the build. Estimated completion time is displayed based on step count and content length, helping you plan your build sessions effectively.

WHERE IT RUNS

This extension operates exclusively on instructables.com domain pages that contain project content—specifically URLs with "/project/" in the path or pages that display Instructables project content. It works alongside the free BotGentz companion extension, which provides the necessary DOM access and page interaction capabilities. The project organizer runs entirely within your local browser instance and does not communicate with any external servers or APIs. All section detection, progress tracking, and materials checklist data is stored locally on your machine using GM_setValue, ensuring your project progress remains private and under your control. It supports all modern Chromium-based browsers (Chrome, Edge, Brave, Opera) and Firefox when paired with the BotGentz bridge.

HOW TO USE

After installing both BotGentz and this project organizer, simply navigate to any Instructables project page. Within 1-2 seconds, a panel appears in the bottom-right corner displaying your current progress with a progress bar and step count. The "Steps" section shows a table of contents with all project steps in order. As you work through the project, check the box next to each step you complete—the progress bar updates immediately and your progress is automatically saved. Click any step title to smoothly scroll directly to that step in the project, making it easy to jump between different phases of the build. The "Materials & Tools" section displays a checklist of all supplies extracted from the project page; check off items as you gather them. Use "Reset Progress" to clear all completion data for the current project and start over. The estimated reading time helps you gauge how long each project will take. All progress data is stored per project URL, so you can track multiple projects simultaneously.

STEP DETECTION AND CONTENT EXTRACTION

The project organizer uses a multi-strategy detection system to identify project steps on Instructables pages. It first attempts to locate step containers using common selectors based on Instructables' typical page structure, including step containers, instruction steps, and project sections. When these selectors fail due to page updates or layout changes, the tool falls back to analyzing heading elements for step indicators such as the word "Step" or numbered patterns. Each detected step is analyzed for its content, including counting images, embedded videos, and word count to provide context about step complexity. The image and video counts are displayed as visual indicators in the table of contents (📷 and 🎬), helping you identify media-rich steps at a glance. For materials extraction, the tool searches for lists within sections labeled "materials," "tools," "supplies," or "ingredients," and falls back to analyzing any list that contains material-related keywords. This hybrid detection approach achieves high accuracy across diverse project pages and remains resilient to site structure changes.

THE PANEL

The project organizer panel is a compact, functional overlay that integrates into the Instructables page. It can be dragged by clicking and holding the title bar, positioning the panel anywhere on the screen for optimal visibility while you build. The panel includes a built-in snap feature that automatically aligns to the nearest screen edge when released within 48 pixels, keeping your workspace organized. Click the collapse arrow in the top-right corner to minimize the panel to a small icon bubble showing a gear emoji, preserving screen space while keeping the tool accessible. The panel is not resizable in this version, maintaining a consistent compact size that works on all screen resolutions. Press the Escape key to instantly hide the panel; press Escape again to restore it. All position, collapse state, progress data, and materials checklist state are saved locally using GM_setValue and persist across browsing sessions.

PLEASE NOTE

This extension requires the free BotGentz extension to function—the project organizer does not work standalone. Instructables occasionally updates its page layouts and project structures, which may temporarily affect step detection and materials extraction accuracy. The tool extracts content based on page structure and may not detect steps or materials in dynamically loaded content or unusually formatted projects. Progress data is stored per URL path, so changes to project URLs may reset your progress for that project. The tool does not store or transmit any data; all progress information, materials checklist state, and settings are saved entirely within your browser. Completion checkboxes are provided for personal tracking purposes only and do not affect your Instructables account or any official project records. Always refer to the official project instructions for accurate materials lists and build steps. This tool is designed for personal project tracking and is not affiliated with Instructables or Autodesk.