The 5 Fundamental Layers of User Experience Design

User Experience design for successful Human Computer Interaction (HCI) requires thoughtful planning and execution. To work correctly, five dependent layers need to be considered, each level builds on the level before it, and they start with abstract level towards concrete one (from bottom Strategy to top Surface).

Strategy

The strategy is the reason for the product, application or the site, why we create it, who are we doing this for, why people are willing to use it, why they need it. The goal here is to define the user needs and business objectives.

Scope

The scope defines the functional and content requirements. What are the features, and content contained in the application or product. The requirements should fulfill and be aligned with the strategic goals. Functional Requirements and Content Requirements define scope. Functional Vs Content requirements: The feature is having a media player for songs, while the content is the audio files for these songs.

Structure

Defines how user interact with the product, how system behave when user interact, how it’s organized, prioritized, and how much of it. Structure is split into two components, Interaction Design & Information Architecture.

Skeleton

Skeleton determines the visual form on the screen, presentation and arrangement of all elements that makes us interact with the functionality of the system that exist on the interface. Wireframes are widely used to create a visual format, which are static diagrams that represent a visual format of the product, including content, navigation and ways for interactions.

Skeleton is split into three components (User) Interface Design, Navigation Design, & Information Architecture.

Surface

It’s the sum total of all the work and decisions we have made. It determines how does the product will look like, and choosing the right layout, typography, colors, etc. In Surface, we are dealing with Visual Design. It’s concerned about the visual appearance of content, control, which gives a clue of what user can do, and how to interact with them.

The Importance of Each Layer

Each layer is dependent on the other layers below it. If you screw up in Strategy, you will pay for it during the whole project. When you make a decision or choice in a layer, this decision will affect on your future decisions in the next layers.