Centigrade GmbH
Thinking Out of the Box

Posts Tagged ‘Visual Design’

Jonas Stallmeister

Microsoft’s Modern UI design language has arrived in many applications with varying success. By now, almost everybody has seen Modern UI (formerly known as Metro), and Microsoft seems committed. Developers of Windows software have to think about the fact that a lot of established interfaces look out of place in a Modern UI environment. It needs to be adapted to the current state of interface design, even more with Apple similarly moving iOS 7 to a flat UI style. Working on such updates, we have collected a set of 10 design principles we call, for the sake of simplicity, “Desktop Modern UI”, and we want to share them with you.

Read whole article…

Thomas Immich

This article was inspired by two interesting days at the GUI&Design conference that took place just recently on 8th and 9th December in Fürth, Germany. The conference audience consisted of professional user experience designers and developers and the talks and workshops focused on Microsoft user interface technologies such as WPF and Silverlight.

Not only this article is a spontaneous creation – one of the activities I participated in during the conference was, too: Clemens Lutsch, User Experience Evangelist at Microsoft, asked me to join a discussion panel in order to conclude the first conference day and discuss concepts and roles in the UX domain with regard to aspects that are challenges in our daily professional work.

For me this was an excellent opportunity to discuss a term that we have introduced at Centigrade a couple of months ago: “user interface design engineering” or a bit shorter “UI design engineering”. Having used the term just internally in the first place, we started to bring it up in conversations with our clients and partner companies more and more frequently – with great acceptance. When I brought up the term during the panel discussion, I observed similar acceptance from the audience and my co-speakers – almost as if the term closed a gap that many professionals felt has existed for quite some time. It was even picked up by other conference speakers, right the next day, which motivated me to shed some more light on the term and its meaning. So, what is UI design engineering, anyway?

Read whole article…

Tobias Gölzer

Texts are important parts of most user interfaces, be it, e.g., as form field labels or longer help texts. This article is aimed at providing a common introduction to the topic „choosing the right font”. It contains some hints an pointers that simplify the search for the right typeface.

Read whole article…

Thomas Immich

Comparing computer games with “serious” software applications may seem like comparing apples and oranges if we think of serious software as tools that allow users to achieve mission-critical productivity goals in their working live. In this respect, the two industries couldn‘t be further apart regarding their target audience and the way they rank productivity vs. fun. For this reason, we are oftentimes asked why Centigrade as a “serious” user interface design company collaborates so closely with the game industry and even has a branch office located in a building that’s otherwise occupied solely by game development studios.

Yet, the link between computer games and industrial software is more obvious than one may think. To summarize why we believe computer games can have a positive impact on the user experience (UX) of industrial software applications, this three-part blog post provides a bulleted list of ten arguments we keep on stating in this regard. The first part gives a high-level and process-oriented perspective on the topic, the second part will shed more light on the transfer of aesthetic and interactive aspects found in games to serious software and the third part will have a look at the game industry as a technical driver for innovations that spill over to other software industries.

Read whole article…

Thomas Immich

Keeping the background information of the previous article in mind, assume you want to make use of Blend to design a NUI based on Silverlight or WPF that lets you easily manipulate items on the screen. In the beginning, you won’t even touch the tool at all – you “invent” whatever gesture you think is intuitive to perform this operation. Most likely you do this in your head or on the whiteboard. You discuss and refine the design with your team mates or with potential users. At this stage everything is still low-fidelity and throwing away things isn’t costly yet. As soon as you have a good-enough feeling about the rough design, you start prototyping with higher fidelity. This is to be really sure your idea works. To provoke the intended interaction experience, caring about every single detail is exceptionally important in later prototyping stages.

Read whole article…

Simon Albers

More and more operating systems use a border resembling frosted glass for their windows, like, e.g., the Aero Glass® decoration known from Windows Vista® and Windows 7®. Providing this ‘special effect’ on the Java™ platform is still not easy to realize. Most Look and Feels use opaque borders, which do not visually match the surrounding designs of these operating systems.
This article describes a pragmatic approach to solve to this problem.

Read whole article…

Markus Weber, Anna Günther

As described in January’s post, animations can fulfill essential purposes in user interface design. This article provides some insight into a study that has been conducted with the goal of exploring the effects of animations regarding user experience.

Read whole article…

Markus Weber

A prototypical sequence in user interface design proceeds from wireframes to interaction design and finally to visual design. The user interface is successively refined, starting with abstract statics, then specifying the basic dynamic aspects until finally visual specifics are added. This is compatible with the view that visual aspects of a user interface are more or less the icing on the cake – details that should only be taken care of after the foundations for a user-friendly have been laid. But this view may be flawed.

Read whole article…

David Patrizi

Red is not always red, green is not always green. For quite a large amount of people it is not easy to distinguish between red and green hues. About 6% of all males have the same difficulties to tell orange from olive-green as unaffected people have to distinguish between burgundy and ruby-red – oftentimes, it is impossible. This most common kind of color vision deficiency is called Deuteranomaly, also known as “green weakness”. The following article will deal with the question of how this wide-spread impairment impacts the production process of high quality icons.

Read whole article…

David Patrizi

In the previous part I took a closer look at how and to what extent Microsoft Expression Blend and Adobe Flex Builder offer pixel-graphics and vector-graphics tools to enable GUI designers to create modern user interfaces. In addition I outlined the concept of 9-Slice-Scaling, a method to make pixel graphics scalable without any quality loss. In this last part of the series I’m going to give a short example of how the concept is implemented in both tools and finally provide an overall comparison of the two tools to point out their strengths and weaknesses.

Read whole article…

Markus Weber

Wireframes are an essential tool in the usability engineer’s toolbox. They can be created easily and support communication regarding fundamental layout and interaction design. Usually, little to no resources are spent on visually “styling” the wireframe in order to efficiently focus on the fundamentals without investing too much effort in visual details that are likely to undergo significant visual changes later.

If members of the design team / stakeholders lack experience with using wireframes, certain problems can occur that may impair a user interface design project, two of which shall briefly be described.

Read whole article…