Skip to content

Instantly share code, notes, and snippets.

@dameleon
Last active April 28, 2026 01:06
Show Gist options
  • Select an option

  • Save dameleon/b9d49d28290ff92c503025c1e761e829 to your computer and use it in GitHub Desktop.

Select an option

Save dameleon/b9d49d28290ff92c503025c1e761e829 to your computer and use it in GitHub Desktop.
Feedbackers Manuals / Feedbackers マニュアル

Feedbackers Manuals / Feedbackers マニュアル

Feedbackers is a Chrome extension for capturing feedback on any web page — either by posting it to GitHub Discussions, or by keeping per-page notes locally on your device. Pick the manual that matches your role and language below.

Feedbackers は、閲覧中の Web ページへのフィードバックを GitHub Discussions に投稿するか、端末内にページごとのメモとして蓄積するか、目的に合わせて使い分けられる Chrome 拡張機能です。ご自身の立場と言語に合わせて下記のマニュアルをご覧ください。


Manuals / マニュアル一覧

Role / 立場 English 日本語
End user — Post feedback from your browser
利用者 — ブラウザからフィードバックを投稿する方
USER_MANUAL.en.md USER_MANUAL.ja.md
Repository admin — Prepare a GitHub repository to receive feedback
設定者 — フィードバック受け入れ先の GitHub リポジトリを準備する方
ADMIN_MANUAL.en.md ADMIN_MANUAL.ja.md

Links / 関連リンク

Feedbackers Admin Manual

Feedbackers is a Chrome extension that lets users post feedback from any web page directly to GitHub Discussions. This manual describes what admins (target-repository owners) need to prepare on the GitHub repository side so their team or organization can use Feedbackers.

The extension itself is installed by each user from the Chrome Web Store, so admins do not need to build or distribute the extension.

Local Mode (on-device notes) does not require any GitHub repository or App setup. The steps in this manual are for preparing GitHub Mode — the mode that posts feedback to GitHub Discussions.


Table of Contents

  1. Prerequisites
  2. Install the Feedbackers GitHub App on the Repository
  3. Prepare the Target Repository
  4. Configure Status Labels
  5. Managing Feedback
  6. Data and Privacy

1. Prerequisites

  • Users have installed the official Feedbackers extension from the Chrome Web Store
  • You have Admin permission on the target GitHub repository (needed to install the App, enable Discussions, and create labels)
  • If the target repository is under an organization, the organization Owner must allow Third-party Application Access and GitHub App installations

2. Install the Feedbackers GitHub App on the Repository

Feedbackers uses a single official GitHub App provided by atman-inc for authentication and GitHub API access. Admins do not need to create an App; you only need to install the official App on your organization or repository.

Steps

  1. Open the Feedbackers GitHub App page at https://github.com/apps/feedbackers
  2. Click Install in the top right
  3. Select the account or organization you want to install into
  4. Choose Only select repositories and check the repositories where you want to use Feedbackers (least-privilege is recommended; All repositories is also allowed)
  5. Click Install to confirm
  6. After installation, verify that Feedbackers appears in Settings → Integrations → GitHub Apps of the target repository

Re-approving on Permission Changes

If Feedbackers' permissions are expanded or modified in the future, GitHub will post a "Changes requiring user approval" notice.

  1. Open Settings → Integrations → GitHub Apps → Feedbackers
  2. Click Review and read the change rationale provided by the author (entered in the "Add a note to users" field)
  3. Click Accept new permissions

Until approval completes, features that depend on the new permissions may not work.

Important: The Feedbackers GitHub App is centrally managed by atman-inc. Admins do not need to create their own GitHub App or OAuth App.


3. Prepare the Target Repository

Configure the GitHub repository that will store feedback:

3.1 Enable Discussions

  1. Open SettingsGeneral for the target repository
  2. Check Discussions in the Features section
  3. Click Save

3.2 Set Up Discussion Categories

When Discussions is enabled, default categories are created. Organize categories to match your feedback taxonomy.

  1. Open the Discussions tab of the repository
  2. Click the pencil icon next to Categories in the left sidebar
  3. Add or edit categories as needed (e.g., Bug report, Feature request, Improvement)

The categories configured here appear as options in the Feedbackers submission form.

3.3 Create the Screenshot Branch

When users attach screenshots, images are stored on the feedbackers-screenshots branch of the target repository. Uploads will fail if this branch doesn't exist, so create it in advance:

git checkout --orphan feedbackers-screenshots
git rm -rf .
git commit --allow-empty -m "Initialize feedbackers-screenshots branch"
git push origin feedbackers-screenshots
git checkout main

3.4 User Permissions

Users who post feedback need at least Write role on the target repository so they can write to Discussions.

  • Public repositories: Add them as Collaborators, or include them in an Organization team
  • Private repositories: Grant the equivalent access

The permissions Feedbackers requires for API access (Discussions: Read and write / Contents: Read and write / Metadata: Read-only) are granted automatically by the Feedbackers GitHub App installed in Section 2 — no additional setup is required on the user side.


4. Configure Status Labels

Feedbackers manages feedback status using GitHub Discussion labels. The label names are fixed as machine-readable fb:* strings, and the display name is customized per team via the GitHub label description field.

Label name (fixed) Meaning Example description (English) Example description (Japanese)
fb:open New feedback (not yet handled) Open 未着手
fb:triaged Reviewed and classified Triaged トリアージ済
fb:in_progress Being worked on In Progress 対応中
fb:done Completed Done 対応済み
fb:wont_fix Decided not to address Won't Fix 対応しない

Key point: Label names are fixed to the five fb:* strings. Put any display name your team wants (team terminology, emoji, other languages) into the label description, and the extension badge will show that text as-is. If you leave the description empty, the extension auto-translates it to Open / 未着手 / etc. based on the user's browser locale.

How to Create the Labels

  1. Open the repository's Issues tab → Labels
  2. Click New label
  3. Enter one of the fb:* names exactly into Label name
  4. Enter the display string you want your team to see in Description (empty is OK; the extension auto-translates if empty)
  5. Colors are up to you (reflecting them in badge colors is planned for a future release)
  6. Create all five labels

These labels appear as status badges in the Feedbackers extension. Applying labels is done from the GitHub Discussions screen.


5. Managing Feedback

Feedback submitted by users accumulates in the Discussions of the target repository.

5.1 Reviewing Feedback

In addition to the content the user entered, each Discussion body contains the following metadata embedded as an HTML comment:

  • URL: URL of the page the feedback targets
  • Severity: High / Medium / Low
  • Target element: CSS selector of the selected HTML element
  • Viewport: Screen dimensions
  • Timestamp: Submission time

5.2 Updating Status

  1. Open the relevant Discussion
  2. Apply or change the status label from Labels in the right sidebar

Status changes are reflected in the user's extension in real time (on the next data fetch).

5.3 Screenshots

If the user attached a screenshot, the image is stored on the feedbackers-screenshots branch of the repository and embedded into the Discussion body as a Markdown image.


6. Data and Privacy

  • Authentication tokens: Stored only in the user's browser chrome.storage.local. Only transient OAuth-flow data (PKCE state and code_verifier) is stored in chrome.storage.session and is automatically deleted when the flow completes. Neither is routed through atman-inc servers or sent to any third party other than GitHub
  • Feedback data: Feedback posted in GitHub Mode is stored entirely in GitHub Discussions (access is controlled by the repository's visibility settings). Local Mode notes are stored only in the user's chrome.storage.local on-device and are never sent to GitHub or any other external server
  • Screenshots: Stored on the feedbackers-screenshots branch of the target repository
  • Local settings: Per-domain repository settings are stored only in Chrome storage

Feedbackers 設定者マニュアル

Feedbackers は、任意の Web ページから GitHub Discussions にフィードバックを投稿できる Chrome 拡張機能です。本マニュアルでは、設定者(対象リポジトリの管理者)が、チーム/組織で Feedbackers を利用するために GitHub リポジトリ側で行う受け入れ準備 を説明します。

拡張機能本体は Chrome Web Store から利用者が各自インストールするため、設定者が拡張機能をビルド・配布する必要はありません。

Local Mode(端末内メモ)は GitHub リポジトリや App の設定を必要としません。本マニュアルの設定手順は、GitHub Discussions に投稿するモード(GitHub Mode)を運用する場合の準備です。


目次

  1. 前提条件
  2. Feedbackers GitHub App をリポジトリにインストールする
  3. 対象リポジトリの準備
  4. ステータスラベルの設定
  5. フィードバックの管理
  6. データとプライバシー

1. 前提条件

  • 利用者が Chrome Web Store から公式版の Feedbackers 拡張機能をインストール済みであること
  • 対象 GitHub リポジトリに対する Admin 権限(App インストール・Discussions 有効化・ラベル作成のため)
  • 対象リポジトリが組織配下にある場合、組織の Owner が Third-party Application Access / GitHub App のインストール を許可していること

2. Feedbackers GitHub App をリポジトリにインストールする

Feedbackers は atman-inc が公式に提供する単一の GitHub App を使って認証と GitHub API アクセスを行います。設定者は App を作成する必要はなく、公式 App を自組織/リポジトリに インストール するだけで準備が整います。

手順

  1. Feedbackers の GitHub App ページ https://github.com/apps/feedbackers を開く
  2. 右上の Install をクリック
  3. インストール先のアカウントまたは組織を選択
  4. Only select repositories を選び、Feedbackers を利用したいリポジトリにチェックを入れる(最小権限を推奨。All repositories も選択可)
  5. Install をクリックして確定
  6. インストール完了後、対象リポジトリの Settings → Integrations → GitHub AppsFeedbackers が表示されていることを確認

権限更新時の再承認

今後 Feedbackers の権限が追加・変更される場合、GitHub から「Changes requiring user approval」通知が出ます。

  1. Settings → Integrations → GitHub Apps → Feedbackers を開く
  2. Review をクリックし、制作者側が記載した変更理由(「Add a note to users」に入力されたもの)を確認
  3. Accept new permissions で承認

承認が完了するまで、追加された権限に依存する機能は一部動作しないことがあります。

重要: Feedbackers GitHub App は atman-inc 側で共通管理されています。設定者が独自の GitHub App や OAuth App を作成する必要はありません。


3. 対象リポジトリの準備

フィードバックの保存先となる GitHub リポジトリに以下の設定を行います。

3.1 Discussions の有効化

  1. 対象リポジトリの SettingsGeneral を開く
  2. Features セクションで Discussions にチェックを入れる
  3. Save をクリック

3.2 Discussion カテゴリの設定

Discussions を有効化すると、デフォルトのカテゴリが作成されます。フィードバックの分類に合わせてカテゴリを整理してください。

  1. リポジトリの Discussions タブを開く
  2. 左サイドバーの Categories 横の鉛筆アイコンをクリック
  3. 必要なカテゴリを追加・編集する(例: バグ報告機能要望改善提案 など)

Feedbackers の投稿フォームでは、ここで設定したカテゴリが選択肢として表示されます。

3.3 スクリーンショット用ブランチの作成

利用者がスクリーンショットを添付する場合、画像は対象リポジトリの feedbackers-screenshots ブランチに保存されます。このブランチが存在しないとアップロードが失敗するため、事前に作成してください。

git checkout --orphan feedbackers-screenshots
git rm -rf .
git commit --allow-empty -m "Initialize feedbackers-screenshots branch"
git push origin feedbackers-screenshots
git checkout main

3.4 利用者の権限

フィードバックを投稿する利用者には、対象リポジトリの Discussions に書き込める Write 以上の role を付与してください。

  • パブリックリポジトリ: Collaborator として追加、または Organization のチームメンバーに含める
  • プライベートリポジトリ: 同様に適切な権限を付与する

Feedbackers がリポジトリに対して行う API アクセスに必要な権限(Discussions: Read and write / Contents: Read and write / Metadata: Read-only)は、セクション 2 でインストールした Feedbackers GitHub App によって自動付与されるため、利用者側での追加設定は不要です。


4. ステータスラベルの設定

Feedbackers はフィードバックのステータス管理に GitHub の Discussion ラベルを使用します。ラベル名は機械可読な fb:* 固定で、表示名は GitHub ラベルの description フィールド で team ごとに自由にカスタマイズできます。

ラベル名(固定) 意味 推奨 description 例(日本語) 推奨 description 例(英語)
fb:open 新規フィードバック(未対応) 未着手 Open
fb:triaged 内容確認・分類済み トリアージ済 Triaged
fb:in_progress 対応作業中 対応中 In Progress
fb:done 対応完了 対応済み Done
fb:wont_fix 対応しないと判断 対応しない Won't Fix

ポイント: ラベル名は fb:* の 5 種で固定です。GitHub の label description に好きな表示名(チーム用語、絵文字、別言語等)を入れると、拡張機能のバッジはそれをそのまま表示します。description を空にした場合は、利用者のブラウザロケールに応じて自動で Open / 未着手 等に翻訳されます。

ラベルの作成手順

  1. リポジトリの Issues タブ → Labels を開く
  2. New label をクリック
  3. Label name に上記 fb:* のいずれかを入力(正確に一致させること)
  4. Description にチームで表示したい文字列を入れる(空でも可。空なら拡張機能が自動翻訳)
  5. 色は自由(バッジ色への反映は今後の機能拡張で対応予定)
  6. 5 種すべて作成する

これらのラベルは Feedbackers の拡張機能上でステータスバッジとして表示されます。ラベルの付与は GitHub の Discussions 画面から行います。


5. フィードバックの管理

利用者が投稿したフィードバックは、対象リポジトリの Discussions に蓄積されます。

5.1 フィードバックの確認

各 Discussion の本文には、利用者が入力した内容に加えて、以下のメタデータが HTML コメントとして埋め込まれます:

  • URL: フィードバック対象ページの URL
  • 重要度: 高 / 中 / 低
  • 対象要素: 選択された HTML 要素の CSS セレクタ
  • ビューポート: 画面サイズ
  • タイムスタンプ: 投稿日時

5.2 ステータスの更新

  1. 該当する Discussion を開く
  2. 右サイドバーの Labels からステータスラベルを付与・変更する

ステータスの変更は、利用者の拡張機能上にリアルタイムで反映されます(次回データ取得時)。

5.3 スクリーンショット

利用者がスクリーンショットを添付した場合、リポジトリ内の feedbackers-screenshots ブランチに画像が保存され、Discussion 本文に Markdown 画像として埋め込まれます。


6. データとプライバシー

  • 認証トークン: 利用者のブラウザの chrome.storage.local にのみ保存されます。OAuth フロー進行中の一時情報(PKCE の state と code_verifier)のみ chrome.storage.session に保存され、フロー完了時に自動削除されます。どちらも atman-inc のサーバーを経由せず、GitHub 以外の第三者サーバーにも送信されません
  • フィードバックデータ: GitHub Mode で投稿されたものはすべて GitHub Discussions に保存されます(リポジトリの公開設定に従ってアクセスが制御されます)。Local Mode のメモは端末の chrome.storage.local にのみ保存され、GitHub やその他の外部サーバーには送信されません
  • スクリーンショット: 対象リポジトリの feedbackers-screenshots ブランチに保存されます
  • ローカル設定: ドメインごとのリポジトリ設定は Chrome ストレージにのみ保存されます

Feedbackers User Manual

Feedbackers is a Chrome extension that lets you capture feedback on the page you're viewing — either by posting it to GitHub Discussions, or by keeping per-page notes locally on your device. This manual walks you through installation and day-to-day usage of both modes.

The side panel header has a [ GitHub | Local ] segmented control so you can switch modes at any time.

  • GitHub Mode: Sign in and post / browse feedback on GitHub Discussions (the classic flow)
  • Local Mode: Stash notes per page in chrome.storage.local and copy them as Markdown that you can paste wherever useful — into an AI Agent, a team issue, or your own notes. Works without signing in

Table of Contents

  1. Installation
  2. Sign in with GitHub
  3. Configure the Target Repository
  4. Post Feedback
  5. Manage Your Feedback
  6. View Feedback on the Current Page
  7. Local Mode (Per-page notes)
  8. Post from the Right-Click Menu
  9. Sign Out
  10. Troubleshooting

1. Installation

Install Feedbackers from the Chrome Web Store.

  1. Open the Feedbackers page on the Chrome Web Store (URL: https://chromewebstore.google.com/detail/feedbackers/lmnfipoklecaapgdamaplegdcppgpfdm)
  2. Click Add to Chrome
  3. Click Add extension in the confirmation dialog

Once installed, Feedbackers is added to Chrome. Depending on your Chrome setup, the Feedbackers icon may not appear directly in the toolbar; it may instead be listed in the Extensions menu (the puzzle icon).

If you don't see the icon in the toolbar, open the Extensions menu at the top right and choose Feedbackers. You can pin it to the toolbar by clicking the pin icon next to the Feedbackers entry.


2. Sign in with GitHub

You need to sign in with a GitHub account to use Feedbackers.

  1. Click the Feedbackers icon in the toolbar to open the side panel
  2. Click Sign in with GitHub
  3. A separate window opens automatically with the GitHub authorization screen
  4. Review the requested permissions (read/write to Discussions, write to the screenshot-storage branch, and read repository metadata) and click Authorize
  5. The window closes automatically, and the side panel switches to the signed-in state

If the Feedbackers App is not yet installed on the target repository: The authorization screen will show an install flow for the App. If you are an admin of the target repository, you can approve it directly; otherwise, ask the repository admin to install it (see the admin manual ADMIN_MANUAL.en.md for details).

If you accidentally close the authorization window: Just click Sign in with GitHub again to start over (any in-progress authorization data is automatically invalidated).


3. Configure the Target Repository

Configure the repository where feedback will be posted. Settings are per-domain (per website).

  1. Open the side panel while viewing the website you want to send feedback from
  2. Click the Settings (gear icon) at the top right
  3. Enter the destination repository under Target Repository:
    • Owner: Repository owner (organization or user name)
    • Repository Name: Name of the repository
  4. Click Save

Settings are bound to the currently displayed domain. To use Feedbackers on a different domain, open a page on that domain and configure it there.


4. Post Feedback

4.1 Basic Posting

  1. Open the web page you want to leave feedback on
  2. Select the Post tab in the side panel
  3. Fill in the form:
    • Title (required): Subject of the feedback
    • Body (required): Details of the feedback
    • Category (required): Select the feedback classification
    • Severity (default: Medium): Choose High / Medium / Low (if left unchanged, Medium is sent)
  4. Click Submit

Once posted, a link to the created GitHub Discussion is displayed.

4.2 Select a Target Element

If you want to give feedback on a specific element on the page (a button, text, image, etc.):

  1. Click the Select element button
  2. Move your mouse over the target element (it is highlighted with a blue outline)
  3. Click the element to confirm your selection
  4. The form displays information about the selected element

Click Reselect to pick a different element, or Clear to cancel the selection.

4.3 Attach a Screenshot

  1. Click the Attach screenshot button
  2. The currently visible screen is captured and a preview is shown
  3. If you don't need it, click Delete to remove it

If the screenshot exceeds 1 MB, you'll get an error. Scroll the page to adjust the visible area.


5. Manage Your Feedback

In the My Feedback tab, you can review and manage the feedback you've submitted.

5.1 Listing

  • Submitted feedback is listed with category, severity, and status badges
  • You can filter by Category, Severity, and Status
  • Click Load more at the bottom of the list to show additional feedback

5.2 Edit Feedback

  1. Click Edit on the feedback you want to update
  2. Modify the title, body, category, and severity
  3. Click Update

5.3 Delete Feedback

  1. Click Delete on the feedback you want to remove
  2. Click OK in the confirmation dialog

Deleting also permanently removes the GitHub Discussion. This action cannot be undone.


6. View Feedback on the Current Page

The This Page tab shows all feedback submitted against the page you're currently viewing.

6.1 Pin Display

Feedback that has a selected target element is shown as a blue pin marker on the page.

  • Use Hide pins / Show pins to toggle pin visibility
  • If the element can no longer be found, the feedback is shown as a card at the edge of the screen instead

6.2 Filters

Just like the My Feedback list, you can filter by Category, Severity, and Status.


7. Local Mode (Per-page notes)

Local Mode is a mode that keeps feedback on your device instead of sending it to GitHub. Jot down casual observations per page and pull them out later as a single Markdown block. Use it as a personal checklist, as input to an AI Agent (Claude Code, ChatGPT, Cursor, etc.), or as material to share with your team — whichever fits. The input form is intentionally minimal (no title, no category, no severity, no screenshot).

Local Mode works without signing in to GitHub. You can switch to it before or after authenticating.

7.1 Switching Modes

Use the [ GitHub | Local ] segmented control at the top of the side panel. Your selection is saved to Chrome storage and persists the next time you open the panel.

7.2 Adding a Note

  1. Pick Local at the top of the side panel
  2. With the target page open, type a note into the body field (body is the only required field)
  3. Optionally click Select element and pick an element on the page to attach its CSS selector and text to the note
  4. Click Add, or press Cmd + Enter / Ctrl + Enter while focused in the body field

Enter while an IME (e.g., Japanese, Chinese, Korean) is composing is ignored — it's treated as a confirm key for the IME, not as submit. Finish composing first, then press Cmd/Ctrl + Enter.

7.3 How Notes Are Scoped

Notes are grouped by page (origin + pathname). For example, notes on https://example.com/app/dashboard and https://example.com/app/settings are kept separately. Query strings and hash fragments are ignored when grouping.

Only notes for the current page are shown in the list, and only those notes are affected by Add / Copy / Clear.

7.4 Copy Notes as Markdown

Click Copy to write the current page's notes to the clipboard as Markdown containing:

  • The page URL
  • Each note body
  • The attached selector and element text, when present
  • The time each note was added

Paste the result wherever it's useful — into an AI Agent (Claude Code, ChatGPT, Cursor, etc.), into a team issue or chat, or into your own working notes.

7.5 Deleting Notes

  • Click the × on a note card to delete a single note (a confirmation dialog appears)
  • Click Clear all at the bottom to delete all notes for the current page at once (notes on other pages are unaffected)

7.6 Where Notes Are Stored

  • All Local Mode notes live only in your Chrome's chrome.storage.local
  • Nothing is sent to GitHub, atman-inc, or any third-party server
  • Clearing the extension's storage from Chrome also deletes your Local Mode notes

7.7 Limitations

  • There's no UI for viewing notes from pages other than the one you're on (planned for a future release)
  • Notes cannot be edited. To change a note, delete it and add a new one

8. Post from the Right-Click Menu

Right-click any element on the page and choose Send feedback from the context menu. The side panel opens with that element pre-selected.


9. Sign Out

Click the Sign out button at the top of the side panel to clear your credentials and any selected-element state.

Signing out removes both the access token and the refresh token stored locally. The next time you sign in, you'll need to go through the GitHub authorization screen again. Local Mode notes are not deleted by signing out (use Clear all in Local Mode if you want to remove them).


10. Troubleshooting

Symptom What to do
Can't sign in If you closed the authorization window or saw an error like state mismatch, click Sign in with GitHub again to retry. If the screen says the Feedbackers App isn't installed on the target repository, ask the admin to install it
Categories don't appear Re-save the repository from the Settings screen. Also make sure Discussions is enabled on the repository
Submission fails Verify that you have Write access to the repository and check your network connection
Screenshot errors The file is likely larger than 1 MB. Zoom out or adjust the visible area of the page
"Please configure the repository" is displayed No repository is set for the current domain. Configure one from the Settings screen
Element picker won't start Element selection is unavailable on some pages, such as those starting with chrome://. Use it on regular web pages
Extension isn't working Make sure Feedbackers is enabled at chrome://extensions. Toggle it on if it's disabled

Feedbackers 利用者マニュアル

Feedbackers は、閲覧中の Web ページへのフィードバックを GitHub Discussions に投稿 するか、端末内にページごとのメモとして蓄積 するかを切り替えて使える Chrome 拡張機能です。本マニュアルでは、拡張機能のインストールから両モードの基本的な使い方までを説明します。

サイドパネル上部には [ GitHub | Local ] のセグメントコントロールがあり、いつでもモードを切り替えられます。

  • GitHub モード: GitHub 認証後に Discussions へ投稿・一覧化するモード(従来の使い方)
  • Local Mode: GitHub に送らず chrome.storage.local にページ単位で貯めて、Markdown にまとめてコピーできるモード(AI エージェントへの入力、手元まとめ、チーム共有などに使える)。未認証でもすぐ使えます

目次

  1. インストール
  2. GitHub にサインインする
  3. リポジトリを設定する
  4. フィードバックを投稿する
  5. 自分のフィードバックを管理する
  6. このページのフィードバックを確認する
  7. Local Mode(ページごとのメモ)
  8. 右クリックメニューから投稿する
  9. ログアウト
  10. トラブルシューティング

1. インストール

Chrome Web Store から Feedbackers をインストールします。

  1. Chrome Web Store の Feedbackers ページを開く(URL: https://chromewebstore.google.com/detail/feedbackers/lmnfipoklecaapgdamaplegdcppgpfdm
  2. Chrome に追加 ボタンをクリック
  3. 確認ダイアログで 拡張機能を追加 をクリック

インストールが完了すると、Feedbackers は Chrome に追加されます。Chrome の設定によっては、Feedbackers のアイコンがツールバーに直接表示されず、拡張機能 メニュー(パズルアイコン)内に表示される場合があります。

ツールバーにアイコンが見当たらない場合は、右上の 拡張機能 メニューを開いて Feedbackers を選択してください。必要に応じて、Feedbackers の横にあるピンのアイコンをクリックするとツールバーに固定できます。


2. GitHub にサインインする

Feedbackers を使用するには、GitHub アカウントでのサインインが必要です。

  1. ツールバーの Feedbackers アイコンをクリックしてサイドパネルを開く
  2. Sign in with GitHub ボタンをクリック
  3. 別ウィンドウで GitHub の認可画面が自動的に開く
  4. 要求される権限(Discussions の読み書き、スクリーンショット保存先ブランチへの書き込み、リポジトリのメタデータ参照)を確認し、Authorize をクリック
  5. ウィンドウが自動的に閉じ、サイドパネル上の表示がサインイン済みに切り替わる

対象リポジトリに Feedbackers App がまだインストールされていない場合: 認可画面で App のインストール導線が表示されます。ご自身が対象リポジトリの管理者であればそのまま承認できますが、そうでない場合は設定者(リポジトリ管理者)に依頼してください(詳細は設定者マニュアル ADMIN_MANUAL.ja.md を参照)。

認可ウィンドウを閉じてしまった場合: 再度 Sign in with GitHub をクリックすれば最初からやり直せます(進行中の認可情報は自動で無効化されます)。


3. リポジトリを設定する

フィードバックの投稿先リポジトリを設定します。設定はドメイン(Web サイト)ごとに行えます。

  1. フィードバックを投稿したい Web サイトを開いた状態でサイドパネルを表示する
  2. 右上の 設定 (歯車アイコン)をクリック
  3. 対象リポジトリ に、投稿先のリポジトリ情報を入力する:
    • オーナー: リポジトリのオーナー名(組織名またはユーザー名)
    • リポジトリ名: リポジトリ名
  4. 保存 をクリック

設定は現在表示中のドメインに紐づきます。別のドメインで使用する場合は、そのドメインのページを開いた状態で再度設定してください。


4. フィードバックを投稿する

4.1 基本的な投稿

  1. フィードバック対象の Web ページを開く
  2. サイドパネルの 投稿 タブを選択する
  3. フォームに以下を入力する:
    • タイトル(必須): フィードバックの件名
    • 本文(必須): フィードバックの詳細
    • カテゴリ(必須): フィードバックの分類を選択
    • 重要度(初期値: 中): 高 / 中 / 低 から選択(未変更の場合は中で送信されます)
  4. 送信 をクリック

送信が完了すると、作成された GitHub Discussion へのリンクが表示されます。

4.2 対象要素を選択する

ページ上の特定の要素(ボタン、テキスト、画像など)に対するフィードバックを送りたい場合:

  1. 要素を選択 ボタンをクリック
  2. ページ上で対象の要素にマウスを移動する(青い枠線でハイライトされます)
  3. 対象の要素をクリックして選択を確定する
  4. フォームに選択した要素の情報が表示される

選択をやり直したい場合は 選択し直す、取り消したい場合は クリア をクリックしてください。

4.3 スクリーンショットを添付する

  1. スクリーンショットを添付 ボタンをクリック
  2. 現在表示されている画面がキャプチャされ、プレビューが表示される
  3. 不要な場合は 削除 ボタンで取り消せる

スクリーンショットのサイズが 1MB を超える場合はエラーになります。ページをスクロールして表示範囲を調整してください。


5. 自分のフィードバックを管理する

自分のフィードバック タブでは、自分が投稿したフィードバックの一覧を確認・管理できます。

5.1 一覧の確認

  • 投稿したフィードバックがカテゴリ、重要度、ステータスのバッジ付きで一覧表示されます
  • フィルタ機能で カテゴリ重要度ステータス による絞り込みが可能です
  • 一覧の末尾にある さらに読み込む で追加のフィードバックを表示できます

5.2 フィードバックの編集

  1. 編集したいフィードバックの 編集 ボタンをクリック
  2. タイトル、本文、カテゴリ、重要度を修正する
  3. 更新 をクリック

5.3 フィードバックの削除

  1. 削除したいフィードバックの 削除 ボタンをクリック
  2. 確認ダイアログで OK をクリック

削除すると GitHub Discussion も完全に削除されます。この操作は元に戻せません。


6. このページのフィードバックを確認する

このページ タブでは、現在閲覧中のページに対して投稿されたすべてのフィードバックを確認できます。

6.1 ピン表示

対象要素が選択されたフィードバックは、ページ上に青いピンマーカーとして表示されます。

  • ピンを非表示 / ピンを表示 ボタンでピンの表示・非表示を切り替えられます
  • 要素が見つからない場合は、画面の端にカード形式で表示されます

6.2 フィルタ

一覧表示と同様に、カテゴリ重要度ステータス でフィルタできます。


7. Local Mode(ページごとのメモ)

Local Mode は、GitHub に送らず端末内にのみフィードバックを貯めるモードです。ページごとにカジュアルな気づきをその場で書き留め、あとで Markdown にまとめて取り出せるように設計されています。手元のチェックリスト、AI エージェント(Claude Code / ChatGPT / Cursor 等)への入力、チーム共有用の素材など、用途は自由です。

Local Mode は GitHub 認証なしで利用できます。サインイン前後のどちらからでも切り替えて使えます。

7.1 モードの切り替え

サイドパネル上部の [ GitHub | Local ] セグメントコントロールで切り替えます。選択中のモードは Chrome ストレージに保存され、次回サイドパネルを開いたときも維持されます。

7.2 メモを追加する

  1. サイドパネル上部で Local を選択する
  2. 対象ページを開いた状態で本文欄にメモを入力する(本文のみ必須、タイトル・カテゴリ・重要度・スクリーンショットはありません)
  3. 任意で 要素を選択 を押してページ上の要素を紐付けると、メモに CSS セレクタ・要素テキストが付与されます
  4. 追加 ボタン、または本文欄で Cmd + Enter / Ctrl + Enter を押して追加する

日本語などの IME 変換中の Enter は送信されません(確定操作として扱われます)。変換を確定し終えてから Cmd/Ctrl + Enter で追加してください。

7.3 メモの保存単位

メモは ページ(origin + pathname)単位 でグループ化されて保存されます。たとえば https://example.com/app/dashboardhttps://example.com/app/settings のメモは別々に管理されます(クエリパラメータやハッシュは無視します)。

現在表示中のページのメモだけが一覧に表示され、追加・コピー・クリアの対象となります。

7.4 メモを Markdown でコピーする

コピー ボタンをクリックすると、現在のページのメモを次のような Markdown 形式でクリップボードに書き出します。

  • ページ URL
  • メモ本文
  • 紐付けた要素がある場合はセレクタ・要素テキスト
  • 追加時刻

貼り付け先は自由です。AI エージェント(Claude Code、ChatGPT、Cursor 等)への入力、チームの Issue や Slack への共有、自分用の作業ログなどにそのまま使えます。

7.5 メモを削除する

  • 各メモカードの × ボタンで 1 件ずつ削除できます(確認ダイアログあり)
  • 一覧下部の すべてクリア ボタンで、現在ページに紐づくメモをまとめて削除できます(他ページのメモは消えません)

7.6 データの保存場所

  • Local Mode のすべてのメモは、お使いの Chrome の chrome.storage.local にのみ保存されます
  • GitHub や atman-inc 等の外部サーバーには一切送信されません
  • Chrome の拡張機能データを削除すると、Local Mode のメモも消えます

7.7 制約

  • 現在表示中のページ以外のメモを閲覧・操作する UI はありません(今後の拡張で対応予定)
  • メモの編集機能はありません。修正したい場合は削除して追加し直してください

8. 右クリックメニューから投稿する

ページ上の任意の要素を右クリックし、コンテキストメニューから フィードバックを送る を選択すると、その要素が自動的に選択された状態でサイドパネルが開きます。


9. ログアウト

サイドパネル上部の ログアウト ボタンをクリックすると、認証情報と選択中の要素情報がクリアされます。

ログアウトでローカルに保存されているアクセストークンとリフレッシュトークンの両方が削除されます。次回サインイン時は、再度 GitHub の認可画面で承認が必要になります。Local Mode のメモはログアウトしても削除されません(必要に応じて Local Mode 側の すべてクリア で削除してください)。


10. トラブルシューティング

症状 対処法
サインインできない 認可ウィンドウを閉じてしまった場合や state mismatch 等のエラーが表示された場合は、再度 Sign in with GitHub をクリックしてやり直してください。対象リポジトリに Feedbackers App がインストールされていない旨が表示される場合は、設定者(リポジトリ管理者)に App のインストールを依頼してください
カテゴリが表示されない 設定画面でリポジトリを再度保存してください。リポジトリの Discussions が有効になっているか確認してください
送信に失敗する リポジトリへの Write 権限があるか確認してください。ネットワーク接続も確認してください
スクリーンショットがエラーになる ファイルサイズが 1MB を超えている可能性があります。ページを縮小表示にするか、表示範囲を調整してください
「リポジトリを設定してください」と表示される 現在のドメインに対するリポジトリ設定がありません。設定画面からリポジトリを設定してください
要素選択が開始できない chrome:// で始まるページなど、一部のページでは要素選択が利用できません。通常の Web ページで使用してください
拡張機能が動作しない chrome://extensions で Feedbackers が有効になっているか確認してください。無効になっている場合はトグルをオンにしてください
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment