The screen layout describes the design of graphical user interfaces. The screen design includes a wide variety of apps in which screens can be used as part of human-machine interaction. It must be distinguished from the functions of a graphical user interface. The technical implementation is not part of the screen design.
General information
The screen layout can be understood as the conception and creation of the graphical user interface (GUI). The layout of the items on the screen is of great relevance. This mainly refers to the layout. The information architecture concept is presented in detail since the location of items such as navigation, text, headings, as well as sub-headings, images, videos, icons, and other user interface content is an important factor. Hence, the screen layout it has to do with the composition of the multiple items and contents, and their appearance in their respective interface.
Screen layout usage
The screen design It is not only used for websites, mobile websites or apps for smartphones, but also in many other apps that have user interaction as a central element in different screen sizes. These multiple output formats are challenging for designers as the content will be displayed on different screens. This also means that certain restrictions and possibilities must be taken into account and exploited.
The characteristics and possible patterns of interaction must be supported by the graphical properties of the medium. At the same time, the overall impression of the screen must satisfy certain aesthetic requirements. For example, items on screens should have proportions that have an aesthetic effect on the viewer or user. This aesthetic 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
The designers who are in charge of the design of the screens usually collaborate with programmers and web designers to support the characteristics of the visualization apps through the design. They have to comply with screen design standards and also pay attention to psychological and technical factors. After all, the screens are always part of the programming or markup language used and the possible patterns of user interaction. At the beginning of a procedure in the screen layout it is always this user. The design of the screen should be based on the target audience. Therefore, screen layouts Barrier-free is conceived differently than screen designs for mobile devices. Children's screens contain design items different from those for adults.
Throughout the design procedure, aspects such as corporate design or technical implementation with HTML, PHP and especially CSS also play an important role. The latter depends, however, on the area of application and the language used. Therefore, screen designers usually create a style guide that 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.
Style guide content
Style guides can consist of the following factors:
- Information or page architecture.
- General layout (for websites, this would be the output template structuring).
- Basic user guide.
- Detailed specification of display models.
- Assignment of functions to screens (menu, navigation, content).
- Assignment of functions to interaction styles (control with mouse, keyboard or contextual menu).
- Typographic concept (font, font size, text layout).
- Color scheme (font color, background and screen templates).
- Style windows, pop-ups, infographics, icons, buttons and animations.
- Definition of formats for numbers, dates or address information.
- Design pattern (template) for post content.
- Typically, samples are created in the style tutorial that give the customer a concrete first impression of the graphical user interface.
Importance for usability
The screen layout it goes hand in hand with the technical, psychological, and still practical aspects of a user interface. In the preliminary stages, attention should be paid to the target group, the purpose of the user interface, and the framework in which it exists. Whether it is a web portal, a mobile device web portal, or a software application, the screen design not only refers to the first impression of an application, but is a key factor in terms of the graphical properties of the entire interface. of user. Therefore, screen design plays a particularly important role in the areas of usability, user experience, and human-machine interaction. Screen layout affects website, app, and software conversions.
