Connect Asana to OverlayQA

Last updated: July 3, 2026

Connecting Asana to OverlayQA lets you export captured design QA issues directly to your Asana projects as tasks. Each exported task includes screenshots, CSS selectors, computed CSS values, page URL, viewport size, and browser metadata.

Connect Your Asana Account

OverlayQA Export to Asana modal showing the Connect to Asana authorization prompt

Tip: You only need to connect once. After the initial OAuth authorization, OverlayQA remembers your Asana connection for all future exports.

Configure Your Export

After connecting, configure where tasks should land in Asana:

SettingDetails
WorkspaceIf you belong to multiple Asana workspaces, select which one to use.
ProjectChoose the Asana project where tasks should be created.

What Gets Exported

Each exported Asana task includes:

FieldDescription
NameThe issue title from OverlayQA.
NotesIssue description with page URL, Figma frame link, browser and OS info, viewport dimensions, element CSS selector, and computed CSS values.
AttachmentScreenshot of the captured area or element.

What Is Not Exported

Note: Exports include computed CSS values from the live page only. They do not include expected design spec values from Figma. Assignee and tags can be set at export via the per-project field picker.

After Exporting

The results screen shows each issue with a clickable link to the created Asana task. Issues are marked as exported in the OverlayQA sidebar, and you'll see a warning if you try to re-export the same issue to Asana.

Two-Way Sync

OverlayQA keeps your issues in sync after export. Changes made in Asana automatically reflect in your OverlayQA dashboard:

What Syncs BackDetails
Status changesWhen a task is completed or moved in Asana, the OverlayQA issue status updates to match.
AssigneeTask assignment in Asana reflects in OverlayQA so designers can see who picked it up.
CommentsComments added in Asana appear on the OverlayQA issue thread.