transport for londoncontent.tfl.gov.uk/onl-std-081-brand-iconography...icons we have designed a new...
TRANSCRIPT
Transport for London
BRAND ICONOGRAPHY STANDARD
February 2014 TfL Unclassified
NOTE: You must refer to www.tfl.gov.uk/toolkit for the latest version of this document
2
PURPOSEThe Brand iconography standard for tfl.gov.uk has been created to provide reference for all iconography used throughout TfL’s website and digital services. It is a reference point for designers and must be followed when producing digital designs on behalf of TfL.
February 2014 TfL Unclassified
NOTE: You must refer to www.tfl.gov.uk/toolkit for the latest version of this document
3
AUDIENCEThis document is aimed at:• Content owners• Designers• Editors• Developers• Relationship managers• Project managers
4February 2014 TfL Unclassified
NOTE: You must refer to www.tfl.gov.uk/toolkit for the latest version of this document
OVERVIEW
ICONS
USE OF ICONS
5
6
7
CONTENTSICON LIBRARY
Core icons
Facilities
Transport modes
Payments & accounts
Alerts
Miscellaneous
8
9
12
14
15
16
17
MAPPING ICONS LIBRARY
Mapping
Transport modes key
Road map key
Transport mode (zoomed)
Miscellaneous (zoomed)
Map pins
Transport modes (selected)
18
19
20
21
22
23
24
25
February 2014 TfL Unclassified
NOTE: You must refer to www.tfl.gov.uk/toolkit for the latest version of this document
5
OVERVIEWThe TfL Iconography standard has been designed to provide an iconography reference source for all transport modes within the TfL group.
Communication through TfL’s website and digital services should be strong and consistent, therefore icons should be both clear in meaning and consistent in their design.
The icons within this document are based on the TfL’s Brand pictogram standard and should therefore be used as the only point of reference when requiring an icon for use on any of TfL’s digital services.
February 2014 TfL Unclassified
NOTE: You must refer to www.tfl.gov.uk/toolkit for the latest version of this document
6
ICONSWe have designed a new set of icons to work in harmony with the new visual language. Icons have been optimised to work at a minimum size of 32 x 32px. Flat coloured icons can be used in any colour unless otherwise specified.
February 2014 TfL Unclassified
NOTE: You must refer to www.tfl.gov.uk/toolkit for the latest version of this document
7
USE OF ICONSThe purpose of icons are to provide visual cues that make navigating TfL’s website and digital services easier and more direct.
For an icon to work, it must be instantly recognisable and understood by all. Therefore the image must be kept simple and consistent. Details that are not essential in communicating the message should be left out.
Although the majority of icons within this standard are shown in blue, the appropriate colour should be used at all times.
February 2014 TfL Unclassified 8
NOTE: You must refer to www.tfl.gov.uk/toolkit for the latest version of this document
1. ICONS
February 2014 TfL Unclassified
NOTE: You must refer to www.tfl.gov.uk/toolkit for the latest version of this document
9
ICONSCore icons
Home
Next
To end
Expand
Menu
Previous
To start
Download
Location
Up
To top
External link
Pin
Down
To bottom
Open
Map location
Plus
Yes
Refresh
Search
Minus
Close
Refresh 2
February 2014 TfL Unclassified
NOTE: You must refer to www.tfl.gov.uk/toolkit for the latest version of this document
10
ICONSCore icons continued
Share
Message
Walk
Phone
Audio doc
Tag
Cycle
Image doc
News feed
Cycle moderate speed
Credit card
Zipped doc
Map radar
Cycle fast speed
Calendar
Excel doc
A to B
Two way
Word doc
A to B 2
Straight ahead
February 2014 TfL Unclassified
NOTE: You must refer to www.tfl.gov.uk/toolkit for the latest version of this document
11
ICONSCore icons continued
Left turn Right turn
February 2014 TfL Unclassified
NOTE: You must refer to www.tfl.gov.uk/toolkit for the latest version of this document
12
ICONSFacilities
Stairs up
Ramp up
Wheelchair facility
Platform info
Stairs down
Ramp down
Wheelchair facility
Photo booth
Esculator up
Male & female
Wheelchair facility
Wifi
Esculator down
Toilets & disabled
Luggage
Cash
Lift down
Elderly
Airport
Tickets
Lift up
Mobility
Audio support
Exit
February 2014 TfL Unclassified
NOTE: You must refer to www.tfl.gov.uk/toolkit for the latest version of this document
13
ICONSFacilities continued
Seating Bridge
February 2014 TfL Unclassified
NOTE: You must refer to www.tfl.gov.uk/toolkit for the latest version of this document
14
ICONSTransport modes
TfL large
London Underground
River
River Bus
TfL small
London Overground
Dial-a-Ride
River tours
National Rail
DLR
Taxi
Emirates Air Line
Bus
Bus
Tram
Tram
24hr bus
Barclay’s Cycle Hire
Coach
Coach
Roads
February 2014 TfL Unclassified
NOTE: You must refer to www.tfl.gov.uk/toolkit for the latest version of this document
15
ICONSPayment and accounts
Oyster
Multiple
Oyster
Next
Oyster touch
Capped
Oyster touch Touchless Underground map
February 2014 TfL Unclassified
NOTE: You must refer to www.tfl.gov.uk/toolkit for the latest version of this document
16
ICONSAlerts
Minimal alert
Warning
Moderate alert
Serious warning
Serious alert
Road works
Severe alert
February 2014 TfL Unclassified
NOTE: You must refer to www.tfl.gov.uk/toolkit for the latest version of this document
17
ICONSMiscellaneous
Two way
Menu
One way
Settings
Plus
Broadcastcommunications
Minus Up Down
February 2014 TfL Unclassified
NOTE: You must refer to www.tfl.gov.uk/toolkit for the latest version of this document
18
ICONSMiscellaneous continued
Yes
Daylight
About
Daylight
Information
Night
Favourite
Night
Favourite
Favourite
February 2014 TfL Unclassified 19
NOTE: You must refer to www.tfl.gov.uk/toolkit for the latest version of this document
1. MAPPING ICONS
February 2014 TfL Unclassified
NOTE: You must refer to www.tfl.gov.uk/toolkit for the latest version of this document
20
MAPPING ICONSTransport modes key
London Underground
Tram
Coach parks
London Overground
Coach
On-street coach meters
DLR
Emirates Air Line
Coach bays
National Rail
River Bus
Other coach parking
Bus
River tours
Bus
Stop
February 2014 TfL Unclassified
NOTE: You must refer to www.tfl.gov.uk/toolkit for the latest version of this document
21
MAPPING ICONSRoad map key
Speed cameras
Traffic conditions
Audio support
Tube stop
Variable message signs
Low Emission Zone
Congestion Charge
Bus stop
Jam cams
Congestion Charge Zone
Parking
Bus stop
Red light cameras
GLA Boundary
Low Emission Zone
Point of interest
Road corridors
Street
Alert
February 2014 TfL Unclassified
NOTE: You must refer to www.tfl.gov.uk/toolkit for the latest version of this document
22
MAPPING ICONSTransport modes (zoomed)
London Underground
Bus stop
Taxi
Coach
London Overground
Bus stopdirection
Minicab
Coach parks
DLR
Empty cycle station
River Bus
On-street coach meters
National Rail
Half full cycle station
River tours
Coach bays
Bus
Full cycle station
Emirates Air Line
Other coach parking
Bus
Stop
Tram
February 2014 TfL Unclassified
NOTE: You must refer to www.tfl.gov.uk/toolkit for the latest version of this document
23
MAPPING ICONSMiscellaneous (zoomed)
Speed cameras
Exit
Minimal alert
Variable message signs
Oyster
Moderate alert
Jam cams
Airport
Serious alert
Red light cameras
Walking
Severe alert
Point of interest
Road works
February 2014 TfL Unclassified
NOTE: You must refer to www.tfl.gov.uk/toolkit for the latest version of this document
24
MAPPING ICONSMap pins
Stairs up
Airport
Bus
River Bus
Stairs down
Walking
Bus stop
River tours
Esculator up
London Underground
Empty cycle station
Emirates Air Line
Esculator down
London Overground
Half full cycle station
Tram
Lift down
Next
Full cycle station
Coach
Lift up
National Rail
Stop
February 2014 TfL Unclassified
NOTE: You must refer to www.tfl.gov.uk/toolkit for the latest version of this document
25
MAPPING ICONSTransport modes (selected)
London Underground
Bus stop
Taxi
London Overground
Bus stop
Minicab
DLR
Empty cycle station
National Rail
Half full cycle station
Bus
Full cycle station
Home
Stop
February 2014 TfL Unclassified
NOTE: You must refer to www.tfl.gov.uk/toolkit for the latest version of this document
26
MAPPING ICONSTransport modes (selected) continued
Emirates Air Line
Coach bays
River tours
On-street coach meters
River Bus
Coach parks
Tram
Other coach parking
Coach
February 2014 TfL Unclassified
NOTE: You must refer to www.tfl.gov.uk/toolkit for the latest version of this document
27
MAPPING ICONSMiscellaneous (selected)W
Jam cams
Serious alert
Variable message signs
Walking
Moderate alert
Speed cameras
Airport
Minimal alert
Red light cameras
Severe alert
Point of interest
Road works
Oyster
28February 2014 TfL Unclassified
NOTE: You must refer to www.tfl.gov.uk/toolkit for the latest version of this document
Type:Owner:Department:
Version history
Review history
Version
Name
1
Date
Title Date
20/02/2014
Summary of changes
Comment
First issue
GuidelinesTfL Online ComplianceTfL Online