How to Create Mobile Experiences with Drag and Drop Interaction

- 18th Mar 2013

Getting users to see the relationship between a module and a mobile experience has to be done subliminally – writing about it, describing it and watching it on video isn’t sufficient.  It needs to be reflected in every interaction in the Studio. The simplest mental model for composing applications is the drag-and-drop interaction, which references the user’s earliest memories of using building blocks. You pick a block and move it to the workspace; adding it to the whole. When you tie this interaction with the “Mobile Experience Module”, the user is made to “see” each MX Module as a self-sufficient unit, which can be used in multiple combinations with others to become a larger experience.

Making this easy meant optimizing the action of selecting and dragging it into the workspace (Canvas). Fitt’s law dictated the layout of the user interface; we designed the UI to minimize the distance the module is dragged.

The lengthy list of modules was “chunked” into groups, which expanded to give a filtered list of module with larger hit area (Fitt’s again). This chunking/grouping improves the user’s ability to locate the module required, and short term recall.

mx_drable

The WYSIWYG editor keeps everything real and in real-time. First time users get blown away by the ease with which they can make a change, and then when the see that change in real time on their phones.

These concepts are our instruments to deliver value to the user. Organized systems, reduction in time and effort makes the user perceive the system as simple. The learning curve for the service creation concept is very low – new users get it within a minute of watching a video or seeing a demo. They grasp the concept of the building blocks/modules that make up the service. And these aren’t programmers or web masters who understand code. They range from marketing associates, business analysts, content producers, graphic designers, office managers and college interns …

Our best validation on the design decisions we make, comes from our users everyday. Each email (and user interaction logged in the system) tells us exactly what’s working… and when it didn’t.

Last Friday, we rolled out a beta Module to a limited user base, and one of our users wrote back saying “Thanks, that was exactly what I was looking for!”  It’s what she didn’t say that made our day. She didn’t say, “Tell me how to use this…”

I love that we didn’t have to.

Posted Under: Customer Experience