Web or native? A quandary of our design

A Street Fighter themed evening of web technology chat? It was an easy decision to get along to the latest in a line of design-related events in Brighton.

With it’s Street Fighter pseudonyms and team colour (QR-coded) cupcakes, Brighton’s first Geek Ninja Battle Night aimed to add a competitive edge to the lively mobile development debate, driven in recent month’s by the growing excitement around responsive design and the encouragement for a mentality shift towards a single, device agnostic web experience.

The impressive lineup – considering the modest ticket price – saw Andy Clarke and Remy Sharp ‘battle’ Sarah Parmenter and organiser Aral Balkan, fighting their corner in favor of web or native development technology respectively. Asked to choose my team upon entry to the venue, I opted to support team web, expecting to leave with my HTML, CSS and Javascript bias further bolstered by the end of the evening.

Gameboys and technology ghettos

First to present in favor of web technology for mobile development was Brighton’s biggest fan, Andy Clarke. Rather than echo his ongoing advocacy of the latest front-end technologies to build mobile suitable experiences for the web, Andy chose to focus on the legacy of technology ghettos we are at risk of creating through device specific development.

Recounting a recent experience viewing websites built over ten years ago (using HTML and CSS) without the need to update code or hunt for a long retired device, Andy revealed an original Gameboy and his favourite game – Mortal Kombat II – to punctuate the point. The native code and physical cartridges around which the games were built are incompatible with anything other than the console they were developed for. Similarly, applications built specifically for iOS devices today are incompatible with Android or Windows Phone 7 platforms; the likes of iPhone and iPad are at risk of becoming the next generation of Gameboy, collecting dust as they struggle in the compatibility stakes.

Although occasionally distracted by the 8-bit bouts of Mortal Kombat projected behind Andy during his talk, It was easy to share his sentiment that we are in danger of returning to the ‘best viewing in’ footnotes of our online past. Really, these are lessons we should all have learned from by now.

Remy Sharp built upon this argument while countering the view that HTML/CSS/JS built apps cannot compete with the slick user experience available to those developing in, for example, Cocoa/Objective-C. Sharing some fascinating discoveries he made while looking under the hood of Google’s Gmail, Remy shared how some clever Javascript and (less clever) browser sniffing could deliver the best experience across all devices without compromising user experience. Can’t live without smooth scrolling or pinch/zoom? Remy demonstrated clever plug-ins that recreate the gestures of native applications using web technologies, techniques that will provide a even more convincing experience as future browser iterations take advantage of WebGL to boost performance.

Style over semantics

Hoping to counter the device agnostic/web standards love-in was Sarah Parmenter, a user interface designer specialising in iOS development. Her argument in favour of developing native applications is dominated by the belief that current web technologies, although able to deliver high quality graphics and animations with CSS alone, cannot come close to replicating the instant feedback, smooth transitions and visual gloss of native controls for iPhone or iPad.

Comparing examples of an ecommerce tool she is producing in partnership with Andy Clarke, Sarah demonstrated how she was able to replicate Andy’s web-based layout with ease, while adding touches of interaction and pixel perfection not so rapidly achievable with HTML and CSS. Although the talk too often focused on Sarah and Andy’s negative personal experiences while working with the client involved in the project, Sarah put forward a thoughtful case for device specific development, citing the more focused design philosophy she can adopt because of the limitations of a set canvas.

This argument is given a little more gravity when we consider the difference in experience using a mobile touch screen device versus a desktop with monitor and mouse. Whereas links, buttons and content – even at a very narrow browser size – can share the same visual scale of potentially larger views on a desktop monitor, iPhone demands larger hit areas and spacing to allow for reduced accuracy when using a finger for interaction. A decision needs to be made when we design for a narrow view-port using a technology such as media queries. Do we design narrow layouts specifically for mobile interaction? In doing so, do we degrade the desktop experience at the same dimensions by adopting a visual language familiar specifically to smartphone users? As with a much of our decision making when designing for the web, context – supported by research and evidence – is key.

Having come from a web-based background, Sarah clearly understands that there is a scale of relevance to consider when making the decision to develop using web or native tech which usually hinges upon the visual complexity of the experience. However, the argument that eye-candy should be the deciding factor is difficult to defend when reminded of Andy Clarke’s Ghetto analogy; no matter how attractive the experience, tools developed for a specific device have a use-by date from the moment of release. Like the bad old days when each shift in acceptable screen resolution meant iteratively widening websites was commonplace, so the release of newer devices with physically larger or higher resolution screens will mean revisiting and redesigning applications, while leaving users of older devices to languish.

The evening wrapped up with Aral Balkan arguing convincingly that while attempting to ape native applications using web technology, we sell our users short. Consumers have developed certain expectations from downloadable ‘Apps’, mainly surrounding gestures and performance that current web technologies cannot reliably recreate. However, this unnecessary expectation is possibly a by-product of our own long-term shortcomings as web designers and developers.

Until Aral’s talk I was still firmly fighting the web corner, unconvinced of the benefit native development has over the device agnostic use of modern web standards. However, after considering Aral’s talk and the on-stage debate which followed, it is possible that the conflict between web technology and native tools is driven by two distinct mindsets – the consumers distinction between a piece of software and a website, and our aged ‘mobile last’ development cycles.

During the debate, Andy Clarke argued that anything we consume in a browser is a website.

Amazon? A website.

Facebook? A website.

Gmail? A website. Or a web application?

Remy Sharp commented that although we could technically define anything viewed in the browser as website, in practice we see web-based productivity tools as web ‘apps’, and content driven experiences as websites. Perhaps this is where the expectation that web technology is capable of delivering software has been defined, during the shift from applications delivered on a DVD and installed on a single machine, to web-based computing referred to as web apps.

Software, or app?

Although software has moved online, we still have applications on our desktop machines that are beyond the capabilities of HTML, CSS and Javascript, so why not the same acceptance with mobile? If Apple had chosen to refer to single-download, locally installed and offline-capable mobile applications as software rather than choosing a term commonly associated with productivity tools delivered in the browser, would we be able to more easily justify native development practice? Alternatively, when a simple mobile app is delivering content from the web and copying familiar interactions we undertake within a browser, the app is nothing more than a bookmark. Why would a user rather navigate the App Store, contend with regular (and intrusive) updates when the same experience is possible with a simple bookmark in Safari?

Mobile users are choosing to undertake simple tasks through dedicated native applications because the web has been letting them down for so long. Only now are we starting to seriously consider the mobile user when developing experiences for the browser, but it’s too late. Instead of checking a website will scale for their device, the App Store beckons. The worrying popularity of apps which do little more than deliver familiar web-style interactions and content in a more usable way is of our own making.

The solution? Obvious though it seems, we need to act now to make our new online experiences mobile friendly from day one, avoiding the need for users to browse the App Store for a better solution. The only way to effectively deliver this is to design for small screen first, not from the desktop down – this is the mindset that has only hampered the web on mobile devices for so many years. As Andy Clarke echoed at the end of an enlightening evening, this shift in workflow requires a calibre of web designer we have yet to see, but desperately need. Responsive design encompasses more than retrospectively applying media queries to our full-fat desktop experience, it requires a fresh mindset and an uncomfortable leap outside of our comfort zone.

For most of us – including this designer – that uncomfortable and exciting shift needs to happen today, or we all risk becoming as out-of-date as Andy Clarke’s Gameboy.

Photo by Ryan Quintal on Unsplash