Mobile first

Losing 80% of your screen space forces you to focus. You need to make sure that what stays on the screen is the most important set of features for your customers and your business. There simply isn’t room for any interface debris or content of questionable value. You need to know what matters most.

Luke Wroblewski: Mobile First

Advertisements

Responsive design

Responsive design (in the most “purist” sense of the term, that insists that the identically same functionality and content will be available on all devices) solves the capacity problem by chopping up the site into cells on a fluid grid and rearranging those cells on the smaller screen in a way that takes into account the relative priorities of the cells. Basically, it delivers the same content piece by piece through a narrower communication channel. As a result, all the content is available on smaller screens.

RALUCA BUDIU: http://www.nngroup.com/articles/scaling-user-interfaces/

Designing with context

Great article by Cennydd Bowles describing the seven flavours of context:

Device context

  • What devices will this product be used on?
  • How about in a year’s time? Three? Five?
  • What can those devices do? What can’t they do?
  • What sort of interactions do these devices suit?
  • Are there unique device capabilities we can use to our advantage?
  • How does our site work on devices that don’t have those capabilities?
  • Are there device capabilities that might make life more difficult? How can we mitigate their impacts?

Environmental context

  • Will the site be used indoors or outdoors?
  • Should weather conditions affect my design?
  • What environmental information sources are relevant to the interaction?
  • Will a user understand why, and how, my system is adapting to the environment?
  • How can I make my product feel natural within its environment?

Activity context

  • Do users have simple tasks to fulfil, or a more complex network of activities?
  • Are these activities or tasks digital, or do they support real-world activities?
  • Does the current activity have a physical component? How can we support that?
  • Are the interactions likely to be lean-forward, lean-back, or both?

Individual context

  • Can we use any stated preferences to tailor the system to an individual user?
  • Is it appropriate to let users explicitly state preferences for this interaction?
  • What sort of emotional connection will users have with our site, and the devices they access it from?
  • What mental attitudes do users bring to the interaction?

Location context

  • Do users have location-specific needs?
  • Will access to the user’s location improve the service my app can offer?
  • How can I best communicate why a user should grant location access?
  • Can I present location information in a more human-friendly format than long/lat?
  • How can I be sure my location assumptions are accurate?

Social context

  • Will the app be used in solo, private contexts, or in public?
  • Are there ways to reduce any risk of embarrassment or public discomfort for the user?
  • Who else is involved in this activity other than the end user?
  • Is there benefit in asking the user to authorise my app with their social networks?
  • Does my app protect the user’s sensitive information with sufficient care?

—————-

Context design principles

  • Context is multi-faceted.
  • Don’t penalise people for their contexts.
  • Assume gently.
  • Allow adaptability.
  • Revisit your decisions.

Designing for multiple devices

What determines the right user experience for a platform/device?

  • User posture: Stationary, Lean back, on-the-go, shared
  • Input capabilities: pointer/keyboard, LRUD/OSK, Gesture/OSK
  • Navigation style: controls & windows, panes
  • Display capabilities: Hi-Res, near, far away, small, medium, large

Design principles (fundamental, universal ideas that underpin good design) stay the same but the application of principles varies across input, posture, navigation, and display.

Design for mobile first when thinking about multiple platforms as it holds the most constraints. This helps you focus.

Luke Wroblewski