Screendesign
Screen design describes the design of graphical user interfaces. Screen design includes a wide variety of applications where screens or displays can be used as part of human-machine interaction. Screen design should be distinguished from the functions of a graphical user interface. Technical implementation is not part of screen design.
General Information
Screen design can be understood to be the conceiving and creating of the graphical user interface (GUI). The arrangement of the elements which can be seen on the screen is of greatest importance. This concerns primarily the layout. The concept of the information architecture is presented in detail. Location of elements such as navigation, text, headings, as well as sub-headings, images, videos, icons and other content of the user interface is an important factor. Screen design is therefore concerned with the composition of the various elements and content, and their appearance on their respective interface.
Use of screen design
Screen design is not only used for websites, mobile websites or apps for smartphones, but also in many other applications or devices which have user interaction on different screen sizes as their central element. These various formats or devices are challenging for screen designers, because content will be shown on different screens. This also means that certain restrictions on layout must be taken into account and exploited.
The features and possible interaction patterns should be supported by the graphical properties of the medium or device. At the same time, the overall impression of the screen display must satisfy certain aesthetic requirements. For example, the elements on the screens should have the correct proportions, which have an aesthetic effect on the observer or user. Such aesthetics is in turn associated with the user interface and is directly related to aspects such as web design, usability or user experience.
Types of functions
Screen designers usually collaborate with programmers and web designers to support the features of display applications through design. They have to comply with the requirements of screen design, and also take into consideration psychological and technical factors. After all, screens are always part of the programming or markup language used. Users are always at the beginning of a process in screen design. Screen design should be based on the target audience. Barrier-free screen designs are therefore differently conceived than screen designs for mobile devices. Displays for children contain different design elements than those for adults.
In the course of the design process, aspects such as corporate design or technical implementation with HTML, PHP and particularly CSS also play an important role. The latter is of course dependent on the application area and the language used. Screen designers therefore often create a style guide, which summarizes and documents the patterns of interaction and visual design. The purpose of a style guide is the consistent implementation of the different requirements for different output devices, target groups and user interface features.
Content of style guides
Style guides can consist of the following factors:
- Information or page architecture
- General layout (for websites, this would be the structuring of output templates)
- Basic user guide
- Detailed specification of screen templates
- Assignments of functions to screens (menu, navigation, content)
- Assignments of functions to interaction styles (control with mouse, keyboard, or context menu)
- Typographic concept (font, font size, text layout)
- Color scheme (color of font, background and screen templates)
- Style of windows, pop-ups, infographics, icons, buttons and animations
- Definition of formats for numbers, dates, or address information
- Design pattern (template) for subsequent content
Typically, examples are created in the style guide which give the customer a concrete first impression of the graphical user interface.
Importance for usability
Screen design goes hand in hand with technical, psychological and of course the practical aspects of a user interface. In the preliminary stages, the target group, the goal of the UI and the framework in which it exists must be taken into account. Whether website, mobile website or software application, screen design is not only more important than the first impression of an application, but is a key factor in terms of the graphical properties of the entire user interface. Therefore, screen design has a particularly important role in the areas of usability, user experience and interaction between man and machine. Screen design can significantly impact the conversions of a website or an app.