Product Hotspot Block - Your interactive shoppable moments

Last updated: May 6, 2026

Overview

The Product Hotspot block is an interactive content block in AppBrew Studio that allows brands to create shoppable "Shop the Look" experiences. By pinning clickable hotspots directly onto a lifestyle image, brands can let users discover and purchase specific products featured in that image.

What It Does

The Product Hotspot block transforms static lifestyle images into interactive, shoppable moments. Brands can place multiple hotspot pins on any image, each linked to a specific product or collection. When a user taps a hotspot, they can instantly view product details and purchase directly from the image — making it ideal for look books, room setups, or any imagery featuring multiple products together.

How to Set It Up

  1. Navigate to the design page — Open Studio and go to the design page where you want to add the Product Hotspot block.

  2. Select your page — From the page list, click on the specific page you want to add the block to.

  3. Add the block — Click Add Block in the editor and select Product Hotspot from the block library.

  4. Add a heading and subheading — Give your block a title and a short description to set the context for the experience (e.g. "Shop the Look").

  5. Upload your image — Add the lifestyle or editorial image on which you want to place hotspots. This could be a model wearing multiple products, a styled room, or any scene featuring items you want to make shoppable.

  6. Add hotspots to your image — Tap on the specific products or areas within the image where you want to place a pin. For each hotspot, link it to the relevant product so users can immediately view and purchase what they see.

  7. Choose how hotspots open — Select your preferred interaction style:

    • Single product card — Tapping a hotspot displays one product at a time, keeping the focus on that specific item.

    • Product list — Tapping a hotspot opens a list of all linked products, giving users a broader view of everything featured in the image.

Common Use Cases

Fashion & Apparel

  • Lookbook Experiences — Pin hotspots on a full outfit image to let shoppers tap and buy individual pieces — the jacket, the bag, the shoes — all from a single lifestyle shot.

  • Seasonal Collections — Showcase a curated seasonal look and make every item in it instantly shoppable, reducing the steps between inspiration and purchase.

Home & Decor

  • Room Setup Inspiration — Style a complete room and add hotspots to each product — the sofa, the rug, the lamp — so users can explore and purchase items they love from the full scene.

  • Interior Design Lookbooks — Create editorial room setups that double as a shoppable catalogue, letting customers visualise products in context before buying.

Beauty & Lifestyle

  • Shoppable Flat Lays — Arrange products in a styled flat lay and hotspot each item so users can quickly identify and purchase what interests them.

  • Routine & Bundle Showcases — Feature a curated product routine or bundle in a single image and let users tap each product individually to learn more or add to cart.

FAQs

  1. What is the Product Hotspot block?

The Product Hotspot block is an interactive block in AppBrew Studio that lets brands pin clickable hotspots onto a lifestyle image, allowing users to tap and shop specific products directly from that image.

  1. How many hotspots can I add to a single image?

You can add multiple hotspots to a single image. We recommend keeping the number of pins manageable so the image doesn't feel cluttered and the experience remains intuitive for users.

  1. Can I link a hotspot to a collection instead of a single product?

No. Each hotspot can only be linked to a specific product.

  1. What types of images work best for this block?

Lifestyle images that feature multiple products in a natural setting work best — such as styled outfits, room setups, or flat lays. The more contextual the image, the more effective the hotspot experience.

  1. Can I add a heading and description to the block?

Yes. You can add a heading and subheading to set the context for the experience, such as "Shop the Look”.

  1. Where does the hotspot link take the user?

Tapping a hotspot opens either a product card or a product carousel list, depending on your chosen display setting. From there, users can view product details and navigate to purchase.