Charts, Pictograms and Infographics

Tables, diagrams, pictograms, or infographics can be used to easily explain complex overall correlations. Thanks to visual data preparation individual information is displayed clearly and in a pleasant way on the web, in print media, etc. Graphical elements are dominated by clear, structured, and tidy illustrations. Tables, diagrams, etc. shall always be illustrated in 2D2D
The abbreviation “2D” stands for “two-dimensional.” The position of every point in a 2D object is ... without shading.

Tables and Diagrams

All tables and diagrams are based on a 1 x 1 mm grid. The base lines run horizontally and in black with a line thickness of 0.25 pt or 0.75 pt to highlight headings. Use the Petrol accent color including its corresponding lighter and darker tones to highlight text, values, or areas. Deep Red must be used very sparingly for highlighting. Tables and diagrams shall be on a white or Light Grey background. Text and digits shall be black on a white background or white on a dark background. Rows and/or columns in tables can be illustrated in Light Grey including the lighter or darker gradations. If a graphic has been included in continuous text, it features a 1 pt thick line at the top as a border from the text copy. The associated table heading shall be positioned below this line. If the tables or diagrams are not included in the text copy (e.g. within a PowerPoint presentation), the table or diagram heading shall be positioned above this line.

Tables on white and Light Grey background with lighter and darker gradation of Petrol.

Diagram Variants
Line diagrams are best suited to illustrate upward or downward trends. Preferably they must be designed horizontally. Line thicknesses from 1 pt, 1.5 pt, 2 pt, and 3 pt are available to illustrate the different trends. Line diagrams can also be illustrated as area diagrams.

Line diagrams on white background and area diagram in Light Grey

Bar charts illustrate changes over a certain period. Colored surfaces are positioned next to each other vertically or horizontally. The bar thickness shall be 2 millimeters at minimum. Make sure the bars are not positioned directly next to each other and always keep a free-space.

Deep Red is also used in bar charts. It must be used very sparingly for highlighting. 

Rankings can be illustrated very well in bar graphs. Individual elements of additive bar graphs are separated by a line with a thickness of 0.5 pt. The minimum width of the bars must be 3 mm.

Bar graphs aligned vertically and horizontally as well as in shades of Petrol or Light Grey.

Pie charts are very suitable to illustrate distributions and proportions. They are used in doughnut or pie charts. The ring shall be at least 2 mm wide. Individual segments shall be separated by a white line with a thickness of 0.5 pt. When creating these diagrams it is important to note the first element must start at the 12 o’clock line.

Pie charts as doughnut charts or full-surface pie charts.

Pictograms

Pictograms represent specific objects or complex issues. They must therefore speak a clear and visually unambiguous language, be self-explanatory and internationally understandable. The style for pictograms at Daimler name-bearing subsidiaries is angular; their line thickness is based on the Daimler CS Demi font styleFont Style
Font variants within a font family, e.g. italic, normal, demi-bold, bold or extra bold.. Text elements in pictograms, e.g. the word “Exit”, are in upper case in the Daimler CS Demi font style.

Pictograms in the library “Sustainability”

Pictograms in the library “Sustainability”

The library “Sustainability” contains 44 pictograms:
[1] Sustainability, [2] strategy (“lane change”), [3] electricity pylon, [4] wind turbine, [5] e-mobility, [6] e-charging station, [7] gas pump, [8] flash, [9] e-battery, [10] plant building, [11] city, [12] climate protection, [13] conservation of resources 1, [14] conservation of resources 2, [15] conservation of resources 3, [16] emission-free vehicle, [17] carbon dioxide, [18] hydrogen, [19] water molecule, [20] hydrogen peroxide, [21] oxygen, [22] solar energy, [23] water consumption, [24] refuse, [25] raw material, [26] recyclable battery, [27] crude oil, [28] natural gas, [29] biomass, [30] electricity, [31] groundwater pollution, [32] soil and groundwater pollution, [33] soil pollution, [34] water bodies, [35] energy efficiency, [36] plant, [37] deciduous tree, [38] coniferous tree, [39] animals, [40] moose, [41] polar bear, [42] water drop (single), [43] water protection and [44] water drops

Pictograms in the library “Coronavirus pandemic”

The library “Coronavirus pandemic” contains 23 pictograms:
[1] Coronavirus, [2] protective measure, [3] mouth-nose-mask (side view), [4] mouth-nose-mask (front view), [5] keep distance, [6] cough into your elbow, [7] do not sneeze into your hand, [8] observe current special regulations for meals, [9] observe special regulations for transport, [10] observe information on site, [11] do not shake hands, [12] in case of cough/fever: stay at home, [13] open doors without skin contact, [14] clean surfaces, [15] avoid grouping, [16] pay attention to signs of illness, [17] ventilate regularly, [18] heal up illness, [19] keep hands under running water, [20] rub soap into hands, [21] rub soap between the fingers, [22] rinse hands thoroughly and [23] dry hands carefully

Pictograms in the library “General”

Pictograms in the library “General”

The library “General” contains 41 pictograms:
[1] Consulting, [2] bookmark, [3] puzzle, [4] willingness to perform, [5] car service station, [6] customer orientation, [7] customer handover, [8] home, [9] continents Africa-Europe, [10] continents North America-South America, [11] continents Asia-Australia, [12] globe, [13] tool, [14] tachometer, [15] compass, [16] stop, [17] circle empty, [18] circle one-quarter filled, [19] circle half-filled, [20] circle three-quarter filled, [21] circle filled, [22] callout 1, [23] callout 2, [24] prohibition, [25] attention, [26] music, [27] target flags, [28] barrier, [29] winners podium, [30] trophy, [31] spyglass, [32] glasses, [33] pen, [34] thumbs up, [35] thumbs down, [36] library, [37] traffic lights, [38] traffic lights red, [39] traffic lights yellow, [40] traffic lights green and [41] calendar

Pictograms in the library “Business”

Pictograms in the library “Business”

The library “Business” contains 31 pictograms:
[1] Teamwork, [2] integrity, [3] feedback culture, [4] networking, [5] participation, [6] mixed team, [7] piggybank, [8] topic collection, [9] think tank, [10] education, [11] health, [12] balance, [13] sleep, [14] concentration, [15] analysis 1, [16] analysis 2, [17] motivation 1, [18] motivation 2, [19] gear wheels, [20] idea, [21] target circle, [22] checklist, [23] task, [24] certificate, [25] meeting, [26] office workplaces, [27] workplace, [28] business relations, [29] completed, [30] hierarchy and [31] handshake

Pictograms in the library “Mobility”

Pictograms in the library “Mobility”

The library “Mobility” contains 22 pictograms:
[1] car, [2] electric car, [3] plugin hybrid, [4] autonomous car, [5] autonomous driving, [6] autonomous driving (steering wheel), [7] taxi car, [8] van, [9] electric van, [10] car and van, [11] train, [12] delivery vehicle, [13] car key, [14] sharing & services, [15] target, [16] route, [17] pedestrian, [18] bicycle, [19] cyclist, [20] airplane, [21] drone and [22] air taxi

Pictograms in the library “Social Media”

The library “Social media” contains 9 pictograms:
[1] LinkedIn, [2] Twitter, [3] Xing, [4] YouTube, [5] Facebook, [6] Instagram, [7] WhatsApp and [8] Snapchat

Pictograms in the library “Communications”

The library “Communications” contains 28 pictograms:
[1] Mobile app, [2] listening, [3] microphone, [4] video camera, [5] helpdesk, [6] megaphone, [7] distribution list, [8] speech bubble, [9] dialog, [10] providing information, [11] critical issue 1, [12] critical issue 2, [13] taboo issue 1, [14] taboo issue 2, [15] taboo issue 3, [16] discussion, [17] media wall, [18] presentation, [19] smartphone, [20] tablet, [21] desktop, [22] notebook, [23] digital media, [24] camera, [25] information, [26] document, [27] archive and [28] message

Pictograms in the library “Technology/IT”

The library “Technology/IT” contains 30 pictograms:
[1] Artificial intelligence, [2] fingerprint, [3] safety, [4] database, [5] block chain, [6] analytics tools, [7] data processing, [8] update, [9] cloud, [10] data protection (cloud), [11] connectivity, [12] link, [13] virtual realityVirtual Reality
“Virtual reality” refers to an all-embracing computer-generated simulation of reality, which is ..., [14] augmented reality, [15] wifi, [16] funnel, [17] cart, [18] play backward, [19] play forward, [20] pause, [21] search, [22] zoom out, [23] zoom in, [24] print, [25] copy, [26] download, [27] upload, [28] lock, [29] share and [30] network

Pictograms in the library “Financing”

The library “Financing” contains 8 pictograms:
[1] Business transactions, [2] financial responsibility, [3] money, [4] credit card, [5] calculator, [6] bar chart 1, [7] bar chart 2 and [8] bar chart 3

Pictograms in the library “Persons”

The library “Persons” contains 8 pictograms: 
[1] Man and woman (partial view), [2] female persons, [3] individual, [4] female person, [5] group, [6] man (full view), [7] woman (full view) and [8] population

Pictograms in the library “Signage”

Pictograms in the library “Signage”

The library “Signage” contains 42 pictograms: 
[1] Meeting point, [2] stairs, [3] stairs up, [4] stairs down, [5] waiting zone, [6] escalator up, [7] escalator down, [8] emergency exit left, [9] emergency exit right, [10] wheelchair, [11] lavatory, [12] WC ladies, [13] WC men, [14] waste, [15] elevator, [16] first aid, [17] coffee, [18] meal, [19] wardrobe, [20] smoking area, [21] no smoking, [22] fire extinguisher, [23] phone, [24] ice, [25] construction site, [26] park deck, [27] parking area, [28] accessible WC, [29] lock box, [30] bus stop, [31] shower, [32] shower ladies, [33] shower men, [34] changing room, [35] changing room ladies, [36] changing room men, [37] rest room/break room, [38] taxi, [39] WC, [40] exit, [41] exit left and [42] exit right

Pictograms in the library “Arrows”

The library “Arrows” contains 9 pictograms: 
[1] Arrow up right, [2] arrow down left, [3] arrow up left, [4] arrow down right, [5] arrow right, [6] arrow left, [7] arrow up, [8] arrow down and [9] directions

Typographical pictograms for classification of information

Pictograms can be in the colors black, white, Petrol and Light Grey, including their darker or lighter shades, as well as in the full-tone color Deep Red. In the case of pictograms that draw attention to a prohibition, the pictorial element is combined with a horizontal bar or a circle with horizontal bar in Signal Red. All arrows and figures have straight-cut ends, giving them a direct stylistic relationship with the corporate typefaceCorporate Typeface
The font with which a company or a brand identifies and presents itself externally and internally. ....

All Daimler pictograms are available as vector-based and freely scalable files in PDF and SVG format as well as a graphic in PNG file format.

Pictograms are based on the Daimler CS Demi font style.

Typographic pictograms are combined with a frame. The frame can also be in the form of a direction-indicating element with an arrowhead. Figures on pictograms have angular line ends and thus blend harmoniously into the overall appearance at the Daimler name-bearing subsidiaries. Figures are two-dimensional and can, if necessary, be combined with additional elements, such as a frame, arrow or typography.

Typographic pictograms are combined with a frame.

Figures are two-dimensional.

Pictograms can be combined into a single graphic to visualize complex set of interrelationships. The individual graphics are aligned proportionally to each other in accordance with the extended grid using the same scaling. For overlays, the distance between individual strokes should correspond to the major outline thickness. In order for the new composition to achieve a clearly recognizable impression, perspective distortions of the lines or changes to the geometric shape of the original files should be avoided.

Overlaps of separate pictograms are used with a same distance corresponding to the preset outline thickness.

For compositions made up of multiple pictograms, it is important to ensure uniform scaling and proportional alignment in the grid.

Corporate pictograms are used in printed media, face-to-face communication, infographics or on-screen presentations etc. as well as for directional and signposting systems.

Uniform line thicknesses and an angular style give a pictogram its character.

Infographics

When designing infographics, it important to make sure that the shape and text elements used create a harmonious overall impression.

Reduced illustrations without excessive levels of detail shall be used to design infographics.

The following questions should be answered before creating an infographic:

• What channels (web, print, blog, events etc.) are to be used to communicate the message? Cross-media use should also be taken into consideration.
• What kind of information (statistics, processes, chronologies, juxtapositions etc.) is involved? 
• What other elements (charts, diagrams, photos etc.) need to be shown, or can support the data and facts?

A distinction must be made between simple and complex information. As a general rule, complex relationships should be depicted in a way that is clear and understandable. The reader must be able to get to grips with the issues quickly.

Infographics with uniform designs ensure good recognition.

A combination of pictograms, illustrations, photos and text can be used to portray complex information and data in a way that is easy to understand using static or animated infographics. This means that an infographic can stand as content in its own right, or also displayed with complementary text in the context of an article.

Colors
Additionally, the expanded color palette is available for designing infographics. It is advisable to decide on a color scheme in advance. It has proved useful to design infographics using two or three colors that offer a great deal of contrast.

The expanded color range with lighter and darker shades may only be used for infographics.

If an infographic features shapes with strong colors on a light background, for example, attention is immediately drawn to the dominant colors. This allows information to be organized better, and a visual hierarchy is created. The expanded color range with lighter and darker shades of orange and green as well as the lighter shades of deep red may only be used for infographics. Transparent colored areas (with no outline) can also be used.

Typography
The standard font used is Daimler CS, with all font styles being available. No more than two or three font styles should generally be combined. Capital letters may be used for key words. A mixed style (capitals/lower case) is prescribed for headlines and longer texts.

Infographics must be structured in a way that is clear and understandable so that the observer can quickly get to grips with the topic.

Every infographic requires a header that is usually set in the largest font sizeFont Size
The unit of measurement for the font size is the point (pt). so that readers immediately register the topic. The header should be brief and informative, with the volume of text kept to a minimum. The best infographics have the biggest impact thanks to their appealing and convincing presentation.

Pictograms
If an infographic is mainly created using pictograms, these should always be kept in the same style in order to ensure uniformity and promote recognition. Because pictograms represent concrete items or circumstances, they must speak a clear and unambiguous language, and be both self-explanatory and internationally understandable.

The icons from Pictogram library are used. When creating new pictograms for items or circumstances that are not available, the design idiom and line widths of the existing pictograms must be used.

The design of infographics should be consistent, for example by using filled symbols instead of line drawings.

Graphical Elements
Within an infographic, a visual hierarchy should guide the observer through the diversity of information on display. If elements are sized randomly and differentiated using color for no apparent reason, the infographic’s message will be difficult to decipher. The design of infographics should be consistent, for example by using filled symbols instead of line drawings. This style should then be used for the entire topic. The same applies to the visual idiom used, the font styles and the selected combination of colors. This makes the infographic tidy and legible.

If pictograms are combined with photos, you should work with a colored space that covers no more than a third of the imageImage
The publicly perceived image of a company, brand, product or service. Determined primarily by ... format. The pictogramPictogram
A graphical figure with an internationally understandable meaning. can be depicted in Petrol or white depending on the contrast. Pictograms should always be combined with information text and not stand alone. Vertical, horizontal and diagonal lines can bring text and shapes together as a unit.

A combination of illustrations and text can be used to portray complex information and data in a way that is easy to understand using infographics.

If the infographic is overfilled with too many elements, this can overwhelm the reader and make it more difficult for them to receive and process information. Less is more!

Photos
If photos are integrated into infographics, only motifs with single-color backgrounds should be used. If multiple photos are used they should all have the same visual idiom. It is important to maintain a particular style. Photos that clearly do not fit into the set can distract from the information being conveyed.

Animation
Animations should be used prudently and sparingly. The timing of all elements should be coordinated to create a harmonious overall experience. Excessive animations can distract the observer from the actual message. The animation should be uniform and not overly hectic or choppy. It should feature soft transitions and smooth changes in what is being displayed.