Skip to content
← Adobe XD: Feature Requests (Read-Only)

Request details

Adobe XD: Feature Requests (Read-Only): 02 : Prototype mode

Categories

(thinking…)

Create separate, custom hotspot areas (e.g. larger than the visible shapes)

Now you can connect layers but what if you want to connect a hit area larger than a layer? Now you can work around this by drawing a rectangle behind the area and linking that up, but it would be great to be able to draw actual hotspots.

349 votes

We're glad you're here

Please sign in to leave feedback
Signed in as (Sign out)
Close
Close

We’ll send you updates on this idea

Johan Ronsse shared this idea  ·   ·  Report…  ·  Admin →
feature-completed  ·  Andrei Ganci (Adobe XD) responded  · 

With the launch of the Padding feature in XD 26, you can add padding to a group. This controls the background of the group, or if it has no background it adds safe-space to the object.

That safe-space translates over as a hotspot in prototype mode, enabling you to interact with areas that are larger than the visible shape.

Learn more about the new padding feature here: https://helpx.adobe.com/xd/help/set-fixed-padding-for-components-groups.html

Show previous admin responses (4)

We're glad you're here

Please sign in to leave feedback
Signed in as (Sign out)
Close
Close
Submitting...
An error occurred while saving the comment
  • ikelleigh commented  ·   ·  Report

    Unless you are stitching together screenshots from Photoshop.

  • Corey Lucier (Adobe) commented  ·   ·  Report

    Ah but you should not have to draw any rectangles at all (unless you have a flat image). You can simply click on a design element or group to serve as the hit area.

  • ikelleigh commented  ·   ·  Report

    It took me a little while to understand that I need to draw rectangles (no fill or stroke) to use as hotspots in the Prototype mode. It would be great if there was a Hotspot tool you could use while in Prototype mode and link them as you go. A simple fly-out with rectangle or circle shape hotspots to define without having to create shapes then remove the fills/strokes all of the time.

    And also when clicking on one of these hotspots, we can decide if the interaction is a hover or a click. Useful for showing Tooltip style interactions.

  • Siska Hines commented  ·   ·  Report

    Yes! I came to this page just to vote for this! (Apart from adding Device Preview of course). We need hints of clickable area on the preview. If not, user will be blindly clicking/hovering try to find clickable areas. Please add this feature!!

  • byron commented  ·   ·  Report

    really really want this feature - many of our apps use lots of white space, many of our UI elements for navigation between views are small icons, but in development the tap target is quite a bit larger. the result is that when prototyping, it feels like you get very tiny tap targets for everything...

  • Jeff commented  ·   ·  Report

    It may be nice to have a hotspot tool in "prototype" mode with the added value of having a visual reference for all interactive regions instead of having to create invisible shapes in "design" mode as a workaround.

    This will also avoid creating clutter in "design" mode and would only be visible in "prototype" mode (e.g. InVision) in helping to keeping things organized.

    IMO "design" mode should be focused on designing, "prototype" mode should be for creating interactions.

  • Dashanan commented  ·   ·  Report

    Yes, this will also help to prototype existing jpgs of UI designs.

  • Anonymous commented  ·   ·  Report

    1. Provide visual clue for clickable area in Preview mode (just like inVision)
    2. Able to add click area for links in Prototype mode ("fat-touch" area)

  • Anonymous commented  ·   ·  Report

    This is a must. I do not want to have to draw a separate hit area.

1 3 Next →