Introduction

“Form Follows Function (FFF)” – You can think for hours about these three words and for their explanation quite some words are necessary, for it is a frequently misunderstood design principle.

In April I blogged about metro style pictograms being the new sliced bread in icon design. Remember? The article was, of course, highly interesting, incredibly important and not to mention terribly knowledgeable – and naturally it was in no respect longwinded. Well. Let’s just say it was rather formal and academic. Today, dear reader, I am going to be emotional. And pretty much so. Why? Because bad user interface design can drive you up the wall.

When I started working at Centigrade, I wondered what the “User Interface Architectures” tagline in the company name is about. New terms are common in our line of work; the terminology is still young and changing all the time, many people try to influence it with their own terms and definitions. Still, I thought “why architecture” – maybe you, as a reader, did too?

The short, upfront answer: drawing attention. Readers are supposed to be teased by that line. So, of course it is supposed to stick out, elicit associations and set Centigrade apart.

Still, “User Interface Architectures” is not just another empty cliché buzz term, which brings us to the long, more profound answer. These words sum our work up for newcomers quite precisely and descriptively. We always have to expect that customers, users and external designers or developers may not have a clear understanding of our work. By comparing our services to the field of traditional building architecture, we offer a way to approach it.

Of course, we and other interface designers are familiar with the typical tasks, processes and results of our field. If, however, we get lost in our own work, the comparison to traditional architecture and to traditional architect’s way of working can bring about new ideas and give us new drive. Internally, “User Interface Architecture” forces us to re-evaluate our way of work and view it in a broader context. We want to present four things architecture has in common with user interface design to show how the comparison works internally and externally.

After the introduction of Microsoft’s new approach to user interface design with its current mobile device Windows Phone and upcoming operating system Windows 8, user interface designers and clients alongside them are beginning to “think Metro style”. Based on Swiss Graphic Design principles (established in the 1950’s) and focusing on clean typography, not only interaction, navigation and information architecture have changed, but the understanding of and thereby design process for icons has, too.

As discussed in one of our blog articles about UI guidelines for mobile devices, the concept of Metro style icons is inspired by the idea of quick wayfinding, using pictographic signs found in metropolitan areas, airports or train stations. These simple-shaped icons are not only reduced in both color and detail, but especially shall strive for understandability across cultures and languages. This requirement is by no means new, nor is the Metro icons’ attire. Designed along the lines of traffic signs using the most generic and salient mental model available, Metro icons are in fact pictograms, which against the background of spreading globalization have been standardized in many areas of deployment. Not only for reasons of maximizing their recognition and thereby their value was standardization a good idea, but also because a lot can go amiss in designing a pictogram.

To understand the significance of pictograms and their design one must first of all engage in the characteristics of pictographic and symbolic language and discern these from usual interface icon metaphors, speech and appearance. When this is accomplished five points should be taken into consideration while designing intuitive, understandable and aesthetic pictograms.

Three years ago, we published a blog article that shed some light on the development of the iPhone. The motivation for writing the article was the fact that the iPhone was often used as reference when talking about usability goals and user interface design ideals and that design requests often could be roughly summed up as “Make it like the iPhone”. The blog article described of aspects of iPhone development that did not get the same publicity as the product and its user interface themselves. Those aspects were

• Apple’s complete control over design, manufacturing and marketing,
• a completely new operating system that had been created and
• the considerable effort in terms of time and money that had been invested in the project.

In the meantime, Apple has created several new versions of the iPhone and even included a completely new product in its portfolio: the iPad. After those success stories, it is no surprise that reference to “user interfaces like Apple” is still made. It is therefore appropriate to revisit the topic and add some insights regarding the “Apple design process” in general that have become known to a larger public, not least through the Steve Jobs biography. Such insights can prevent misguided approaches in which Apple-like results shall be reached without implementing a corresponding process.

Communication is essential to UX design. As with other contexts, communication can be impaired by – sometimes very subtle – influencing factors, some of which were described in part 1 of this article. This second part of the article deals with additional aspects that can be detrimental to communication, such as (unconscious) language barriers and the “human factor” in UX design.

There is a multitude of roles and job titles in the field of UX design. But regardless of what the involvement of someone in a UX design project is – communication is a key activity when it comes to successfully accomplishing many of the tasks in the collaborative domain of UX design.

Whether with users, project stakeholders or within a UX design team, “communication” entails much more than simply talking to respective receivers and making sure that the words come out right. There are certain pitfalls to avoid. This two-part article examines the role of communication in UX design in order to provide information that helps in communicating efficiently. In the article, the term “UX practitioner” is used to refer to the diverse roles in a generic fashion. The ideas described can be applied to in-house as well as external (consulting) UX practitioners.

In the first part of this series I described how user interface design tools bring together developers and designers in a seamless workflow and gave an overview of the technical environments of Adobe’s and Microsoft’s tools in that area.

In this article, I am going to focus on the use of pixel and vector graphics in design, deal with some of the pros and cons of the two graphic types and finally give an introduction on the scaling of bitmap GUI components.

This series of blog articles deals with the use of GUI development tools by designers and developers, with a particular focus on Microsoft Expression Blend and Adobe Flex Builder.

In the first part, I will have a look at the cooperation between designers and developers during GUI creation, describe some issues that can affect their collaboration and point out how GUI design tools can improve the overall design and development workflow.

The previous part explained why both a pure pixel-based or pure vector-based approach to icon design implies drawbacks. As Centigrade provides professional icon design services, we continuously investigate how to make our icon design process more efficient and overcome technical shortcomings.