How to show the user has “grabbed” an element?

The name of the pictureThe name of the pictureThe name of the pictureClash Royale CLAN TAG#URR8PPP





.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty margin-bottom:0;







up vote
2
down vote

favorite












I'm working on a mobile drag and drop feature, where users can rearrange the order of list items by dragging and dropping them in a new place in the list.



So far the flow is as follows: the user makes a long tap on an item in the list to grab it, the user then drags that item to a new place in the list and drops it there to confirm.



My question is:



What kind of visual feedback can I use to show that the user has the item "grabbed" after the long tap?



This is important to show the user that they are now in drag and drop mode and can start dragging the item.






mobile drag-n-drop ordering gestures







share|improve this question



























    up vote
    2
    down vote

    favorite












    I'm working on a mobile drag and drop feature, where users can rearrange the order of list items by dragging and dropping them in a new place in the list.



    So far the flow is as follows: the user makes a long tap on an item in the list to grab it, the user then drags that item to a new place in the list and drops it there to confirm.



    My question is:



    What kind of visual feedback can I use to show that the user has the item "grabbed" after the long tap?



    This is important to show the user that they are now in drag and drop mode and can start dragging the item.






    mobile drag-n-drop ordering gestures







    share|improve this question























      up vote
      2
      down vote

      favorite









      up vote
      2
      down vote

      favorite











      I'm working on a mobile drag and drop feature, where users can rearrange the order of list items by dragging and dropping them in a new place in the list.



      So far the flow is as follows: the user makes a long tap on an item in the list to grab it, the user then drags that item to a new place in the list and drops it there to confirm.



      My question is:



      What kind of visual feedback can I use to show that the user has the item "grabbed" after the long tap?



      This is important to show the user that they are now in drag and drop mode and can start dragging the item.






      mobile drag-n-drop ordering gestures







      share|improve this question













      I'm working on a mobile drag and drop feature, where users can rearrange the order of list items by dragging and dropping them in a new place in the list.



      So far the flow is as follows: the user makes a long tap on an item in the list to grab it, the user then drags that item to a new place in the list and drops it there to confirm.



      My question is:



      What kind of visual feedback can I use to show that the user has the item "grabbed" after the long tap?



      This is important to show the user that they are now in drag and drop mode and can start dragging the item.






      mobile drag-n-drop ordering gestures




      mobile drag-n-drop ordering gestures






      share|improve this question













      share|improve this question











      share|improve this question




      share|improve this question










      asked 4 hours ago









      RobbyReindeer

      4,1341740




      4,1341740




















          1 Answer
          1






          active

          oldest

          votes

















          up vote
          3
          down vote













          Add a drop shadow to the element so it appears pinned to the finger.





          Left: Material Design Components > Lists > Behavior



          Right: Apple Human Interface Guidelines > iOS > User Interaction > Drag and Drop



          Apple's HIG specifically mentions the ‘rising’ action:




          Touching and holding selected content makes it appear to rise and adhere to the user's finger.







          share|improve this answer




















            Your Answer







            StackExchange.ready(function()
            var channelOptions =
            tags: "".split(" "),
            id: "102"
            ;
            initTagRenderer("".split(" "), "".split(" "), channelOptions);

            StackExchange.using("externalEditor", function()
            // Have to fire editor after snippets, if snippets enabled
            if (StackExchange.settings.snippets.snippetsEnabled)
            StackExchange.using("snippets", function()
            createEditor();
            );

            else
            createEditor();

            );

            function createEditor()
            StackExchange.prepareEditor(
            heartbeatType: 'answer',
            convertImagesToLinks: false,
            noModals: false,
            showLowRepImageUploadWarning: true,
            reputationToPostImages: null,
            bindNavPrevention: true,
            postfix: "",
            noCode: true, onDemand: true,
            discardSelector: ".discard-answer"
            ,immediatelyShowMarkdownHelp:true
            );



            );













             

            draft saved


            draft discarded


















            StackExchange.ready(
            function ()
            StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fux.stackexchange.com%2fquestions%2f121681%2fhow-to-show-the-user-has-grabbed-an-element%23new-answer', 'question_page');

            );

            Post as a guest

















            1 Answer
            1






            active

            oldest

            votes








            1 Answer
            1






            active

            oldest

            votes









            active

            oldest

            votes






            active

            oldest

            votes








            up vote
            3
            down vote













            Add a drop shadow to the element so it appears pinned to the finger.





            Left: Material Design Components > Lists > Behavior



            Right: Apple Human Interface Guidelines > iOS > User Interaction > Drag and Drop



            Apple's HIG specifically mentions the ‘rising’ action:




            Touching and holding selected content makes it appear to rise and adhere to the user's finger.







            share|improve this answer
























              up vote
              3
              down vote













              Add a drop shadow to the element so it appears pinned to the finger.





              Left: Material Design Components > Lists > Behavior



              Right: Apple Human Interface Guidelines > iOS > User Interaction > Drag and Drop



              Apple's HIG specifically mentions the ‘rising’ action:




              Touching and holding selected content makes it appear to rise and adhere to the user's finger.







              share|improve this answer






















                up vote
                3
                down vote










                up vote
                3
                down vote









                Add a drop shadow to the element so it appears pinned to the finger.





                Left: Material Design Components > Lists > Behavior



                Right: Apple Human Interface Guidelines > iOS > User Interaction > Drag and Drop



                Apple's HIG specifically mentions the ‘rising’ action:




                Touching and holding selected content makes it appear to rise and adhere to the user's finger.







                share|improve this answer












                Add a drop shadow to the element so it appears pinned to the finger.





                Left: Material Design Components > Lists > Behavior



                Right: Apple Human Interface Guidelines > iOS > User Interaction > Drag and Drop



                Apple's HIG specifically mentions the ‘rising’ action:




                Touching and holding selected content makes it appear to rise and adhere to the user's finger.








                share|improve this answer












                share|improve this answer



                share|improve this answer










                answered 3 hours ago









                grg

                3921313




                3921313



























                     

                    draft saved


                    draft discarded















































                     


                    draft saved


                    draft discarded














                    StackExchange.ready(
                    function ()
                    StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fux.stackexchange.com%2fquestions%2f121681%2fhow-to-show-the-user-has-grabbed-an-element%23new-answer', 'question_page');

                    );

                    Post as a guest
































































                    Comments

                    Post a Comment

                    Popular posts from this blog

                    What does second last employer means? [closed]

                    Image
                    Clash Royale CLAN TAG #URR8PPP .everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty margin-bottom:0; up vote -3 down vote favorite Say, for example I have worked in the following companies, Company A => 2010 - 2011 Company B => 2011 - 2012 Company C => 2012 - Till Date Company D => Have offer Now assume Company D is asking to submit documents from my second last employer. So from the list of companies given, which company would be qualified as second last employer? software-industry employer share | improve this question asked Aug 10 '14 at 5:16 Rajaprabhu Aravindasamy 559 1 6 13 closed as off-topic by Jim G., jmort253 ♦ Aug 11 '14 at 1:58 This question appears to be off-topic. The users who voted to close gave this specific reason: "Questions seeking advice on company-specific regulations, agreements, or policies should be directed to your manager or HR department. Questions that address...
                    Read more

                    List of Gilmore Girls characters

                    Image
                    The season three cast—(Back row): Lane, Michel, Paris, Emily, Richard, Sookie, Miss Patty, Kirk; Front row: Jess, Luke, Lorelai, Rory, Dean This is a list of characters for the comedy-drama television series Gilmore Girls . Contents 1 Main characters 1.1 Lorelai Gilmore 1.2 Rory Gilmore 1.3 Sookie St. James 1.4 Lane Kim 1.5 Michel Gerard 1.6 Luke Danes 1.7 Emily Gilmore 1.8 Richard Gilmore 1.9 Paris Geller 1.10 Dean Forester 1.11 Jess Mariano 1.12 Kirk Gleason 1.13 Jason Stiles 1.14 Logan Huntzberger 2 Major recurring characters 2.1 Christopher Hayden 2.2 Jackson Belleville 2.3 Mrs. Kim 2.4 Tristin DuGray 2.5 Max Medina 2.6 Taylor Doose 2.7 Dave Rygalski 2.8 Marty 3 Recurring characters 3.1 Stars Hollow 3.2 Chilton 3.3 Yale 3.4 Other 4 Notable guest stars 5 Unseen characters 6 Notes 7 References Main characters Actor Character Appearances Season 1 Season 2 Season 3 Season 4 Season 5 Season 6 Season 7 A Year in the Life Lauren Graham Lorelai Gilmore...
                    Read more

                    Confectionery

                    Image
                    Prepared foods made with a lot of sugar or other cabohydrates "Sweetmeat" redirects here. For the racehorse, see Sweetmeat (horse). Not to be confused with Sweetbread. This Kransekake is a traditional Scandinavian baker's confection. Confectionery is the art of making confections , which are food items that are rich in sugar and carbohydrates. Exact definitions are difficult. [1] In general, though, confectionery is divided into two broad and somewhat overlapping categories, bakers' confections and sugar confections. [2] Bakers' confectionery, also called flour confections , includes principally sweet pastries, cakes, and similar baked goods. Sugar confectionery includes candies ( sweets in British English), candied nuts, chocolates, chewing gum, bubble gum, pastillage, and other confections that are made primarily of sugar. In some cases, chocolate confections (confections made of chocolate) are treated as a separate category, as are sugar-free versions of ...
                    Read more