Chapter 6: Hands-On Design For Mobile By Dennis Kardys(@dkardys) in the recently released “The Mobile Book”, by Smashing Magazine. Reflection by Kyle Keeling
Hands-On Design For Mobile starts off by throwing the reader for a loop, suggesting that we don’t truly understand mobile, that is it impossible to define and that there are too many assumptions being made about what mobile really means. I found this a hard pill to swallow, especially since I am reading The Mobile Book to better understand and articulate the true meaning of mobile. I felt his argument was paramount to saying “So you have a watch and think you know how to tell time? Well you don’t, because time doesn’t really exist!” It came off as a little existential and design preachy, but as the chapter continues he strays from defining what mobile is and enlightens the reader with suggestions and methods for approaching multi-device projects.
Most people reading The Mobile Book will agree that the conventional assembly line approach for a web project is not the most effective way to design and develop for the multi-device landscape we currently live in. That being said, diverging from a conventional approach needs to be justified and the benefits defined, otherwise clients will not want to take the risk. As Kardys points out, it is hard to break conventional design workflows because clients have certain expectations and when these expectations are met they provide assurance that the project is progressing as it should.
To help us on our quest to change the mold, Kardys offers some fantastic ideas about how to turn the conventional design approach on its head. He identifies that the assembly line approach, where a static design is established upfront and then passed along, thwarts a projects ability to be flexible and make necessary adjustments. Since we are developing for a plethora of screen sizes, a static design upfront establishes a false expectation of the end product. Much like an interior designer doesn’t paint a room three times to show a client what the end result could look like, web design has reached a point where creating static designs of every possible screen size just isn’t cost effective. Instead we should embrace style guides, templates, and content reference wireframes which establish a flexible framework on which to build upon. This approach permits flexibility so that changes can be made as needed instead of being restricted by an original design.
In order to better understand a non-sequential workflow, Kardys explores a few real-world examples from his own experience. One of my favorites is the “Stick Figure Comic Strip” which is to be used during the ideation stage. By creating a crude story-line of how the user might engage with our website we focus on the end user upfront rather than design assumptions. This approach forces us to consider where the user’s story begins (a coffeeshop?), what motivates the user to visit the website (an email? a friend’s suggestion?), what action the user takes when they get there, and what device(s) are they using. Considering how and why a user may engage with our site or app helps to put us in the right mindset so that we can consider the behavior before the design.
In addition to a few other ideation approaches, Kardys goes on to recommend diving into prototyping as soon as possible. Whether that is Paper or HTML prototyping (or both), the poison is yours to choose depending on the project and your preference. In the end, “the goal of prototyping is to convince yourself and others of an idea” (Aza Raskin). Prototyping fosters a better understanding of the behavior independent of the style. It becomes easier to identify issues and make changes based on tangible experience; otherwise, feedback will be based on how we think users will act.
The concepts that are proposed throughout this chapter are very inspiring and should motivate us to implement these processes in future projects, if you are not already. That being said, changing conventional ways comes with resistance; especially from those paying the bills. Kardys suggests that “by promising the client more collaboration, more active involvement in the process and a proto-type-based approach to design, we alleviate many of the fears that weigh on the minds of the project’s team members”. He identifies that pitching a new approach needs to be handled with care and as long as we highlight the benefit the client and end user will get by taking a non-sequential iterative approach it should not be hard to implement.
Workflow Guideline Tables
Workflow Table – Part I, Dennis Kardys
Workflow Table – Part II, Dennis Kardys
More Resources
- UX Sketching and Wireframe Templates for Mobile – Smashing Magazine
- Style Tiles, Samantha Warren