Basking in the light of MacBook Pro laptops, 300 plus designers and developers, mostly under the age of forty, constantly check their twitter updates and news feeds like attention deficient crack addicts forced to play solitaire. This was the scene at the Bell Harbor Convention Center.
The increased growth of web enabled mobile devices and the ongoing joke of Internet capable refrigerators has caused a disruption in how web pages and web-based applications should be designed. As of 2011 over 90% of U.S. mobile subscribers have an Internet ready phone (mobithinking) and according to Nielsen over 50% of mobile phone subscribers in the United States own a smart phone. Predictions by ABIresearch estimate that 2.1 billion HTML5 capable devices will exist by 2016.
How will designers and developers deliver easily viewable and captivating layouts for devices with screen sizes ranging from 320×480 to 1280×768 and everything in-between? Is the new expectation to serve 2 or more sets of images depending on the device resolution and the Internet connection? In order to prepare for the onslaught of new displays and the widespread adoption of HTML5, the speakers at An Event Apart had some insightful and inspiring presentations concentrated on content, emotive design, usability and future friendly ideas. Below is a description of the speakers that I found most interesting and what I took away from their presentations.
It all starts with content… or at least it’s supposed to. Presenters Jeffrey Zeldman and Karen McGrane gave engaging and oftentimes humorous presentations on the importance of content. Since the web is in a time of transition from desktop to mobile, they both point out that now is the time to concentrate on creating quality content and microcopy that is broken down into chunks tagged with metadata and displayed using semantically correct code. Using this concept, content then can be easily adapted to a wider variety of devices. McGrane sees the need for creating more intuitive content management systems, getting away from the current WYSIWYG type editors that leads to inflexible content, incorrect semantics and a lack of metadata.
Design & Emotion
Presentations by Jon Tam and Simon Collison appeared to center around the emotional aspects of design. These are the elements such as fonts, colors and layout systems that make an impression or subconscious emotional connection with the user. Font maven Jon Tam emphasized choosing fonts carefully, keeping in mind the mood to evoke while not forgetting readability. The increased adoption of the CSS @font-face rule and services such as Google fonts and Fontdeck are expanding the use of font embedding on web pages, opening up the possibility of misuse and over design. This was addressed in Simon Collison’s presentation on the philosophy of restraint, a back to the basics approach designers tend to leave behind—less is more and constraints can be good. Collison concluded “Having complete freedom is possibly the worst way to start any project”.
Another important topic at the event was user experience. Kim Goodwin spoke about the use of scenarios and personas to enhance or replace use cases. Scenarios provide a more personalized and in depth picture of how various types of users will interact with an application. Whitney Hess reinforced Goodwin’s concepts emphasizing getting away from the computer and undertaking the daunting task of talking to stakeholders face to face in order to discover hidden problems and how to fix them. Jared Spool’s wildly manic presentation on intuitive design and information architecture illustrated the importance of making sure the users current knowledge is equal to the objective that they need to complete. If the knowledge gap is large, the design is less intuitive. He ended his presentation with some tips and cautionary tales of how to avoid disastrous redesign. Spool used Amazon as an example of making small iterative changes that no one notices resulting in a phased redesign over time.
Touch screens, mobile devices, responsive grid systems and CSS3 also seemed to capture attention at the event. Ethan Marcotte the developer who coined the term “Responsive Design” at last years Event Apart, outlined his pragmatic approach of creating pages that adapt to varying screen sizes. Marcotte acknowledged some of the drawbacks to using this approach—mainly media delivery and bandwidth considerations. Which leads to Eric Meyer’s demonstration on simulating button images with CSS styles.
Eric Meyer’s hands-on approach to presenting walked the audience through the steps of creating a button that looked as if it was created in Photoshop, using only CSS styles. Meyer’s point being that these widely supported CSS rules can alleviate the need for creating image assets, reducing the amount of time spent in Photoshop and scaling without pixelating. Although these buttons were created using new CSS3 rules, a less visually complex version will still be visible in older browsers that do not support CSS3.
Luke Wroblewski’s daylong workshop on mobile first wrapped up Event Apart. He gave a knowledgeable presentation and didn’t seem to break a sweat after six hours of talking with only a lunch and a couple small breaks. Wroblewski covered a multitude of material but some the main ideas were:
- Adapting backwards (from an existing desktop design to mobile)
- Separate templates (for desktop and mobile)
- Adapting media for mobile (delivering images and video on small screens)
- Server-side or client side optimization/adaptation (some things a browser just can’t do)
- Optimizing form inputs for touch screens on mobile devices (reducing the amount of clicks and tasks the user must accomplish to fill out a mobile form)
- Responsive vs. other cross device solutions (determining what to used based on the project)
- Future friendly (forward planning)
Unfortunately the workshop gave the audience no magic bullet for making a site “Future Friendly”. However, there were helpful ideas that could lead to good cross device design. Wroblewski noted that mobile is something designers and organizations cannot ignore saying, “Mobile has to become part of digital strategy whether you like it or not. Mobile strategy should be digital strategy…”
In conclusion, all the sessions at the event were informative, full of wonderful ideas and excellent speakers. Mobile design seemed to make the audience wary and excited at the same time. Likely this is due to the new difficulties involved in designing, building and the seemingly endless array of devices arriving in the near future. Regardless of the challenges, now is an interesting time to be a designer or developer. I can’t wait to see what next year’s Event Apart will bring.