GD202 Week 8

Visual Design for Web Applications

March 5

GD202 Interactive Design I

  • Learn how to create a style tile. Explore color theory, visual design, composition, for web applications.
  • Digital Typography.
  • Explore font pairings for the web in google fonts, legibility on screens, typography rules for web applications.
  • Assign Project 6: Style Tile Variations.

A Guide to Visual Design

Visual Design Resources for Web Applications

by Miranda Ting

Design Inspiration Design School

Color Inspiration

Contrast

Web Typography Resources

Articles

Style Tiles

Style Tiles designed by Stephen Bau for Domain7

Graphic Standards and Style Guides

Once upon a time, there were graphic standards manuals. Interbrand is a company that specializes in international corporate brands, gathering data to compare the best global brands.

However, not everyone has the resources of Apple, Google, Microsoft and Coca-Cola to develop comprehensive graphic standards and identity systems.

BBC Global Experience Language

The BBC has created a site dedicated to communicating the importance of consistent application of brand design, focusing on three essential components: grid, iconography and typography.

UBC Brand Toolkit

Closer to home, Matt Warburton, Design Director at UBC, has been guiding the process of developing the brand for the university.

UFV Brand

The UFV brand has been going through some changes. The new home page reflects the work that has been progressing to give the university the ability to better represent the brand design with a responsive web design.

Style Guides

Even a basic style guide is a useful tool to guide a team to maintain the integrity and consistency of a brand identity on the web and across all media.

Online Exercise: Web Typography

This week’s assignment:

Read

Read through the following chapters in “Professional Web Typography”

Review

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store