d8mux

The short story

Come and help us perfect and implement the hot new mobile interface design in Drupal 8. Try the prototype on your phone. Also, go to the issue queue.

The long story

Over the past six months we've been working on designing the experience of getting to where you want within Drupal's admin interface.

The first problem we need to solve is how users get around Drupal's interface on devices with small screens and touch screens. See the D8MUX road map.

Let's do some brainstorming and prototyping over how we get this good on mobile.

What do we need?

• Simple
• Consistent
• Finger friendly
• Complementary - The navigation can't upstage the main purpose of the page or task.

Current pain points

One page many purposes

As we found out in London, Drupal's mobile admin interface faces some big obstacles to overcome. If we want to to be able to tackle some of these problems in the next release cycle we need focus, the idea being we don't move on to the next item in till we have the previous one licked. I've whipped up proposal for our road map. This is by no means complete, there is plenty of detail to fill in.

I'm hoping we can work on it together.

Words to live by

Don't let the current interface hold us back

On the Friday of Drupalcon London we ran a Mobile Usability Testing Session on Drupal's admin interface.

View the issue spreadsheet on google docs

We had a strong turnout, with lots of enthusiasm from the testers. We managed to test the UI on the following devices:

• Nokia N900
• Sony Ericsson Xperia Arc
• HTC Sensation
• Samsung galaxy s2
• iPad 2
• iPhone 4
• iPhone 3GS
• iPhone 3G

Here are some of the thoughts I came away with after the session.

Context can mean many things, especially in Drupal. What I want to talk about is what context relates too from a device perspective.

Broadly I think this equates too:

It is device capabilities and constraints plus the fact that mobile devices are with you anywhere and everywhere.Luke Wroblewski

How does the ambiguous location of the user affect their browsing experience? Which device capabilities are going to affect how they view and use the site?

A big part of any user experience is usability. It's the first step toward an engaging and seamless experience.

There are three key areas that will be the focus of the formal mobile usability tests:

1. Navigation
2. Readability
3. User Input

Currently Drupal's admin interface fails one and two almost instantly on small and touch screens. All three need a wide range of tests before we can confidently address these issues. I'd like it if people could weigh in based on previous experience.

I'll be posting more about the usability tests soon.

We need to start thinking and talking about what approaches we're going to take in Drupal 8 with regards to design for mobile.

My own opinion is that we should probably be looking really closely at responsive design and how we might apply or adapt the patterns emerging in that field. The idea of "one web" and a unified design and user experience independent of device appeals to me. I don't want an impoverished mobile experience, so please don't assume what I want to see or do just because I'm on a tablet or handset.

I'm looking at putting together an initiative that will look into the user experience of administrating a Drupal site through a non-desktop PC.

Road Map

1. Redesigning the navigation of the admin interface on small and touch screens.
2. Heavily modifying the 'Seven' Theme to become more responsive and mobile friendly

"Mobile User" Experience

The emphasis is not on the device, but on the context of the person using it. I would almost call it 'device agnostic'. What is important is that the user is not sitting at as desk facing a big screen. They could be on the bus, sitting in a cafe or walking back from work.