0

While working on a sidebar panel of an application, I have encountered a unique problem. A user needs to create steps (think in terms of creating an online course via a builder). One can add as many steps as they like. Each of these steps has tons of fields within it. I thought of creating a collapsible card with move functionality. Because a user might feel the need to change the order of the steps. Is this technically correct? Should the drag/move icon come outside the card?Image

2
  • 1
    Although complex, I don't see a special problem. There's an example in this Stackoverflow Q&A
    – Danielillo
    Dec 13 '21 at 20:58
  • 3
    From an accessibility perspective, make sure that elements can be reordered by more than just drag and drop. Perhaps allow them to TAB to the "grid" icon and move the element up or down via a special key (eg, shift+up) or via "move up" and "move down" buttons. Dec 13 '21 at 22:06
1

You can certainly dedicate areas within a large drag-and-drop surface to do specific things, such as expanding a panel. This can be helped with a visual indicator on hover/ mouse-over:

enter image description here

However, as I've shown above, you might have to think about the panel behaviour once it is expanded. Some designers choose to isolate interactions until done (for example, using a modal), and then hand control back to the drag-and-drop functionality.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.