Joe Welinske of Writers UA followed Sarah O’Keefe’s presentation on Adobe Day. I was especially interested in hearing what he had to say, because the topic of his presentation was about “Multi-screen Help Authoring–How to Deal With the Explosion in Device Sizes.” Anyone who’s read this blog before knows that I’m very much into the mobile revolution, and while I’m usually talking about m-learning more specifically, mobile goes beyond learning, and using mobile in technical communications is connected to m-learning in many ways.
Joe explained that the device population keeps growing! Smartphones and desktops are changing; the sizes between smartphone and tablet devices, whether they be iOS, Windows or Android devices truly vary. The same content needs to be displayed on everything from large monitors to laptops to tablets to GPS to small phones–there are dozens of choices! How do you design a UI (user interface) for all these variations?
Joe explained that different devices have different dimensions, different operating systems, different user interfaces elements…lots of variations to contend with when creating content. He suggested that a “graceful, efficient adjustment is needed,” namely matching the amount of content and the type of content with a device without crafting solutions for each. He contended that responsive design the key as it allowed for adaptive content. Responsive design would allow flexibility for different environments.
Joe mentioned that Scott Abel has touched upon this during his presentation, but Scott later clarified for me on Twitter, by saying, “That’s one way, although I question whether it is the best way…Lesson: Adapt content first, design second. Wrong content, right design = #fail.”
Joe continued by pointing out that one way to accomplish this objective included using HTML5/CSS3, tagging all objects in source code, create device-type style sheets, and including media queries in source. The end result would be a single-source content file that looks and works well on different devices. To prove his point, Joe demonstrated how same source content looked on different devices, specifically the iPad versus iPhone in this example. Joe also showed an example of how he divides the devices by “buckets” when creating his style sheets into categories such as 10″ tablets, desktops, phones, etc. He recommended using a “parent” style sheet, then fine tuning with a device style sheet for each device type. This would help create a graceful adaptation using HTML/CSS and query to allow your content to flow automatically and intelligently. From that point going forward, a technical communicator can consider making mobile the starting point and expanding from there. Joe’s last point was that a small percentage of people from traditional technical communications are involved in mobile projects but the user experience and design skills are actually similar.
I agree with Joe that designing for mobile really does use many of the same skills as traditional design methods, but it does take a little extra time to lay out the thought process and structure needed to make the content be delivered from a single-source to multiple types of mobile devices. It’s a little tricky, but with some careful thought, it’s not really as complicated as it could be. By using single-sourcing and customizing style sheets, multiple output of content can easily be attained. I strongly agree as well that this is the mentality that people need to adopt, whether involved in technical communications or e-learning/m-learning now. I think this opened the eyes of many attendees in the room. Mobile really is an important consideration now in content output!