UI

Five Myths of 3D User Interface Design

Are the things you believe about user interfaces untrue? Maybe something seems logical but you've not really tested it out? Or you've just followed the crowd? Following up on our post about magic and user perception, we are now going to expose the five myths of user interface design.

5 Myths of User Interface Design

Dr. Gordon Kurtenbach, Head of Autodesk Research, has been studying user interfaces in 3D computer graphics for more than two decades and gave a great talk on the myths of user interface design - things he once believed were true but didn't deliver as expected. The five myths of 3D user interface design according to Dr. Kurtenbach are:

  1. 3D Input Devices are Best for Working in 3D
  2. 3D Displays are Best for Working in 3D
  3. Haptic Devices are the Future
  4. Icons = Good Design
  5. A Good User Interface is Natural

Myth #1: 3D Input Devices are Best for Working in 3D

The logic goes that we live in the physical world are always working in 3D. Everyday activities like washing the dishes, folding laundry and driving a car all happen in 3D. The challenge is that when dealing with a computer, there's a piece of glass between the data and the user, resulting in a number of problems:

  • Fatigue: people are used to resting their arms on a desk when dealing with a traditional mouse and keyboard.
  • Positioning is not the only task: 3D input devices are generally used for positioning objects but there is more to working with data than positioning it. For example, there are a lot of data entry type tasks for defining the properties of an object.
  • Depth perception is required: with a piece of glass in the way, we have to find ways to replicate depth. See myth #2 for more info.

Myth #2: 3D Displays are Best for Working in 3D

There's been a lot of work in stereography and many have experienced it in the constrained environment of a movie theatre. Most stereo solutions are faking 3D depth to fool your system. This is what can lead to motion sickness. This is not to say stereo is not well done or worthy of more work - it's just that there are still hurdles to overcome.

Human depth perception is complex. People with one eye can still perceive depth as we rely on a number of cues including the height of the viewer, the height of the viewed objects and the distance from viewer to objects.

The challenges for 3D displays include:

  • Intrusiveness: Viewers must wear glasses or head gear. Some people who don't wear eye glasses do not like to wear glasses. Some who wear glasses have trouble incorporating the additional gear.
  • The quality of display: Both the quality of content and the resolution can lower the viewer's experience. There are also range of view limitations that we don't have in the real world. We can look wherever we want.
  • Tangible benefit: A typical problem for marketers in all industries is explaining how much better the experience gets. Consumers are faced with choices like would you rather a bigger monitor or a smaller stereo monitor?

5 User Interface Myths Autodesk Research

Myth #3: Haptic Devices are the Future

Haptic devices reproduce the sense of touch. Try a quick do-it-yourself haptic device by putting a pen on your computer monitor or something else close by. Trace the contours. How does it feel? Now try the same thing with your finger, the palm of your hand and the back of your hand. How does that feel? It's a richer experience with your finger and hand, isn't it?

Haptic devices are currently only giving basic feedback where our sense of touch is rich. We can get feedback on texture, hardness, temperature, weight, volume, contours, and the shape of the object. Like the myths above, there is a lot of information that we need to replicate in the digital world to make it a meaningful user experience.

One place you can use haptic feedback today is with rapid prototyping. If you were designing a headset, you could 3D print it at scale and try it on.

User Interface Myths Autodesk Research

Myth #4: Icons = Good Design

3D users are visual people, right? And visual people prefer icons. Maybe. But you can get carried away with icons. It's very important not to confuse visual appeal with ease of use.

It's also important not to be lazy and copy the faults of others. Just because it's industry practice to use lots of icons does not mean that lots of icons are good design. Icons are a foreign language and we use pop up tool tips as the translator. To complicate things further, we still rely on antiquated technology to represent some operations. We still use a floppy disk to represent saving. We've got plenty of people in the world who have never seen a floppy disk, let alone used one.

User interface design innovators should seek to improve what exists by taking advantage of the latest technologies. How could one improve upon this situation by using the power of cloud computing? What if tool tips became more visual and played a learning video instead of a line of text? At Autodesk Research, we call it ToolClips!

Autodesk Research ToolClips
ToolClips in AutoCAD provide access to extended documentation and video tutorials

Myth #5: A Good User Interface is Natural

Natural is a tricky word and can be misunderstood. Are we talking about grass and flowers in a meadow? Perhaps a health food store?

We can look at natural as a statement of skills - what do people already have? What experience from the physical world applies to operating a computer? What skills can be transferred from using a web browser to using a word processor? The pillars of direct manipulation provide additional insight:

  • Objects and results should be visible
  • Pointing and moving are strong metaphors
  • Incremental: allow users to work through the process
  • Reversible: allow users to back out of an error
  • Rapid: engage users with an interactive interface

Whatever we call it, we are really trying to accelerate the rate at which novices begin to perform like experts.

Novice to Expert User Interface Transition Autodesk Research
Helping novice users transition to experts


Is something natural the best way to turn novices into experts? A hammer and nail are relatively natural - we've been using tools to hit things for years - but nowadays many experts use a nail gun. It may not be natural but it can sure increase the rate at which someone works.

Marking menus, pictured below, are a great example of the novice (a) to expert (b) transition in software user interfaces. Looking at the expert workflow on the right, the pattern to buy fruit and vegetables looks more like Egyptian Hieroglyphics than a natural expression of grocery shopping in the real world but it is highly efficient. 

Marking Menus Autodesk Research

Summary: Effective user interface technologies are not emulations of the real world

Being able to separate perception from reality is one of the most important things one needs to be able to do when looking at and working with technology. This doesn't mean that a piece of technology only gets one chance. Over time, problems may be resolved and the technology may live up to it's promise. Dr. Kurtenbach expects that he will be proven wrong at some point on the above myths.

Dr. Kurtenbach encourages user interface designers and researchers to invent an exciting future while remembering:

  • Human skills and the ability to learn are powerful and deep
  • Place the human at the centre of design
  • To be a keen observer of the details and the trade-offs
  • Ask and discover what has changed

If you liked this post, please share it with your friends and colleagues using the buttons below.


Magic at CHI 2015 (or how to hide your mobile device addiction)

Many people are addicted to their mobile devices and the constant flow of information. In social settings, such as work meetings, people know it's wrong and try to hide their device checking in many ways, including:

  • going to the bathroom
  • faking migraine headaches
  • hiding the device under a table or their clothing

Autodesk Research Deceptive Devices

The User Interface group at Autodesk Research conducted a survey of more than 200 people and 94% reported getting caught using a mobile device. Helping people to sneak a peak more easily seemed like a good challenge and the team looked towards magicians to see if they could learn things that could be applied to software and device design.

The team came up with some pretty cool gadgets including:

  • spyglasses
  • secret recorders that could play back the last few seconds of a meeting through a small earpiece to cover up that you weren't paying attention
  • a sensor for knowing when people are behind you
  • information embedded in audio tones that could be perceived as meeting reminders, email notifications or a ringing phone

The Phoney Phone

The Phoney Phone is an app that makes ones' phone look likes it's sleeping while letting the user see the results of their tapping on an alternate screen that could be hidden in the bottom of a coffee cup. To an observer, they may just look like they are fidgeting or contemplating the last sip of a drink.

Autodesk Research Phoney Phone

The Magput

The Magput hides sensors in a pencil and a notebook. What may appear to be random tapping or doodling could actually be be some serious work.

Autodesk Research Magput

You can see these gadgets in action and test how easy they are to tell when someone is using them in the following short video clip.

What does a Designer of Deceptive Devices Need to Know?

When designing for subtle interactions, designers should consider many of the same things magicians do:

  • User Customization: allow the user to customize their device. If they use a device that does not fit their environment or personality it could give them away
  • Modularity: allow the user to work with the system in pieces. Could a component of the system change location so that the user is not seen doing repetitive tasks?
  • Simulation and Dissimulation: Take advantage of existing devices that people obviously use. We know how most people type on a phone so if you can hide the interaction it, or make it appear inactive to observers, they will be less likely to suspect activity.
  • Separating Cause and Effect: Magicians introduce delays to misdirect the audience. This is counter-intuitive to traditional UI design so it requires special consideration.
  • User Training: Magicians practice and so should your users - so make it easy for them.

To take this magic further, Tovi covering for Fraser who was getting married at the time (congrats, Fraser!), added a magician to the presentation of this research at CHI 2015. The show is below.

Additional Uses for Subtle Interactions

Beyond helping people to sneak a peak at their devices, these techniques could be used to:

  • enhance presentations by giving presenters extra techniques to share their information in engaging ways
  • help with wearable device design and interactions where users cannot use a device in a traditional manner

For more details on the research and how some of these devices were made and controlled, please refer to the publication entitled Supporting Subtlety with Deceptive Devices and Illusory Interactions.


Toronto's Civic Design Camp - The Keynotes

Toronto, and Canada's, first Civic Design Camp was held on Friday, June 26 bringing together designers, public servants, and civic innovators to harness the power of design to create better citizen experiences and tackle public challenges. Autodesk Research participated to learn and help people imagine, design and create a better world.

Civic Design Camp

Toronto's Civic Design Camp was hosted at MaRS by Joeri van den Steenhoven of the MaRS Solution Lab (MSL). MSL is currently collaborating on four challenges with citizens, government, foundations, corporations, and NGOs:

  • Future of Health
  • Future of Food
  • Future of Work and Learning
  • Future of Government

Joeri kicked off the day and introduced three great speakers on design challenges, approaches and obligations towards improving citizen involvement for creating a better world:

Nigel explained that New Urban Mechanics is the R+D lab for the Mayor of Boston. They cast a wide net for ideas, try them out as quickly and cheaply as possible and embrace failure as success - if they're not failing, they're not trying enough new and different things - failure leads to innovation.

Cdc1
Nigel talked about a bunch of the projects they had worked on. One of the coolest being the mobile city hall; a truck that can drive around to different neighbourhoods offering many of the city services like access to marriage and pet licenses.

Cdc2

Katie Verigen summed up Nigel's three main points with respect to citizens and governement working together in her sketchnotes as:

  1. Good design makes people like you
  2. Good design encourages real conversations
  3. Good design is about learning

Cdc3Next up was Jess McMullin talking about Big Picture Design and the interconnectedness of systems, strategy, policy and delivery caught in a rising storm of complexity. His first example was of water pipes breaking in a hospital in Edmonton. Getting this fixed seems like an easy thing to do but factor in the oil-based economy and current low prices and it becomes more complicated. Things that seem easy, can result in problems if you don't keep the big picture in mind when designing - a couple other examples:

  • Florida's butterfly ballot that confused and disappointed voters
  • Presto transit cards and the complications for setting up payments

Cdc5

Going further, Jess talked about Healthcare.Gov placing one big bet on 80 contractors versus breaking the challenge down into chunks and making some smaller, less risky bets. Their focus on the interface lost out to cultural issues.

In looking at the big picture, spend time up front where the cost of changes is low.

Cdc4

As a positive example, he used the California State Tax Ready Return that does your taxes for you. It sends you the statement and if you agree, you just pay what it says. This is easy fir tax payers and easier for the government to collect - everybody's happy (at least relatively).

The third and final keynote speaker was Dana Chisnell, co-founder of the Center for Civic Design. Dana had a number of great points for civic designers to consider when engaging with government:

  • Government wants technology but needs design: this doesn't mean that designers should charge in thinking they will save the day. They should bring their skills in gently and help to train public servants in good design practice. They should be patient and solve one problem at a time 
  • Government is filled with designers but they don't have design in their job title or description: Like any designer, these people take charge, they solve problems with passion and ingenuity.

 And perhaps Dana's most important note on design: focus on problems!

Cdc6

In an upcoming post we'll talk about the Civic Design Camp Unconference, design challenges and solutions - see you soon! 

You can see more about the Civic Design Camp from Amanada Judd on Storify:


A Thesis on Design in Comic Book Form

Have you ever read a Ph.D. thesis in the form of a comic book? Now you can thanks to the creative mind of Rubaiat Habib. Rubaiat created the interactive illustration and animation tools Draco and Kitty with his colleagues from the Autodesk Research UI Group. In his thesis, Rubaiat discusses Designing New Digital Art Media through the non-traditional format of a comic book.

In this comic, Rubaiat gets into his motivation and process for creating such tools and offers inspiration for all researchers, UX designers and software developers. Beyond that, it's a great read and you can have a taste of it below!

Rub_1

Rub_2

Rub_3

 

Rub_4 Rub_5


Autodesk Research at CHI 2015

The CHI conference showcases the very best advances in computer science, cognitive psychology, design, social science, human factors, artificial intelligence, graphics, visualization, multi-media design and more is approaching with Autodesk participating both as a proud sponsor and presenter. The theme for CHI 2015 is "Crossings": crossing borders, crossing boundaries, crossing disciplines, crossing people and technology, crossing past and future, crossing physical and digital, crossing art and science, … crossing you and me.

This year Autodesk Research has three papers receiving Honorable Mentions (the top 5% of all submissions):

Supporting Subtlety with Deceptive Devices and Illusory Interactions

Fraser AndersonTovi Grossman, Daniel Wigdor (Department of Computer Science, University of Toronto) and George Fitzmaurice look at ways to conceal your usage of mobile devices and stay connected without offending your co-workers.

DeceptiveDevices

Room: 402, Date: Tuesday, April 21, 2015, Time: 14:30 - 15:50

Tactum: A Skin-Centric Approach to Digital Design and Fabrication

Madeline Gannon (Carnegie Mellon University, Pittsburgh), Tovi Grossman and George Fitzmaurice look at skin based input through augmented reality for new design possibilities.

TACTUM – Tactile Augmented Reality (Teaser) from Madeline Gannon on Vimeo.

Room: 401, Date: Tuesday, April 21, 2015, Time: 16:30 - 17:50

Dynamic Opacity Optimization for Scatter Plots

Justin Matejka, Fraser Anderson, and George Fitzmaurice explore opacity-scaling for scatter plots to make them more useful and readable. 

ScatterPlots

Room: E6, Date: Wednesday, April 22, 2015, Time: 11:30 - 12:50

In addition to these exciting subjects, the team will also present:

Your Paper is Dead! Bringing Life to Research Articles with Animated Figures

Tovi Grossman, Fanny Chevalier (Inria, France) and Rubaiat Habib Kazi discuss how scientific knowledge can benefit from moving images in publications. 

Room: 308, Date: Monday, April 20, 2015, Time: 16:30 - 17:50

Panel: Transfer of HCI Research Innovations

There has been a longstanding concern within HCI that even though we are accumulating great innovations in the field, we rarely see these innovations develop into products. Our panel brings together HCI researchers from academia and industry who have been directly involved in technology transfer of one or more HCI innovations. They will share their experiences around what it takes to transition an HCI innovation from the lab to the market, including issues around time commitment, funding, resources, and business expertise. More importantly, our panelists will discuss and debate the tensions that we (researchers) face in choosing design and evaluation methods that help us make an HCI research contribution versus what actually matters when we go to market.

Panelists:
  • Parmit K Chilana, Management Sciences, University of Waterloo, Waterloo, Canada
  • Mary P Czerwinski, Microsoft Research, Redmond, United States
  • Tovi Grossman, Autodesk Research, Toronto, Canada
  • Chris Harrison, Human-Computer Interaction Institute, Carnegie Mellon University, Pittsburgh, United States
  • Ranjitha Kumar, Computer Science, University of Illinois at Urbana-Champaign, Champaign, United States
  • Patrick Baudisch, Hasso Plattner Institute, Potsdam, Germany
  • Shumin Zhai, Research @ Google, Mountain View, United States
 

Room: 307, Date: Monday, April 20, 2015, Time: 11:30 - 12:50

It looks like an exciting conference - If you're at CHI, please say hello to the team!


Hacking a Multi-touch Tabletop for Design Collaboration

Multi-touch tabletop computers are useful tools and the User Interface group at Autodesk Research has explored ideas on ways to make them even better with a system called Medusa. Imagine a world where the tabletop can recognize multiple users, differentiate between right and left hands and support non-touch, virtual reality type gestures like in the sc-fi movie Minority Report.

Medusa Autodesk Research Multi-touch user interface

It all starts by hacking a Microsoft Surface with 138 proximity sensors and Phidget Interface Kits. These sensors extend the touch capabilities of the computer surface to determine user proximity and the location of their hands. The sensors ane not only inexpensive but they remove complications like setting up cameras or requiring users to wear gloves or tracking markers. In a future incarnation, these sensors could be built into the table for a better aesthetic and to prevent the users from needing to worry about them.

Medusa Autodesk Research Microsoft Surface Tabletop Multitouch
Medusa'a sensors are arranged in three rings. An outward-facing ring of 34 sensors is mounted beneath the lip. Two upward facing rings atop the table are made-up of 46 sensors on the outer ring and 58 sensors on the inner ring.

All of this adds up to allow Medusa to support the following user interactions:

  • User Position Tracking
  • User Differentiation
  • Independent Left and Right Hand Tracking 
  • Hand Gestures (Pre-Touch Functionality) 
  • Touch + Depth Gestures

This was tested with a prototype UI creation application called Proxi-Sketch. Proxi-sketch allows users to collaboratively develop new graphical user interfaces. You can see it all in action in the following video. If you want to know more about building the system or how parts of it worked, please refer to the Medusa publication.  


PDF Documents are Better with Animation

We've had books with pictures in them for hundreds of years. With modern computing powers we can move from static pictures in our PDF documents to dynamic animations and tell a more compelling and understandable story like in this Project Draco example (you may need to download it to see the animation in action and use Adobe Reader X or newer).

As we can see in the video above, there are things to consider when authoring a document with animated figures:

  • readers should not be burdened with complex UI controls
  • readers should not be distracted by the animation when reading text. 

Of course there are other things to consider when creating animated figures:

  • Duration: just like with a static figure, keep the animated figure short and concise
  • File Size: keeping the animations short will reduce file size
  • Number of Animated Figures: use them sparingly but where important to communicate
  • Audio: sound can be included but can be very distracting so use only if necessary

In a work of entertainment, like a comic book, publishers may be more free with including animations. When publishing an academic paper or instructional document, beyond showing an animation, here are some of the best places to use an animated figure:

  • Demonstrating How an Interaction Technique Works
  • Illustrating Cause and Effect
  • Contrasting Visual Differences 
  • Visualizing How an Algorithm Works

You can read more about this research and follow our instructions if you want to try it out. Happy publishing! 

 


Good User Experience Helps Net Promoter Score

Do you ever have trouble making the case to improve the user experience of your product? Erin Bradner from the Design Research group at Autodesk has found that user experience can impact Net Promoter Score by up to 40%.

Good UX Meand Good NPS Autodesk Research

Net Promoter Score (NPS) is a way to measure customer satisfaction with a single question: How likely are you to recommend our product or service?  

To calculate the Net Promoter Score, we:

  1. Asked customers if they'd recommend our product using a scale from 0 to 10 where 10 means extremely likely and 0 means extremely unlikely.
  2. Segmented the responses into three buckets:
    • Promoters: Responses from 9-10
    • Passives: Responses from 7-8
    • Detractors: Responses from 0 to 6
  3. Calculate the percent of promoters and percent of detractors.
  4. Subtracted the percent of detractors from the percent of promoter responses to get the Net Promoter Score.

We had 40% more customers promoting than detracting our product which is above the average Consumer Software Industry average Net Promoter Score of 21%. That's a good thing but we wanted to understand why. We followed up the likelihood to recommend question with questions on overall product quality, product value and product ease-of-use. 

With this follow-up, the team looked at how a new feature contributed and compared to the other aspects of the NPS, including its discoverability, relevance and ease of use. It was assumed that Product Support and Product Value were the main drivers of a positive NPS. The data, as you can see below, showed that User Experience was an even bigger contributor. Analysing a similar a similar dataset showed even better results of User Experience contributing 40% to a positive NPS.  

Contribution of UX to Likelihood to Recommend Autodesk Research

 

This is good news for User Experience designers and the product team at large to help prioritize their efforts.

"The Net Promoter model had provided us with a way to define and prioritize investment in user experience design and had given us a way to track the return of that investment year-over-year."

While studying NPS, the team looked a little deeper to see how many recommendations were required to acquire a new customer.

Referrals Needed to Acquire a New Customer Autodesk Research

"Since we knew the average sales price of our product, we were able to estimate the revenue gains associated with improving the user experience of our software. We quantified the value of a good user experience. By tying user experience to customer acquisition, we are able to prioritize design investment in ease-of-use and in research to improve the user experience of our products."

 


Easy Animation for Storyboarding with Draco

The Maya team has a short animation in the works called Hyperspace Madness and we asked Matthew Chan, one of the project artists, to try Draco, our tool for sketch based animation and effects, to see what he thought of it for storyboarding and animatics. Hyperspace Madness started as a project to demonstrate games workflows. As that was successful, the team decided to make a short intro movie for the game to demonstrate film workflows.

Autodesk Hyperspace Madness

Normally a storyboard is created and used to sequence the shots in a film. When that is done, the storyboard is put into a short film with some basic sound to get a feel for the pacing. You can see the Hyperspace Madness animatic below.

In the first few seconds of the animatic you can see the hero moving through the scene with lasers and explosions behind him. Each of these images needs to be drawn one at a time. Where Draco was found to be really helpful was that fewer drawings needed to be created and was was created was a more accurate representation of the story intention as you can see in a few drawings below.

HSM_kitty

Beyond saving the artist time and helping to tell the story, this resulted in less data to manage. Matthew said the Draco was intuitive and uncomplicated and he really liked the gesture based options for easily moving the different picture elements.

We're still working on Draco and will keep you updated on the progress. In case you missed the picture from Autodesk University, here it is again.

Autodesk Research Draco Autodesk University


Research at Autodesk University 2014

Autodesk Research will be at Autodesk University 2014 and the theme this year is the Future of How Things are Made.

01b6451[1]

The Research team will be displaying some of their work and views on the future in the Exhibit Hall and you are cordially invited to come by, have a look, be inspired and share your feedback.

Autodesk Research at Autodesk University 2014

In the Exhibit Hall, you'll find people and displays for the following projects:

  • Cyborg
  • Draco and Kitty
  • Dreamcatcher
  • Hy-Fi

Cyborg

Autodesk is researching how design tools can be applied to synthetic biology, problems like fighting diseases, such as cancer, and improving drug discovery. 

Draco and Kitty

Answering the challenge to make animation (Draco) and authoring interactive content (Kitty) as easy as drawing, you not only see this in action but try out it out for yourself.

Dreamcatcher

Showing that computers can help you design - not just produce design documentation - structurally sound and interesting pieces based on your specified goals.  

Hy-Fi

If you missed Hy-Fi on display at New York's MoMA, you can get a little taste of it at AU. Haven't heard of Hy-Fi or its creators The Living? Check out this video showing Hy-Fi and some of what The Living are doing. 

The Autodesk University Exhibit Hall will be open at the following times:

  • Tuesday, December 2: 6:30 p.m. - 9:30 p.m. for the Community Reception
  • Wednesday, December 3: 11:30 a.m. - 3:00 p.m.
  • Wednesday, December 3:  6:30 p.m. - 9:30 p.m. for the AUGI Reception
  • Thursday, December 4: 11:30 a.m. - 3:00 p.m.

Beyond the Exhibit Hall, there will be a number of presentations from Research team members:

Design Computation Symposium (AB7537)

The Design Computation Symposium will explore how advanced firms are bridging the gap between Computational Design and Building Information Modeling. Speaker topics will include both pragmatic aspects of digital design in daily practice, and forward thinking ideas and research. There are three main areas of interest under this theme:

  • Performance-based design, simulation and analysis.
  • Digital fabrication and construction processes.
  • Data Flow between real and digital environments.

The Future of Design: 3 Case Studies (LF8217)

Three experts from the Office of the CTO will talk about some unbelievable developments in the fields of synthetic biology, advanced MFG design, and infinite computing.

Capitalize on Fusion 360 for Digital Fabrication Workflows in Revit  (AB6016-L)

Would you like to get your designs out of the screen and into your hands? While 3D printing has become an exceedingly useful tool for demonstrating and prototyping design ideas, preparing files for 3D printing can be frustrating and time consuming. In this 90-minute course we will generate a complex surface in the Fusion 360 3D CAD design app that takes advantage of the T-Splines modeling technology. We will bring this model into Revit software where it will serve as the base for a panelized solid form using the Dynamo visual programming language extension. Once we have generated the complex parametric model to the required specifications, we will export the model to a STL file for 3D printing. A 2-step process of healing the mesh for optimal printing is described with the meshmixer tool and Project Miller. Finally, we will inspect the mesh and prepare it for output to various 3D printing platforms.