What is mobile first?
Mobile first. This is the new mantra for web design.
We design the smallest screen first and design the larger screens later.
Does mobile first help me position my service?
As the owner of a service, I like mobile first.
Mobile first constrains me to think clearly about the main purpose of my website.
The small screen prompts me to edit, edit and edit again until I am saying what I need to say, simply and completely.
Where can I get good examples of mobile first?
Though the mobile first mantra has become a mantra, when I google mobile design, I have found very little advice about how to think about mobile design.
Oddly, blog posts promising 50 best responsive sites, for example, immediately contradict the mobile first mantra and show the desktop layout first.
In short, much to my frustration, I haven’t found a good catalogue of examples of responsive design that is mobile first.
What advice on mobile first is out there?
The advice out there is either very generic (think about what the customer wants) or very technical about media queries, for example, or very sophisticated, such as have dummy actions to make the user think your website is more responsive than it is.
To get started on using mobile first, I am going to have to think through the principles for myself.
How does mobile first clarify my service design?
The scenario
Mobile users are probably on the go somewhere. They are unlikely to be at their desk. They don’t have a keyboard.
Not only are they away from the conveniences of their own desk, at any time their signal might fail. They are very likely to be interrupted by something going on around them, or by having to break off a task and ‘move on’, get off a train, say.
They not even all that likely to be sitting down. They may be on public transport with their bags and worldly possessions between their feet, with one hand hanging onto the overhead strap, and only one hand and a thumb to work their mobile phone.
What mobile users want and need
Clearly, the interaction between mobile users and myself must
- Obvious at a glance
- Not disturbed by noise and activity around the user
- Manageable one handed with a thumb
- Complete in itself in a very small window (a few seconds).
This list feels dull and pedestrian. It is certainly “micro”. Can I really conceptualise my interaction with a user as a matter of seconds?
Mobile interactions are small
The smallness, if not meanness, of mobile engagements, stopped me in my tracks. Has life come down to a few seconds?
Alternatively, I can ask was life ever about more than a few seconds?
What did we do before we had mobile?
If we arrived at the supermarket without a shopping list, for example, what did we do? Instead of calling home to get oyur list, we had to guess?
Before we had mobile, when we were sitting on a train, we made a plan in our head for what we would do when we left the train.
After all, we still do this when we are driving, or when we don’t have a signal.
Plus ca change – has mobile changed anything?
I am not totally convinced that mobile has changed anything.
To continue the supermarket example, we might be able to call home to get our shopping list and rectify our own confusion, but our relationship with the supermarket does not change.
The supermarket doesn’t have our goods waiting for us when we arrive. Nor, do they send us scooting around their warehouse with an efficient map like an Amazon worker. Nor, does a robot fetch our goods for us.
Our relationships with our users persist even with mobile
The relationship between user and supplier, at least in the case of the supermarket, has not changed. All that has changed is that the user can be a little more efficient.
I am going to use this insight as a heuristic and generate all the relationships we might have with a user and look where our offering of a mobile experience might allow them to be more efficient.
What do we do when we are mobile and don’t have a signal?
When we are driving or sitting on a plane without a signal, how do we think about lives and our relationships with the various people on whom we depend?
What do we want to know and what decision have are we thinking about making?
What will make us happy and feel we have achieved what we set out to achieve?
Scenario 1
I am whiling away the time and hoping for something to do to pass the time. If I don’t have an internet connection, I might pick up a free newspaper or an inflight magazine.
Scenario 2
I might feel at a loss in the setting and not want other people to see that I feel at a loose end. If I don’t have a mobile connection, I might scribble on a notepad or pretend to look seriously at the artwork on the walls.
Scenario 3
I might want to catch up with news, international or purely social, and be taking this moment because my movements precluded doing it earlier. Without a mobile connection, I might look at a newspaper for news or glance at my email or social media messages.
Scenario 4
Particularly at the beginning of the day, I might be looking for amusement and entertainment as a mood-maker to start the day with a smile. In days gone by, I would have looked for the daily cartoon.
Scenario 5
Particularly at the end of the day, I might be hoping for some inspiration or distraction to contradict a disheartening day, or recent encounter. Anything, which allows me to jump the tracks of despair, and to creatively restore hope, will do. Without rich resources, I would have depended on my imagination and memory.
Scenario 6
I might have a specific problem to solve and I am hoping that someone has put a clear solution online. For example, how do I check my foot size before buying shoes? Or, how do I think economically about mobile design? Is there someone out there who is sufficiently expert to lay out the issues clearly? Without a connection, I might be thinking about how to find out and whom to ask when I am connected to the world again.
Scenario 7
I might be looking out for a specific message from someone – on my email, twitter account, or even on a broadcast service. I am looking for something specific and I want to go to a url, log in if necessary, and get an answer to my question. Has the message come and can I relax or move to the next stage of a task?
Scenario 8
I might be hoping to make a specific action. To take a simple example, I might want to bookmark ten useful sources that I can follow up at home. At this stage, we might be tempted to mimic a website set up for desktops. It might be more helpful to think through the basic actions first. What actions? What information do I need to act and what will the action be? How do I know when I am done (or when I am half-done)? How will I remember how far I got?
Using the scenarios to gain insights
Working through the scenarios, I was struck that the first scenario and possibly, the fifth, fall into window shopping. These services might be important to regular customers of mine but probably of limited value to someone looking desultorily for distraction.
Scenarios 2, 3 and 4 provide services to clients that used to be served by mainstream media and newsletters. To the extent that we have anything useful to contribute, clients might like this service.
Scenario 6 offered a specific insight for my kind of business. Design my layout to show the questions, provide sufficient information for the user to judge whether they have found their answer, and make provision to bookmark the link in some way.
Scenario 8 turns out to be the most insightful for me. So often when we start a new task, the steps aren’t clear to us. Thinking in the micro terms of mobile helps us communicate the structure of tasks more clearly to our clients.
Scenario 7 seems to be more a matter of general services but will include messages from us.
Moving forward
I am going to begin from here. Do these insights help me visualize the small screen of mobile and what my clients would like to receive as they, for example, hang from a strap on a jolting train, and attempt to look something up one handed with only a thump free?
One Comment
