Browser extension

The Alloy browser extension lets you instantly capture any webpage or product experience and bring it into Alloy's prototyping environment. This enables rapid, high-fidelity prototypes that match your product's real look and feel. Open a page, click Capture and immediately start exploring new ideas, layouts and user flows inside Alloy without needing mockups, staging environments or manual screenshots.

What is the Alloy browser extension?

The Alloy extension integrates Alloy's prototyping app with the web app or webpage you're currently viewing.

The extension allows you to view your product and prototype new experiences using your product's exact look and feel. We call this capturing the view you want to use for prototyping.

An example:

A product manager at a travel company wants to envision a new listing page for hotel search results. They navigate to their current search results page, open the Alloy browser extension and select Capture. Alloy captures the look and feel of their product and opens a new browser tab. The product manager prompts Alloy to prototype and preview the changes they had in mind.

You can also capture your product view by providing a publicly-accessible link.

Add the extension

Alloy's browser extension makes capturing and prototyping off of your real product as easy as clicking a button in the toolbar.

Prerequisites:

  • Use a Chromium-based browser such as Google Chrome, Dia, Microsoft Edge, Brave, or Opera. If you cannot use a Chromium-based browser, you can still capture your product using public links.
  • You must have permission to add extensions to your browser. Check with your sysadmin or see Troubleshooting below.

To add the extension, add it from the Chrome Web Store.

The Alloy extension appears where your other extensions normally do. In Chrome, look for the puzzle icon in your browser's toolbar.

Pin the extension to your browser's toolbar

Pinning the extension makes it persistent on your toolbar and saves you clicks when capturing your product for prototyping.

To pin the extension in Chrome:

  1. Select Extensions from the toolbar, usually located to the right of the address bar.
  2. Next to Alloy select Pin. The Alloy extension appears next to the Extensions icon in the toolbar.

Capture your product

The Alloy browser extension lets you capture what you're viewing in your browser to bring into the Alloy app for rapid prototyping.

To use the extension:

  1. Navigate to the product experience you want to start prototyping from.
  2. Select the Alloy extension from your browser's toolbar.
  3. Select Capture. A new tab opens where you can prompt Alloy to prototype changes to your product's experience. The captured page is added to your Captures in Alloy.

Remove the extension

If you no longer want to use the extension, you can remove it from your browser.

Note: Removing the extension does not remove any captures or prototypes from Alloy. You can still use existing captures to prototype with Alloy.

To remove the extension from Chrome:

  1. Select Extensions from the toolbar, usually located to the right of the address bar.
  2. Next to Alloy select More options > Remove from Chrome.

Troubleshooting

The Alloy extension works well in most situations. Most common problems stem from company security and privacy settings.

Enterprise and admin-controlled browsers

In companies with strict network policies, you may need to ask your sysadmin or security team to approve the Alloy app and add the Alloy browser extension.

Steps vary, but often include:

  • Approving the Alloy extension in the Chrome Web Store
  • Allowlisting *.alloy.app in your company's antivirus, firewall or proxy settings
  • Adding Alloy to your company's approved applications list

Until Alloy is allowlisted, you may encounter a "capture failed" page when attempting to use the extension.

The best way to start this process is to share this page with your network admin or security team, along with a link to our Security & Data Protection Portal. This portal covers all the steps we have taken to ensure Alloy is secure and compliant with your organization's policies, as well as how to get in touch with our security team.

If you are waiting for approval, you can still try Alloy by capturing a public link.

Nothing happens when I click the extension icon

The extension only works on new tabs opened after adding it. Try refreshing the tab you want to capture or restarting your browser. Contact our support team if you're still having issues.