-susan kare
DESCRIPTION
-Susan Kare. Mac icons by Susan Kare. Principles. Immediacy : impact and memorability through instant recognition Generality : ability to represent a class/group (remove specifying details) Cohesiveness : images in system share instantly-perceived visual vocabulary - PowerPoint PPT PresentationTRANSCRIPT
-Susan Kare
Mac icons by Susan Kare
Principles
• Immediacy: impact and memorability through instant recognition
• Generality: ability to represent a class/group (remove specifying details)
• Cohesiveness: images in system share instantly-perceived visual vocabulary
• Characterization: focus on the few distinctive, essential aspects of object
• Communicability: shared context enables correct viewer interpretation
Sydney 2000 Olympic Games
9 ANTI-PATTERNS FOR ICON DESIGN
9 Anti-patterns for icon design
1. Insufficient differentiation between icons
9 Anti-patterns for icon design
2. Too many elements in one icon
9 Anti-patterns for icon design
3. Unnecessary elements
9 Anti-patterns for icon design
4. Lack of unity of style within a set
9 Anti-patterns for icon design
5. Overly original metaphors
MacOSX Guidelines: Use universal imagery that people will easily recognize.
9 Anti-patterns for icon design
6. Ignore national and cultural differences
Food ≠
9 Anti-patterns for icon design
7. Images of real interface elements
9 Anti-patterns for icon design
8. Text inside icons (tricky)
9 Anti-patterns for icon design
9. Ignore platform guidelines
DESIGNING ICON SETSTurbomilk’s process in four steps…
Preamble: Two rules (Turbomilk)
1. Before drawing any icon, elaborate its image very carefully (sketch a lot).
2. If you need to draw several icons, think over images for the whole set of icons before proceeding with illustrating activities.
App: help managers of small companies send invoices for work performed
• work is done• invoice is sent• money is received
1. Analyze app features:
• Invoices consist of lines: records on services provided, goods sold or time worked.
• Lines may be “free” (not connected to an invoice), and available to “pile up”.
• User can store “free” lines in a pile in the process of performing work for clients and generate invoices based on the finished lines later.
• Invoices can be paid in several installments.
2. List commands requiring icons
2. List commands requiring icons
2. List commands requiring icons
2. List commands requiring icons
Command elements (color-coded):• objects• actions• limiters• qualifiers
… become the visual building blocks for icons, a visual grammar
Objects:• line• invoice• payment
Actions:• add• delete• group• show• send
Limiters:• on service• on time worked• on product sold• tied up• free• unsent• sent• paid• all
Qualifiers: from invoice completely into invoice into pile
3. Brainstorming element visuals
Objects:
3. Brainstorming element visuals
Actions:
3. Brainstorming element visuals
Limiters:• line status• invoice status• line type
3. Brainstorming element visuals
Qualifiers:
4. Compose icons
Free line commands:
4. Compose icons
Invoice commands:
4. Compose icons
Invoice line commands:
4. Compose icons
Incoming cash records: