D8MUX Initiative - Drupal Eight Mobile User Experience

LewisNyman's picture

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.

Heuristics

We should up with a list of objectives and a context which we analyse against. Not just which devices we test with but how we define a good user experience on a device, these could differ from a desktop experience or be defined differently.

eg:

  • Speed
  • Touch Friendly
  • Tab Friendly
  • Contrast
  • Navigation
  • Flexibility
  • Readability

Analysis

Assignment of user paths to analyse, devices and context become important here, as we are limited by the diversity of the volunteers!

This would be where we outline any global or specific experience problems with Drupal's back end.

Potential user stories

Mobile Verity

What Verity Wants: to be able to complete her website updates quickly, without getting confused, and feeling confident that she’s knows where she is and what she’s doing at all times.

  • Logging in
  • Finding Content
  • Editing Content
  • Creating Content
  • Dashboard

Mobile Jeremy

What Jeremy Wants: the ability to build sites with rich functionality and flexibility without have to write code.

  • Installation (Wouldn't that be great?)
  • Content Type Creation
  • Permissions
  • User Administration
  • Blocks

Test Systems

This is a hopeful rather then concrete list

  • iOS
  • Symbian Platform
  • BlackBerry OS
  • Android
  • Windows Mobile
  • webOS
  • bada
  • Maemo
  • MeeGo
  • Mobile Opera

Test Resolutions

Only local images are allowed.

Scope

Some problems might be solvable within the 'Seven' theme, some might require a completely seperate 'Mobile Seven' theme and be better suited to a contrib project. There is only so far we can take core.

Resources

Comments

Good initiative, something we

Jeff Burnz's picture

Good initiative, something we most definitely need to be looking at closely and working on. I'd love to discuss this more with you with regards to Seven and the new theme initiative for Drupal 8 core. Awesome man.

Essential

yoroy's picture

Are you looking to improve the Drupal mobile UX in general or do you have some specific use cases in mind? Scope could be set to focus on content editor workflows for example. Are you looking to build a theme mostly or do you have an install profile / targetted application in mind?

Lets work on this.

...

Jeff Burnz's picture

Actually this was literally my first response when thinking about a mobile design for Seven - in particular content editor workflow. After some time to consider this I think it could be a mistake and instead work on making shortcuts work really well, so instead of assuming a scope or area to focus on we provide the same great tool for users to scope their own workflow. The main reason is that right now we have no clear idea of how mobile devices will evolve in terms of size, features and usage over the coming years.

What we do know is there is likely to be small screens around for quite some time and that people are not going to evolve bionic eyesight, so we do need to design for the small screen because currently Seven is a completely broken mobile experience - this is critically important to fix (and be back-ported to D7 as contrib).

I would very much be in favour of us not making any assumptions about what the usage might be and simply ensure that all normal admin features work in small screens and on popular mobile browsers and platforms and that they are optimized for mobile users (for example bigger fonts, adaptive layouts etc).

Thanks for the pointers and

LewisNyman's picture

Thanks for the pointers and encouragement guys. I'm eager to start talking roadplans and such but that is only possible with some weight behind this initiative.

I've gone ahead and fleshed out some of the areas like "Potential Solutions" that are really just guess work at this stage.

I am wondering if this

Bojhan's picture

I am wondering if this initiative shouldn't start as a contrib (right now)? I mean, is there any reason we can't start working on it atm and actually understand the domain space and its complexities? I have worked on a number of mobile platform integrations now, and in terms of UX its highly platform dependent.

I am just as eager and

LewisNyman's picture

I am just as eager and anybody to wade in and start ripping "Seven" to shreads.

I'm holding back because I want take a step back and get a broad overview of what the issues are instead of starting with assumptions.

Maybe the best solution is creating a standalone Mobile/Tablet/Television/Toaster version of the "Seven" Theme. My ideal solution would be to open up the Seven theme to multi device responsiveness a.k.a "One Web".

It's just too early to tell, we need to do some broad cross device testing before we start working on a solution.

Platform dependency may well

kat3_drx's picture

Platform dependency may well be an issue; starting a contrib for this (and possibly one for tablet-specific UX?) would be helpful, IMO.

REPLY

trish55's picture

NICE POST !!!! THANKS FOR SHARING!!!!

For Reference

nicoz's picture

The Omega Theme and tools have made good headway on this for a base theme. It would be worth a look at how himerus has implemented this. http://drupal.org/project/omega and http://groups.drupal.org/node/137424

devices

dshults's picture

Here's a helpful article regarding platform dependencies and mobile. IMHO, a responsive solution may work best to create a mobile first, device agnostic solution. Always happy to pitch in...

http://mobiforge.com/designing/story/effective-design-multiple-screen-sizes

dS

Mobile

Group organizers

Group categories

Mobile

Group notifications

This group offers an RSS feed. Or subscribe to these personalized, sitewide feeds:

Hot content this week