Add screenshots, release workflow, and download instructions

- Convert PNG screenshots to JPEG with descriptive names
- Add GitHub Actions workflow to build ZIP on version tags with a fixed latest release link
- Update README with screenshots section and download-based install option

Author: bnqtoan

.github/workflows/release.yml

@@ -0,0 +1,44 @@
+name: Release
+
+on:
+  push:
+    tags:
+      - 'v*'
+
+permissions:
+  contents: write
+
+jobs:
+  release:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Get version from tag
+        id: version
+        run: echo "version=${GITHUB_REF#refs/tags/}" >> "$GITHUB_OUTPUT"
+
+      - name: Build ZIP
+        run: |
+          zip -r debug-helper-${{ steps.version.outputs.version }}.zip . \
+            -x '.git/*' '.github/*' 'images/*.png' '*.json' '!manifest.json'
+
+      - name: Create versioned release
+        uses: softprops/action-gh-release@v2
+        with:
+          name: Debug Helper ${{ steps.version.outputs.version }}
+          generate_release_notes: true
+          files: debug-helper-${{ steps.version.outputs.version }}.zip
+
+      - name: Update latest release
+        uses: softprops/action-gh-release@v2
+        with:
+          tag_name: latest
+          name: Debug Helper (Latest)
+          body: |
+            Always points to the most recent release: **${{ steps.version.outputs.version }}**
+
+            Download the ZIP below, unzip, and load as unpacked extension in Chrome.
+          files: debug-helper-${{ steps.version.outputs.version }}.zip
+          prerelease: true
+          make_latest: false

README.md

@@ -8,8 +8,46 @@ Chrome extension that captures browser debug context (DOM events, console logs,
 
 Record a browsing session — every click, input, scroll, console error, and network request gets captured with timestamps. Take annotated screenshots along the way. Add manual notes. Export everything as a structured report that AI coding assistants can read and act on.
 
+## Screenshots
+
+### Popup
+Quick access to start/stop recording, take screenshots, and export sessions.
+
+![Popup UI](images/popup-ui.jpg)
+
+### Live Feed
+Real-time event stream showing DOM interactions, network requests, and console output as they happen.
+
+![Live Feed](images/live-feed.jpg)
+
+### Session History
+Browse and manage all recorded sessions with view, export, rename, and delete actions.
+
+![Session History](images/session-history.jpg)
+
+### Export Preview
+Preview and copy the generated debug report in Markdown, JSON, or TOON format.
+
+![Export Preview](images/export-preview.jpg)
+
+### Screenshot Annotator
+Annotate captured screenshots with rectangles, arrows, text, counters, freehand drawing, and crop.
+
+![Screenshot Annotator](images/screenshot-annotator.jpg)
+
 ## Install
 
+### Option 1: Download release (recommended)
+
+1. Download the [latest release](https://github.com/vibery-studio/debug-helper/releases/tag/latest) ZIP
+2. Unzip the file
+3. Open `chrome://extensions`
+4. Enable **Developer mode**
+5. Click **Load unpacked** → select the unzipped folder
+6. Pin the extension for quick access
+
+### Option 2: Clone repo
+
 1. Clone this repo
 2. Open `chrome://extensions`
 3. Enable **Developer mode**