CGI Interactions
A blog about interactive communications for marketers, designers and developers

Keeping the Guesswork Out of the User Interface

February 17th, 2012 . by Benjamin Robbins

A recent review by Matthew Panzarino of the iOS app Clear has brought to light the value of User Interface standards. Panzario makes the case for the UI of Clear:

“Clear takes a different tack, as its interface lacks any standard buttons and operates completely through gestures, taps or direct manipulation of the list items on the screen…Frankly it’s so different from how apps normally work and offers so little assistance to those unfamiliar with gestures that the guys at Realmac and Impending, the two studios responsible for Clear, had a tough time deciding how to introduce new users to using the app. But once a user is familiar with just the basic operation of the app, they take off like a rocket using them with ease.”

While Panzario acknowledges the learning curve, the hurdle is dismissed once familiarity has set in. Yet, this type of app-centric thinking would prove daunting if applied to your entire app ecosystem. Imagine if every app you downloaded you had to figure-out how to interact and operate it. Clear has departed from the norms of app User Interface expectations at the expense of clarity. This is done under the guise of being intuitive to a gesture-based device. Unfortunately, all it has done is turned gestures into ‘guess-tures’.

I am not advocating for slavish boring design or lack of innovation. Great design is actually very challenging. It requires presenting only the most relevant of information and task options at the right moment. As well, it should be visually engaging. But most of all, it has to be self-explanatory. If you need accompanying instructions with how to use your app – especially a mobile app – you have missed the mark. I should be able to download an app and immediately begin to use it without having to try and figure out how to make it go. This doesn’t mean there aren’t options or complexities in the app. But an app shouldn’t have the added challenge of figuring out basic operation.

Here is where Clear became unclear – while leveraging gestures is native to the device it is only one component of the UI.  Text is an essential part of the User Interface. Eliminate it and you just removed an entire dimension of the application experience. The real challenge with Clear’s approach is that they are actually handicapping themselves by eliminating one of the components. Swiping to the left in one app may mean one thing and something completely different in another. But an OK button means OK in all apps because the action of pressing it is combined with my ability to comprehend the meaning of OK. The text that is part of the User Interface is essentially a nicely self-contained user manual.

User interface standards are a slowly evolving bunch. There is practical value in having them. Not having them would mean a learning curve with each app we encounter. That is neither efficient nor productive. There is a time and a place for innovation and the introduction of new standards. The pinch/zoom of the iPhone is a perfect example. But, its introduction worked because it was, and is uniform across the entire platform and not app specific. Pinching in one app does the same thing as pinching in another.

Great app UIs leave no guesswork for users. Great apps don’t require any training. Great app UIs are self-explanatory. Most importantly, a great User Interface instinctively relies on the coupling of both our physical manipulation (gestures) with our cognizant (thinking/reading) abilities. It is enough of a challenge to design a great User Interface – don’t add to the challenge by attempting to reinvent the wheel. Now go create brilliance!

 

Benjamin Robbins is one of the founders of AdminBridge – providing IT Administration from mobile devices. For more information visit http://adminbridge.com. He blogs regularly at http://remotelymobileblog.com

 

Posted in: Design Trends, Development, Mobile Design, Mobile Marketing

Telling your Story with Cinemagraphs

January 10th, 2012 . by Elizabeth

As the digital world continues to grow, it’s difficult to keep up with the innovative and creative technology. The photography blog by Jamie Beck, From Me To You, has a collection of gorgeous photographs ranging from nature to fashion. Jamie is a style icon herself and was recently asked to photograph New York Fashion week at Bryant Park. Jamie’s posts on Fashion week included beautiful still images as well as a series of images with movement. In a recent post, Jamie explains how the images with movement work and coined the term “cinemagraphs.”

Jamie Beck

“We wanted to tell more of a story than a single still frame photograph but didn’t want the high maintenance aspect of a video” - Fast Company

According to the post, cinemagraphs are still images with movement that are created using “still and video equipment and use Adobe After Effects and Photoshop for editing.” Jamie uses  HTML5 instead of Flash when creating cinemagraphs because it is best for sharing on social media and for commercial or website graphics. Jamie states “the layers that HTML5 offers is also exciting and something we are eager to experiment with,” we’re eager for Jamie to experiment with them as well! The result is a beautiful image design with a life-like quality. Cinemagraphs help tell a story similar to the way a video or presentation would but in much simpler terms. The slight movement brings the image to life, whether it is a reflection of a moving car or windblown hair.

Jamie’s post on cinemagraphs discusses the importance of designing for Tumblr users and the differences between Tumblr and standard web design. The blog is full of great tips, interesting images, and inspiring content, check it out here! Good luck to Jamie in 2012 and we look forward to seeing what she produces next!

Posted in: Design Trends, Development, Digital Marketing, Tech Trends

Which technology is best to use: Flash, Ajax, HTML5, CSS, others?

December 2nd, 2010 . by syn

When it comes to creating web-based, interactive communications that engage your visitors and drive them to action, which technology is best to use?

We get this question from marketers a lot. The answer depends on what’s important to you. How rich is your content? How interactive do you want your user experience to be? And with which browsers and devices do you need to be compatible with?

As interactive designers, we look to use new technology to make content more clear, more compelling and more accessible. We also look to leverage assets across media types, reducing time and costs. Finally, we consider what devices you want to support now and in the future. And that’s a BIG finally.

Technology companies have not made it simple for both the creators of content and the viewers. Each technology has its pros and cons.

Flash is a plug-in-based technology. It doesn’t matter if your users are running FireFox web browser on their Android phones or Microsoft Internet Explorer on their office computers. With Flash Player 10.1 you get about the same experience no matter the device or browser. But there’s a gotcha. Some devices, I’m looking at you, iPhone, iPad and iPod touch, don’t support browser plug-ins. Then you’re sunk.

Ajax is the combination of HTML, CSS and JavaScript, sometimes referred to as Web 2.0. It allows you to add some interactivity. You won’t be able to create the full-browser environments you can with Flash, but you will be able to add enough interactive touches and immediate feedback to engage your audience all while maintaining some level of compatibility from earlier Internet Explorer versions to the iPad.

HTML5 is the next major revision of the HTML standard, as the 5th major release of updates to the language. Imagine all the interactivity of Flash without the browser plug-in. But HTML5 is a work in progress and isn’t expected to be final until 2012 (fingers crossed). Authoring tools are only just beginning to trickle in. And to top it all off, HTML5 will never be compatible with any version of Internet Explorer prior to IE9. But with backers like Google, Apple, Microsoft, and Adobe, the future clearly belongs to HTML5.

New technologies and media bring new opportunities for companies to connect with customers. So until the tech companies decided to play nice, we’ll keep testing for our clients and asking the question… “What matters most to your audience?”

Posted in: Development, FAQs / Tips & Tricks, Insights, Multimedia

« Previous Entries



home     |     about     |     disclaimer     |     cgi interactive
© - CGI Interactive - 76 Otis Street - Westboro, MA 01581 - 508.898.2500