IAT-102: 10 Branding Me Myself and I

IAT-102: 10 Branding Me Myself and I — A slide deck

Branding Me, Myself, and I

Lecture outline

In this week's lecture

  • Branding design
  • Personal branding

Lecture slides will be available the morning of the lecture.

Close All Laptops Please

Only the back row may use their laptops.

What does this ethos say?
What does this ethos say?

Branding Me, Myself and I

Developing an Ethos

A design ethos is the understanding, characteristics and definition of oneself as a designer.

What is a Brand?

A unique ________ to identify __________ with.

Visual Branding

A unique symbol or language to identify products with.

Logo ≠ Icon

Types of Logos

Wordmarks

A stylized acronym or company name.

The Ebay logo
The Google logo
The Ikea logo
The Nokia logo

Types of Logos

Letterforms

Stylized letterforms as mnemonics.

The IBM logo
The LG logo
The HP logo

Types of Logos

Symbolic

Name and pictorial elements tied together.

The Elmer's logo
The Tivo logo

Types of Logos

Pictorial

A quickly recognizable pictorial element.

The Apple logo
The CBS logo
The Twitter logo

Types of Logos

Symbolic

A strategically abstract symbol.

The British Petroleum logo
The Nike logo
The CBC logo

Simple

  • Quickly interpreted
  • Clearly recognizeable
  • Easily reproduced
Logos for different cleaning services

Memorable

Your visual identity should be sufficiently distinct from others that exist.

Scalable

  • Works at various sizes
  • Has alternates as necessary
Different packages with the Starbucks logo applied

Colour

  • Helps to distinguish it
  • Adds meaning as necessary
  • Works with or ...
A coloured logo

No Colour

...works without colour.

A coloured logo
An uncoloured logo

(This treatment may be a bit problematic)

Your Visual Identity

"You want the overall style of the portfolio to accurately convey your identity, and every element — including font, colour, and imagery — must work together to convey your graphic design knowledge and what makes you interesting and unique."
IAT-102: P05 Portfolio

Why Brand?

Three big reasons:

  1. Navigating the world of products
  2. Reassurance that we are getting what we want
  3. Engaging with a product or company

Interaction Branding

A unique interaction to identify an interface with. Let's take a look at a visually and interaction distinct portfolio.

Reassurance

Portfolio Review

Let's take a look at a couple portfolios and talk about their ethos:

Language Branding

A unique language to identify content with.

Bio

"In 100 words introduce yourself. Who are you? Describe your field or academic interests (what you are studying at SFU) an your professional goals or values (why you are studying in your field). Ensure there is a meaningful connection between the image and the introduction."
IAT-102: P05 Portfolio Project

Experience Branding

A unique experience to identify a company with.

The Cult of Mac

Delight and Accommodation

"The pedigree of great design isn't solely based on aesthetics or utility, but also the sensation it creates when it is seen or used."
The Shape of Design (Chimero, 2013)

Personality

Remember that all the components of your portfolio speak to who you are. Let's take a look at an example of a graphic design portfolio in the context of 'personality'.

Personality

Humans are human biased. We tend to identify with things that are human-esque.

The MailChimp logo

Shortcomings of Branding

  • Maintenance
  • Consistency
  • Cost
  • Impersonality

Brands Evolve

1971

Starbucks' 1971 logo

1987

Starbucks' 1987 logo

1992

Starbucks' 1992 logo

2011

Starbucks' 2011 logo

What is Ethos Branding?

A unique form and content to identify you with.

Process Analysis: Peer Review

Time to meet your neighbours!

Sketching Exercise

To start thinking about how to clarify interaction within the portfolio website, this week's sketching exercise has you drawing out the different states of interactable elements. Please sketch out three possible buttons or other interactive elements — such as in-text links, icons, images, etc. For each of the three sketches:

  • Sketch the inactive state of the interactive element.
  • Sketch the active (hovered or focused) state of the interactive element.

Next week's lecture is all about getting interactive.

Contacting Andrew

Your Lecturer

Reachable at:

  • Office hours — Mondays from 8:30-9:30am and Thursdays from 8:30-9:30am at the Surrey campus mezzanine.
  • ac.ufs@h_werdna
1/1