In interface design, the term consistency is part of the professional jargon. It is used for everyday feedback and in long term concepts. It is also common ground with developers and clients. Consistency is an important evaluation criterium. Enough reasons to get a good handle on the term. read more…
Thinking Out of the Box
Posts Tagged ‘Visual Design’
I am sitting in front of my new computer – a marvel of modern technology. It is stuffed full with every imaginable designers’ software, and I ask myself: Why should I ever use pen and paper again? Is it not a lot easier to create everything digitally?
Have you had similar thoughts in the past? Or do you start creating things straight at the computer without considering anything else? read more…
Black text on a white background is trustworthy. Even more so: black on white is a fact. It is printed and displayed on screen. The truth is said to be “black on white”. Except when it is not. In programming, the truth oftentimes is white on black. And the truth was white on a blackboard back in school. There are reasons for these exceptions and there are reasons for the rule. I’ve collected some of the reasons that might be interesting for interface designers.
In Part 1, we discovered that the emotional factor of user experience is more important to games than goal-oriented functionality (though being an effective and efficient way of reaching a goal, there is no “Save the Princess” button in a Mario game at the beginning). Up to a certain degree, well-designed user experiences can distract from negative and/or not fixable interaction flaws and can make users “like” an application more than another.
Furthermore the diverse team composition of game development studios was discussed in the first part. In this context we pointed out that the production process of games forces programmers and visual designers to work closely together. Design is not seen as an add-on but as an essential part, which is necessary for the product to work.
The last chapter focused on the aspect of small budgets in game projects. Rapid iterative testing and evaluation (RITE) helps to detect and fix flaws of a UI in a very fast way, thus reducing time and money spent on traditional usability optimization.
In Part 2 we will look at the aspects of imaginary worlds and the link between reality and simulation. Thereafter, we will show which techniques are used in games to reduce loading, and even more important, waiting times. In the last section we compare how serious applications and games introduce their functionality to the user. To get a better understanding of the concept of Gamification you can also read: “Gamification as a design process” by my colleague Jörg Niesenhaus.
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 more…
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?
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 more…
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.
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.
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.
Warning: filemtime(): stat failed for /home/www/www-master/www/basic/resources/images/team/photos-xl/anna.guenther.jpg in /home/www/www-master/www/basic/classes/Page.php on line 775
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.
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.
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.
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.