Visual Design

Implementing your visual design

Applying a visual design to both your digital workplace and any solutions you deploy occurs during the Implementation Stage. Applying the right visual design is imperative to your overall success. It's the element in your strategy which your employees see, feel, and experience when they login and use your digital workplace.

Applying a design to your digital workplace

Your digital workplace is completely configured and it's ready for the visual design elements to be applied. Working with your Configuration Specialist, Igloo Designers create a design workbook for your digital workplace. This workbook is based on your brand guidelines and visual design objectives. It is recommended, wherever possible that the design teams work directly with your team who is responsible for UI design.

The final workbook and visual design objectives are used as a guide to create the final mock ups for the digital workplace site and solutions. 

The workbook materials are broken into the following three distinct design building blocks:

  1. Visual design
  2. User interface
  3. Accessibility

Visual Design

Building your digital brand and identity

Branding is the identity of an organization and its people. It is an extension of your company culture, reaching any employee, anywhere. Organizations that make an impactful statement about their brand give employees a strong sense of belonging and ownership. 

Extending this brand experience across your digital workplace will create a more connected, cohesive, and clear brand experience. Igloo is unique in that we can adapt the platform to create a strong brand connection while solving your business challenges.

Creating a visual identity that supports your brand

Visual design is used to guide users in the optimal direction. The most common mistake we see in digital workplace design is a lack of visual hierarchy of information. If everything is visually the same "loudness" then everything is shouting at the user. Visual Design will define this hierarchy and show your user exactly where to go (without overwhelming them). 

Visual Design helps to deliver a positive user experience. Affordances such as shadows, visual weight, and proportions are all used to give users clues about how a function should be used and provides context to the object. Usability assesses how easy user interfaces are to use. 

Usability can be defined by 5 quality components:

  • Learnability: How easy is it for users to accomplish basic tasks the first time they encounter the design?
  • Efficiency: Once users have learned the design, how quickly can they perform tasks?
  • Memorability: When users return to the design after a period of not using it, how easily can they re-establish proficiency?
  • Errors: How many errors do users make, how severe are these errors, and how easily can they recover from the errors?
  • Satisfaction: How pleasant is it to use the design?

(Source: NNGroup)

Designing for growth and flexibility

Similar to modern offices, digital workplaces change and adapt for varying needs. One day, an alert is needed, the next day, it is not. Visual Design gives you the classes you need to adapt your digital workplace when necessary. 

Think about how a user might use and respond to their digital workplace by considering what that user is like in person. Use personas (the aspect of someone's character that is presented to or perceived by others) to guide your decisions. Do not use your own personal preferences and taste to guide you.


PlaybookTip_Icon.png Playbook Tip: Design for your employees

  • What does the average user’s day-to-day look like?
  • What is their very first intention when logging in to the digital workplace?
  • What do they wear to work?
  • What kind of work activities do they participate in?
  • What kind of physical work environment do they work in?

User Interface

Understanding the importance of look and feel

Research has shown that users evaluate the look and feel of a site to determine if they trust it, so first impressions matter. Intranets have always had some elements of branding; even if it was just a logo or a color. Customers have come to expect that the brand should be applied to their site. These expectations are created by websites and platforms that allow customers to visually apply their brand such as WordPress and Squarespace.

Pasted Image


Using visual elements

Our team of Visual Designers combine visual elements (color, shapes, typography, imagery, iconography, and texture) with design principles (contrast, visual weight, hierarchy, proximity, alignment, space, proportion, balance, movement, repetition, etc.) to create accessible and beautifully branded digital workplaces.

Using hierarchy

Hierarchy is a way of organizing groups of things to be ranked from most important to least. It refers to the arrangement or presentation of elements in a way that implies importance. In other words, visual hierarchy influences the order in which the human eye perceives what it sees. 

This order is created by the visual contrast between forms in a field of perception. We use visual hierarchy in Igloo to give visual impact or visual weight to elements in order to direct the human eye to those items or to achieve the opposite effect.

Visual design fills the need to personalize the digital workplace to your organization, ensuring it’s not ‘just another app’ to download and use at work.

Accessibility

Creating an accessible digital workplace

Web accessibility means making your online presence as inclusive as possible to everyone – disability or not. It means creating content (visual or not) that is accessible to all users, regardless of their physical or cognitive abilities, their technological requirements or their cultural background, education and experience. When sites are properly designed, written and programmed, they offer universal access to information and functionality. Interface components must be presented in ways that all users can perceive, even if they have impaired vision or hearing.

Readability plays a significant role in accessibility. It is a measurement of the quality of legibility of text and making it as easy to read as possible. Readability refers to the clarity and speed with which content can be digested over an expanse of text such as a paragraph or a page. Readability is related to a font’s legibility but is also influenced by design and layout decisions. The chief factors determining whether the text is readable are dimension, spacing and alignment. Users with low vision express widely varying preferences when it comes to the presentation of text. The key to ensuring readability is contrast, which is determined by text size and how easily letterforms can be distinguished in a particular font. For users with low vision, color is an important factor. 

Our Visual Design team strives for all colors to be accessible and to achieve the World Wide Web Consortium (W3C)'s accessibility standards. Specifically, their color contrast ratios. 

larger_Accessibility.png

Objectives/Value Props

  • Aids in guiding users to key information
  • Aids in achieving planned business goals
  • Creates a brand connection and expression
  • Meets user/consumer expectations for a distinct personalized experience
  • Creates a trust factor
  • Accessible and inclusive
  • Aids in achieving planned business goals

Viewed 850 times