What will be SO important is the ability, in a shared prototype, to move between states without leaving a screen. For instance, checking checkboxes. Obviously, if changing the state changing something else on the screen, you'd want to create a new artboard and navigate to that. For instance, if checking a checkbox revealed content on the page.

The most common use I see of moving between states without leaving the page is hover-states for links and buttons. You simply create a button, make it a symbol, give it a second symbol state, and in prototype mode, create a link (or something) between the two states so that when you hover* over the symbol (which is in the default state) it changes to the hover-state until you stop hovering over it.

* obviously this can only work once Hover is an interaction type in prototype mode.

Add states to symbols so no need to link to a whole new page ie.

- buttons with roll over
- check boxes selected and de-selected

Like InDesign actions, it will be nice if we can have feature like this in which we can set up and action (example: Glow when hover or slide show like Muse)

ボタンのカスタマイズと、そのインタラクションのプレビューがほしい
画面遷移に加え、ボタンの動きもインタラクティブの重要な一要素であるため、ボタンのhover,clickなどの動作が設定できると嬉しいです。

making shapes a button, then have states for those buttons like, hover, visited, etc.

Being able to hide an object and show it on action is paramount to most meaningful prototypes. Make it like Axure only simpler. ; )

This is actually a feature which without, it is quite impossible to do a meaningful prototype for web and mobile - at least for me.

Hi Elaine,
Thanks for your replay, I've tried to use symbols, I can hide items, but I cannot have them shown by triggering a link.
As target in Prototype mode it's only possible to change artboards, not create interaction inside one artboard.
I'd like to mock a behaviour.
Anyway, If
I got it right, this point could be merged with Mikhail Nikipelov idea, they're very similar.
But, again, I don't think symbols can solve the issue, or at least I couldn't find any way to make them behave as I'd want.

Thanks

Alessandro

Hi, would be nice to have the ability to show and hide object with an interaction in prototype mode.
e.g. I'd like to create a progressive disclosure path, I could create a group of elements, hide it and having them visible when the appropriate link is triggered.

I hope I've not been redundant.

thanks

Alessandro

Yes, we need this. Thank you all. As a designer and developer, I need to see how to interaction/function was seen.

Many of the form and other requests could be accomplished if you allow Interaction between individual elements.

Supported interactions: Show, Hide, Change (change image)

Example: Radio button
You have a dialog that has 3 radio buttons in it. To make them interactive, you remove the selected ball and do the following:
In Design mode:
1. Add the dialog
2. Create one shape with no border or fill on top of each raddio buttons text
2. Create a ball shape with fill for each radio button element
3. Make the ball shapes invisible

In prototype mode
4. Connect each invisible shapes (on top of the text) with the corresponding selected ball shape with: On click -> Show

Limitations
- If the user clicks multiple radio buttons they would not exclude each other. This however could be accomplished by dragging On click -> Hide to the other radio buttons selected ball shape.

Need to be toggle button for design, show how to action button etc.. For example : I have a eye icon in the password input and I need to change eye icon for show password and hide password. Than prototype mode I change this eye very easy. It will be good for designers and developers how to view actions.

Thank you

I'm repeating what everyone else is saying, but this is an important feature! Either this feature should
1. allow for multiple states within objects that can be toggled by actions
OR
2. allow object visibility/properties to be controlled by actions

Or like in https://www.youtube.com/watch?v=PQ1f29pt5HE
it would be possible to have the on/off state WITHIN the switch symbol and then have working switches without having to duplicate the whole page.

It would be awesome to have a similar concept as proto.io's container states and animations in Adobe XD. It would allow us to define a symbol (container in proto.io) that has its own states and animations between those states and reuse them on several pages.

For instance: A simple slideshow within a page, define it as a symbol, make each shown picture a state and navigate through them via arrow-links. Add animations between those states to make the images slide in from left/right.

Allow us to create symbols that have actions without needing to wire to a new page. Example would be clicking on a toggle and having it switch. Similar to Adobe Animate symbols.

Hello team Xd,

I have a click dummy for a web application workflow that shows logged in and logged out states. To show both logged in/logged out workflows, I currently have to duplicate artboards and add slightly different logged in/logged out symbols for chunks of the UI.

I think it would be a nice addition to create my own custom variable `isLoggedIn` that I can associate with visibility of parts of a symbol or the entire symbol e.g. if `isLoggedIn`, show this text; else show that text.

In Prototype mode, one would be able to tie the variable value change to the click of a button or landing on some artboard.

Extending this idea, if someone was prototyping for multiple personas, a variable `userPersona` could be set to some persona string, and any symbols that watch `userPersona` can show the right thing for that specific persona after it is enabled in the click dummy.

I may have missed it, but it's crucial to validate user behavior and there doesn't appear to be a way to specify a touched state

Be able to add hover, on click state into the symbol in design mode and pick which one to show once you are in the prototype mode. would be very useful for menus, where certain button needs to look clicked. Right now one needs to create different symbols in order to do the different color of the clicked state, which makes the symbol useless for those cases..

States needs to be states, not variations. For example, a blue and a red button is variations of a button, and each a different symbol. A state is contextual versions of one symbol. The states of a blue button can be normal, active, pressed, disabled, etc. Other elements like form fields, table elements, shopping cart, etc. have other states.

In a prototyping tool, states should be animated/interactive “inline” on a page without the need to duplicate the artboard to experiment with the states.