slide1 n.
Skip this Video
Loading SlideShow in 5 Seconds..
UNESCO Knowledge Portal Graphic Solutions PowerPoint Presentation
Download Presentation
UNESCO Knowledge Portal Graphic Solutions

UNESCO Knowledge Portal Graphic Solutions

303 Vues Download Presentation
Télécharger la présentation

UNESCO Knowledge Portal Graphic Solutions

- - - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript

  1. UNESCO Knowledge Portal Graphic Solutions

  2. UNESCO.ORG • UNESCO presence in the Internet facilitates consultation and access to information from all over the world.

  3. UNESCO.ORG • In many cases it is the only possible link between the user and the Organization.

  4. UNESCO.ORG • The visual identity of UNESCO in the web is crucial for users of many different backgrounds, ages, origins, cultures, education levels and structures: Institutions, organizations, corporations, professionals, individuals, as well as UNESCO staff and team collaborators.

  5. UNESCO.ORG • The UNESCO Portal is not only a vital working toolbut the immediate support of the visual identity of UNESCO.

  6. UNESCO.ORG • The UNESCO Portal should reflect the philosophy and the work of the Organization, as well as its structure and the linkages between the various sectors and departments.

  7. UNESCO.ORG • Most importantly, it should at all times respect the graphic codes regarding colour, shape, typography, layout, as well as show and promote creativity, diversity and the identity of its sectors, departments and services.

  8. Analysis and evaluation of the graphic solutions of the five Knowledge Subportals • The analysis of the knowledge subportals reveals a distinct intention of respecting common codes regarding visual identity, navigation structure and ergonomic solutions.

  9. Analysis and evaluation of the graphic solutions of the five Knowledge Subportals • Each supbportal has an individual graphic identity but similar structure regarding typography, access to information and links and positioning with regard to other subportals and services.

  10. Analysis and evaluation of the graphic solutions of the five Knowledge Subportals • Some of them omit aspects of UNESCO visual identity or use it in very different ways as far as shape, size or colour are concerned.

  11. Analysis and evaluation of the graphic solutions of the five Knowledge Subportals • Basically, this reflects an extremely rapid growth in a new medium such as Internet, as well as the lack of standards requiring graphic consistency.

  12. Analysis and evaluation of the graphic solutions of the five Knowledge Subportals • In many instances there is a lack of relationship and links between departments, which leads to duplication of information, creates confusion and hampers user´s access to information.

  13. Analysis and evaluation of the graphic solutions of the five Knowledge Subportals • In many instances as well, documents are not tailored to the web, which means an excess of information in some cases and insufficient information in others.

  14. Analysis and evaluation of the graphic solutions of the five Knowledge Subportals • The use of the delta in its different versions as an identification banner of the site, the position of icons and common elements give us hints to the development of a common portal which identifies a compact organization working in different fields as Education, Natural Sciences, Social Sciences, Culture, Communication & Information, each keeping its own identity but with common elements within the Organization.

  15. Education • The banner is dominated by black and white portraits with a subtle coloration which is an elegant allusion to diversity.

  16. Education • The overall page is dominated by a white background, common to the thematic menu on the left, the central or contents portion and the menu on the right, as well as the top portion, containing the UNESCO logo, the banner, the title and the language options. This gives good consistency to all site areas and an overall cleanliness to the window to diversity.

  17. Education • Nevertheless, the absence of differentiating elements to isolate each area, e.g. by colour bands or blocks, or by horizontal or vertical lines gives the same priority at the same time to all areas of information.

  18. Education • The right menu shows a relative richness of colour and illustrations which could divert the user´s attention from the other areas.

  19. Education • The left menu shows a nice graphic detail in different colours but a suggested pale grey background is covered by the white background of each title.

  20. Natural Sciences • The top area contains several thematic images, one of them highlighted. This is a good way to focus attention on particular issues.

  21. Natural Sciences • The blue and yellow of the delta strokes are repeated as the colour code in the rest of the window. Blue is used in the thematic areas on the left side and yellow for resources and events on the right side.

  22. Natural Sciences • These menus are delimitated by blue vertical lines which separate them visually from the central contents area. The icon menu and the central headings are separated by blue horizontal lines.

  23. Natural Sciences • This set of lines gives structure to the different areas of the page in the traditional layout used in newspapers to differentiate columns and articles.

  24. Natural Sciences • The abundance of information contained in the central area makes it an excessively long page.

  25. Natural Sciences • The amount of images, logos and photographs is adequate for easy downloading and gives a clean look and ease of navigation.

  26. Social Sciences • This subportal has a different visual structure. There is a fixed resources menu on the right and the central section is actually divided in two, so there are four vertical columns.

  27. Social Sciences • The excellent graphic solution of the banner which extends downwards and to the left, beyond the delta, contains close-up portraits of a girl, a man and a woman in which the most important features are the eyes.

  28. Social Sciences • The titles use a strong, narrow typography over colour bands which reinforce the structure and the different sections.

  29. Social Sciences • The adequate amount of information, condensed in single sentences, is a good introduction for the related links. The colour blocks, in subtle shades of grey and ivory, separate well the different areas (resources, features, themes, news…).

  30. Social Sciences • The subportal has a strong design and a marked “journalistic style”. As far as the visual identity is concerned, it is the only subportal in which the UNESCO logo is used in black on an ochre background.

  31. Culture • This is the only subportal not using an image for the banner but the logo of the sector, the word “culture”, in a large size.

  32. Culture • The layout of the portal focuses on the left-hand menu, consisting of bright coloured bands and titles in negative on the bands.

  33. Culture • Blue dominates the page; it is used for the typography of the titles and for the UNESCO logo

  34. Culture • This subportal also carries an excess of information in the news section, in the center area.

  35. Culture • An avantgarde typography has been chosen for headings, slogans and logo.

  36. Culture • The right-hand menu, features and resources, appears in a blue margin box on a white background.

  37. Culture • The use of square shaped images, all in the same small size, unifies the whole layout; the images serve as icons which can be used to access information.

  38. Communication & Information • The banner consists of a single image which fades into the white background in a geometrical pattern.

  39. Communication & Information • With a red dominant, this subportal has a structure in which once again the different areas of the window are defined by subtle shades of grey and red.

  40. Communication & Information • The menus appear on the left hand side and the news content on the right.

  41. Communication & Information • Just as in the Culture subportal, here the equal size of the images unifies the look. News items are separated with dotted lines and each one carries a square image and a small “more” icon which leads to complete information.

  42. Communication & Information • Emphasizing the red dominant, the UNESCO logo is used in white against a red background.

  43. Communication & Information • The typographical and cromatic sharpness and the graphical simplicity gives great fluidity and ease of navigation and makes information very readable.

  44. Looking for consistencyGraphic and ergonomical solutions • The study of the subportals shows that all have a similar structure and organization of information, with similar navigation hierarchy and ergonomy, but without graphical consistency.

  45. Looking for consistencyGraphic and ergonomical solutions • Building on the experience and the positive features of each one of the subportals and respecting their design, elements and chromatic diversity, we propose their unification through graphical codes which take into account the original features of each subportal and respect the graphical identity of UNESCO.

  46. Looking for consistencyGraphic and ergonomical solutions • With the constant position of their elements, a single structure, typographical consistency, geometrical construction and hierarchy of headings, we propose making navigation easier and establishing a single portal.

  47. Looking for consistencyGraphic and ergonomical solutions • The main concept is that UNESCO.ORG should be the only portal which opens the different doors of knowledge to its users, and the common link between the different knowledge sectors.

  48. Principlesfor the design of the single Portal

  49. Principlesfor the design of the single Portal • Top strip • Rapid access menu to Organization, the five Knowledge Subportals and Sitemap and Services. On a dark grey background, a small band (23 pixels high) with text in negative.

  50. Principlesfor the design of the single Portal Delta • Consists of an oblique stroke (arc of a circle) and a pale grey horizontal strip (23 pixels high) which defines four areas: •  Main image of the page •  UNESCO logo •  Language choice area •  Page contents