New and returning users may sign in

We're glad you're here

Please sign in to leave feedback

Signed in as (Sign out)
Close
Close
← Adobe XD: Feature Requests

Request details

Feedback

Adobe XD: Feature Requests: 01 : Design mode

Categories

  • CATEGORIES
  • All ideas
  • My feedback
  • 01 : Design mode 1351 ideas
  • 02 : Prototype mode 368 ideas
  • 03: Share mode 47 ideas
  • 04 : Sharing on the web 212 ideas
  • 05 : Asset exporting 157 ideas
  • 06 : Extensibility 37 ideas
  • 07 : Integration with other tools 120 ideas
  • 08 : Mobile (iOS) 24 ideas
  • 09 : Mobile (Android) 18 ideas
  • 10: Developer Handoff 137 ideas
  • 11: Plugins 134 ideas
  • Other 102 ideas

(thinking…)
  • Searching…

    No results.

    Clear search results
    • Adobe XD: Feature Requests 2,833 ideas

Add multiple states inside symbols / smart objects / components / animation / interaction

What do you think about something like this:

Design mode while smart-object selected can show one more tab at app header with smart-object name. In the appearance panel at the right adds some fields while smart object is selected.

To edit smart-object you should open tab with it and work as before, except that artboards name is the name for different state

And You can place another smart object in a smart object ;)

  •  
    show-hide.png 4 KB
  •  
    Screenshot 2019-06-21 at 11.31.57.png 154 KB
  •  
    Capturar-2.JPG 80 KB
  •  
    Capture.PNG 76 KB
  •  
    Screen Shot 2018-12-16 at 15.39.59.png 118 KB
  •  
    Screen Shot 2018-12-11 at 1.53.14 PM.png 396 KB
  •  
    Group 625.png 21 KB
  •  
    toggle1b.gif 66 KB
  •  
    Screen Shot 2018-10-24 at 12.14.57.png 11 KB
  •  
    Screen Shot 2018 08 30 at 5 40 04 PM.png 225 KB
  •  
    Screen Shot 2018-07-17 at 12.25.55.png 21 KB
  • Kodi_Example.mp4
    Kodi_Example.mp4 5374 KB
  •  
    Single_-__Editing_states_of_single_control.png 538 KB
  •  
    Editing_states_of_single_control.png 1157 KB
  •  
    Editing_states_of_single_control_-_1.png 1160 KB
  •  
    Editing_States_of_controls.png 1157 KB
  •  
    Editing_States_of_controls_–_1.png 1157 KB
  •  
    Artboard_-_States_of_controls.png 632 KB
  • Component_(nested_states_as_stacked_artboards.mp4
    Component_(nested_states_as_stacked_artboards.mp4 21440 KB
  •  
    states.PNG 43 KB
  •  
    navigation.PNG 194 KB
  •  
    Interaction.png 48 KB
  •  
    Shapes-and-property.png 72 KB
  •  
    Initial.png 62 KB
  •  
    Screen_Shot_2017-03-13_at_11.28.43.png 90 KB
  •  
    Screen_Shot_2017-03-13_at_11.27.41.png 28 KB
  •  
    Edit_smart-object.jpg 136 KB
  •  
    Design_mode_while_smart-object_selected.jpg 129 KB
1,501 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

Mikhail Nikipelov shared this idea  ·  Mar 18, 2016  ·  Flag idea as inappropriate…  ·  Delete…  ·  Admin →

How important is this to you?

We're glad you're here

Please sign in to leave feedback

Signed in as (Sign out)
Close
Close
feature-completed  ·  AdminSherif Assaf (Product Manager, Adobe) responded  ·  Nov 7, 2019

Dear XD Community -

I’m glad to announce that we have introduced the ability to add Interactive Component States in XD 24. This means that you could now add and manage your component states variations from a single component while enabling you to define Hover and Tap interactions between them.

We also preserve those states and interactions when you use those components across other XD documents. This means that you could have a single source of truth (Sticker sheet) for all your design system components with motion and interactivity baked into them. Any changes made to your master components in your source document will propagate to all linked components in all your projects so that your components are is always in sync.

To learn more about component states and how to get stated with them please check:
https://letsxd.com/states

Watch out for many more improvements in this area in the coming months.

But in the meanwhile, please give it a try and share with us the areas that you would like us to further improve upon or invest in.

Thank You,
Sherif

Show previous admin responses (3)
feature-in-the-backlog  ·  AdminElaine (Adobe) (Product Manager, Adobe) responded  ·  Sep 1, 2017
AdminPeter Flynn (Software Engineer, Adobe) responded  ·  Nov 4, 2016

Now that a baseline symbols feature is available in Adobe XD, please try it out and then let us know your detailed feedback on the idea of states inside symbols — how would you use it, and how would you want it to work?

AdminPeter Flynn (Software Engineer, Adobe) responded  ·  Jun 29, 2016

Note: this is essentially an add-on to the initial request to support reusable symbols at all. If you support this request, please also upvote the “main” request at https://adobexd.uservoice.com/forums/353007/suggestions/12931467-reusable-symbols-master-objects

Tweet
  • Remove
Attach a File

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
  • Joakim commented  ·  November 15, 2016 5:59 AM  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    What?
    Allow layers that you create, to have multiple states.

    Why?
    Because this is how interactive software behaves. And what we do every time we make a copy of an artboard, to make a button, list or something else switch states. Essentially what we use Invision, Marvel and all the other prototyping tools for.

    Example:
    I make a blue button, with text inside it. Save it as a layer.
    I click on "state 2" somewhere, change the color and text of the button, and set it to activate on-click following state 1.

    I go into preview, and click the red button --> it switches to blue.

    But it can become very complex?
    If you can make it easier than copying artboards, then I would say it solves our problems.

    Where can I see something like this?
    Axure

    Submitting...
  • David Knell commented  ·  November 8, 2016 10:34 AM  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    Sketch v41, which came out today, does this now. Their method is that they allow you to treat any same-sized symbols within a symbol as states: you can click on the outer symbol and toggle between the inner symbols. I'm still getting used to this method, but it's a pretty interesting approach and seems to work pretty well.

    What's missing from Sketch's new states ability is . . . prototype mode! In XD, being able not just to switch between states in design mode, but being able to prototype between states . . . that is the holy grail of awesome!

    Submitting...
  • Peter DiBartolo commented  ·  November 5, 2016 10:25 AM  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    +1
    Perhaps consider a Properties Panel (like Photoshop).

    From Photoshop:
    Multi-layered smart objects should be imported (or linked) into XD, with states managed by a Properties-esque panel.

    From Illustrator:
    Multi-layered Symbols could be imported (or linked) into XD, with states managed by a Properties-esque panel.

    Within XD:
    Multi-layered Symbols could be used and managed by a Properties-esque panel.

    Here's how Bradee Evans speaks to this concept within Photoshop.
    https://medium.com/photoshop/layer-comps-and-place-linked-smart-objects-6feb574963ef#.5n94t1v4e

    Submitting...
  • David Knell commented  ·  November 4, 2016 11:44 AM  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    Please do this!!!

    I envision the current special Symbol folder (the one that has the double-circle icon) and inside it three (for example) special State folders (that have a different, unique States icon), one for each state. The top State folder is shown by default (and the rest are hidden), but you can right-click an instance of a symbol and change it to one of its other states. Or in the layers panel, instead of an eye icon to show/hide each layer, you have a radio button of sorts for each state to select which state is shown. Something like that.

    I would hope that in prototype mode you could link symbols' states to each other. That way you can have things like switches, dropdown menus, text in text fields, hover states for buttons and links, click to enter edit mode on a task or something, checked checkboxes, basically all the things!!!

    Seriously, states and linking between states would be so rad!!!

    Here's a mockup of how states inside symbols might work (I didn't mockup unique state icons, though; I just kept the folders the same folder icon): https://xd.adobe.com/view/c0b26f8a-c8b5-4d59-a081-b9658a45d81f/

    Submitting...
  • Toon Van de Putte commented  ·  November 4, 2016 2:19 AM  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    Perhaps a solution would be that an interactive element (inside or outside a symbol) gets a new type of action: 'change value' or something similar. Symbol instances could then dynamically change state based on that value.
    You could, for example, have a button that sets a 'color' value to the string 'Red' and then have a symbol that shows its state 'Red' whenever the global 'color' value is 'Red'.
    I do wonder, though, what the conceptual difference would be between a state and an artboard, save for one being nested inside a symbol.

    Submitting...
  • Michael Gehrmann commented  ·  September 30, 2016 1:50 AM  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    Here is a little sample Case: http://adobe.ly/2deGQEJ

    In a Screen-Based Flow this simple interaction changing the color of an element takes a lot of screens to simulate – and due to practical restrictions, I limited it to just three colors.

    The Problem is Making changes to elements later have to be replicated on many screens. And it's hard to keep track of all the connections between screens.

    You can just imagine the number of screens exploding, when a second feature is added.
    eg a button changing the font-family of the word "Masterplan"

    With State-Based Interactions, this could be broken down to one or maybe two screen.

    Submitting...
  • Kaue Lima commented  ·  June 30, 2016 11:42 AM  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    I would like to add that multiple states could be toggled by actions like tapping on the symbol, one of it's elementos or other symbols.

    This would enable doing things like expandable objects, animated elements within a screen and other.

    Submitting...
← Previous 1 2 3 4 5 6 7 8 Next →

Adobe XD Feedback : Feature Requests & Bugs · UserVoice Terms of Service & Privacy Policy · Adobe Terms of Use · Adobe Privacy Policy