VISUAL DESIGN

DESIGN EMOTION

Visual design is a means of communicating through orienting illustrations and photography, meaningful typography, evocative iconography, persuasive color, comforting spacing and layout execution, and many other "little big details."

Visual design is the first impression your product will make and arguably on of the most important impressions it will make.

An application's visual design is often refereed to as its style. We can use gestalt principles to communicate and bring order to those ideas in applications including:

- Alignment (often achieved with grids)

- Emphasis (often achieved with size, position, color)

- Consistency (buttons, links, headers typically look alike)

- Whitespace (elegant, timeless, gives eye a rest)

Successful visual designs typically don't draw attention to themselves. The content will be front-and-center and the workflow through the site will be obvious. The look of something cannot be considered holistically without the feel of it, or the use of it. Visual design concerns itself with the What, the Who, and the How. It requires the ability to come up with a holistic aesthetic that travels across all platforms, and is focused on the look and feel of the product and brand, as well as being involved in conversation about the product message and goals.

CASE STUDY

To complete the step change in user experience for Pure Connect music streaming solutions a new visual style was created with alignment to the brand promise and based on the following principles:

- Convey the elements of music choice, emotion, and humanity within an engaging/accessible, smart, modern, and elegant style through use of colour and movement,

- Create a balance between expressive content and functional control,

- Present a distinctive, but not unfamiliar; effective, modern, and progressive design style.

To convey a more elegant, modern, engaging and bold impression a dark theme was used to promote better colour blending and attract more focus on the content visuals.

Typography was also updated to create a contemporary, elegant style that could easily be supported by web and app. Proxima Nova was chosen for this reason.

A style guide was created to communicate the visual design, and a pattern and UI library was created to ensure consistency across all platforms, and touch points, including print, web, and app.

<

ALL

>

<

© 2022 Copyright CYXperience