Menu Search
Jump to the content X X
Smashing Conf New York

You know, we use ad-blockers as well. We gotta keep those servers running though. Did you know that we publish useful books and run friendly conferences — crafted for pros like yourself? E.g. our upcoming SmashingConf New York, dedicated to smart front-end techniques and design patterns.

19 Delightful Bits Of Vintage Graphic Design Inspiration

Vintage design is an endless source of inspiration. Seeing how fellow designers tackled their job decades ago, with a limited set of tools, and how timeless, even classic, some of the pieces are still today, is fascinating.

With this posting, we want to leave behind current trends and indulge in the aesthetic of past times. We’ll dive into wanderlust-awaking travel posters, design manuals that wrote history, and, last but not least, we’ll bridge the gap to today by looking at how a mid-century design movement still influences designers. Buckle up… and off we are to a journey through pre-Photoshop, pre-Sketch and -Illustrator times!

Further Reading on SmashingMag: Link

Designing Wanderlust Link

With the rise of passenger air travel, the world grew closer together. Once distant, unreachable places were suddenly within reach. And what could tell the story of excitement and adventure better than vibrant travel posters of the time?

In retrospect, our idea of the early days of travel are shaped by these posters. Depictions of exotic countries, famous landmarks, smiling flight attendants, happy passengers and proud pilots — that’s what traveling dreams were made of. But apart from these common stereotypes, there were also some timeless graphic design gems that are bound to fuel our ideas, and, well, wanderlust too, still today.

You’re up for some gold mining? Then Yulia Yudintseva’s immense collection of vintage airline posters4 is for you. The Travel Gear Reviews5 also showcases 100 vintage travel posters, not only flying-themed. And Galerie 123 (un deux trois)536 and Tamar Heller’s Pinterest board7 are rich sources for eye-candy, too.

These are just a few of our favorites:

vintage graphic design sample8

TWA poster by David Klein, 1950s/60s. (Image credit: Kirt Baab9)
Philippe Giegel poster for the Swiss Travel Office10

Ramble in Europe — Relax In Switzerland. Poster for the Swiss Travel Office, designed by Philippe Giegel, 1963. (Image credit: Galerie 123 (un deux trois)11)
A 1930’s travel poster for the Great Barrier Reef, designed by Gert Sellheim.12

A 1930’s travel poster for the Great Barrier Reef, designed by Gert Sellheim. (Image credit: Boston Public Library13)
French poster for the “South Star Cruises” from 1969, designed by type foundry Deberny & Peignot.

French poster for the “South Star Cruises” from 1969, designed by type foundry Deberny & Peignot. The image was originally created in 1934. (Image credit: Galerie 123 (un deux trois))
Roger Bezombes’ 1981 Air France poster is one in a 16-part series and marks Air France’s switch from promoting travel destinations to promoting concepts such as gastronomy or sophistication.

Roger Bezombes’ 1981 Air France poster is one of a 16-part series and marks Air France’s switch from promoting travel destinations to promoting concepts such as gastronomy or sophistication. (Image credit: Galerie 123 (un deux trois))
A photomontage by Carlo Vivarelli, daring back to 1952.

A photomontage by Carlo Vivarelli for Swissair, dating back to 1952. (Image credit: Galerie 123 (un deux trois))

At The Core Of The Design Link

Eye candy is great, but sometimes you just want to dig deeper. How did the generations of designers before us work? How did they tackle their projects? Nothing could help us get closer to the core of their designs as the graphic standards they designed for them. In fact, some design manuals from decades ago didn’t only simplify design work back in the days, some turned into sought-after classics and have gotten a second life with a reprint of the original, such as the graphics manual for New York City’s transit authority14 or the NASA’s graphics standards15.

A Face For New York City’s Subway Link

One of the most famous graphic standards dates back to 1970: Bob Noorda’s and Massimo Vignelli’s design manual for the New York City Transit Authority16. It specifies the visual language of NYC’s subway in every little detail. Bold typography set in Standard Medium, color-coded disks, and an elaborate grid system form the base of the system that guides millions of commuters and travelers through the buzzing underground catacombs of the metropolis each year. The level of detail of the design manual is fascinating. Apart from providing examples of ways to not use the symbols, it even specifies the spacing between every possible letter combination.

Noorda’s and Vignelli’s work has paid off: The essence of the system is still in use today, apart from some changes (Standard Medium was replaced by Helvetica, for example, the white background with black writing by a black background with white writing to make it less prone to graffiti). A stellar example of how a well-thought-out minimal system can be adapted to needs as complex as those of an entire city’s public transportation system. Modular design, the analog way, so to say.

Cover of the New York City Transit Authority Design Manual17
A page of the New York City Transit Authority Design Manual18

A peek inside the graphics manual that wrote history. It was dug up in the basement of design firm Pentagram in 2012. (Click images for larger views.) (Image credit: Jesse Reed and Hamish Smyth19)

The NASA Universe Link

The NASA Graphics Standards Manual from 1975 is another classic. It describes the radical, often-criticized but later award-winning design that shaped the NASA’s appearance until 1992. Designed by Richard Danne and Bruce Blackburn, the graphics manual evolved for one decade until it finally reached an impressive 90 pages covering every aspect of the space administration — from office forms to satellite markings. The core piece is the logotype that became widely known as the “worm” because of its one-width, continuous stroke letters.

To dive deeper into the NASA universe, check out the high-resolution scans that Jesse Reed and Hamish Smyth provide of each page of the graphics manual. Stunning.

A page from the NASA Graphics Manual depicting logo placement on space shuttle20
A page from the NASA Graphics Manual depicting logo placement on a satellite.21
A page from the NASA Graphics Manual depicting logo placement on uniforms for the fire department.22
A page from the NASA Graphics Manual depicting layout of signs.23

Space vehicles, uniforms for the fire department, general signage — Danne’s and Blackburn’s graphics standards manual was a mammoth project, covering even the smallest details of what the Space Administration was supposed to look like. (Click images for larger views.) (Image credit: Jesse Reed and Hamish Smyth)

Olympic Minimalism Link

Few designs gain as much attention as the ones that give the Olympic Games a new face every four years. One of the most memorable designs is certainly Georges Huel’s and Pierre-Yves Pelletier’s concept for the 1976 Montreal Olympics. Luckily for us, Antonio Carusone’s gallery on Flickr24 lets us indulge in its minimalistic and timeless beauty still today.

The core part of the Montreal design is the logo for the Games. As stated in the design manual, it represents the letter “M” for Montreal which doubles as a crown to represent victory (the three arches above the Olympic rings), the running track, and, of course, the Olympic rings. Apart from standards on using and constructing the symbol and how to combine it with the official logotype from the Univers family, the manual (a graphics manual is obligatory for the Olympics since the 1964 Tokio Games, by the way) also defines acceptable and unacceptable uses of color and grids for positioning. If you’re up for more Olympic design inspiration, Olympic Design25 features sneak peeks into the graphic standards of nearly all Games since 1964.

Cover of the Montreal Olympics Graphics Manual26
A page from the Montreal Olympics Graphics Manual about the design of the logo.27
A page from the Montreal Olympics Graphics Manual with standards on using the symbol with the logotype.28

A look inside the graphics manual for the 1976 Montreal Olympics. The core part of the concept is the logo that captures the essence of the Games on base of the Olympic rings. (Click images for larger views) (Image credit: Antonio Carusone29)

Revisiting A Classic Link

Every design is a child of its time, and graphic design in the 20th century wouldn’t have been the same without the influence of the International Typographic Style30. The Swiss design movement has its roots in the 1940s and 50s and its signature style shaped much of the development of graphic design in the mid of the past century. Simplicity, legibility, and objectivity were the leading principles, sans-serif typefaces, grids, asymmetrical layouts, and bright, solid colors characteristic for the style. Especially posters — an effective means of communication during that time — have stayed in the collective memory and do inspire designers still today.

Poster for the Auto Club of Switzerland stating “Protect the child!”. Designed by Josef Müller-Brockmann, one of the founding fathers of the Swiss Style, 1955.31

Poster for the Auto Club of Switzerland stating “Protect the child!”. Designed by Josef Müller-Brockmann, one of the founding fathers of the Swiss Style, 1955. (Image credit: Maryellen McFadden32)
Also from the mind of Josef Müller-Brockmann comes this 1955 Zürich Town Hall concert poster.33

Also from the mind of Josef Müller-Brockmann comes this 1955 Zürich Town Hall concert poster. (Image credit: Maryellen McFadden34)

Fast forward to today, Swiss in CSS35 by front-end designer Jon Yablonski is one of the projects that are inspired by the Swiss style. As an homage to the design movement and the designers behind it, Jon recreates and animates posters of the era — mostly of concerts and exhibitions — in CSS and JavaScript. The animations give the classic designs a new dynamic, even a bit of a retrofuturistic feel. And for anyone who wants to dive deeper into the tech behind the posters, Jon shares the code on CodePen. A beautiful blend of classic aesthetic and state-of-the art techniques.

Two examples from Jon Yablonski’s recreation of Swiss design classics with CSS.36

Jon Yablonski’s recreation of classic Swiss design with CSS37. Left: Inspired by the “Canadian Broadcasting Corp. Annual Report” by Burton Kramer, 1974. Right: Inspired by the 1958 “Musica Viva” poster by Josef Müller-Brockmann. (Image credit: Jon Yablonski38)

Swissted4239 is another contemporary project based on the Swiss aesthetic, combining graphic designer Mike Joyce’s passion for punk rock and Swiss modernism. An unusual, but very inspiring mix. The posters are all set in Berthold Akzidenz-Grotesk Medium and are redesigns of vintage punk, hardcore, new wave and indie rock show flyers. The collection currently counts 200 pieces and is still growing. Impressive.

Two Swiss style music posters40
Two Swiss style music posters41

Swissted4239 plays with type, direction, repetition and bold colors to combine Swiss Design and punk rock into beautiful works of art. (Image credit: Mike Joyce, Swissted43)

Now what will the designs of the past inspire you to?

More Vintage Eye-Candy Link

If the vintage graphics bug has caught you, check out the following resources for more inspiration. But be warned, browsing them could become quite addictive. Just sayin’.

Design Movements Link

Travel & Transport Link

Other Link

You’ve stumbled across some vintage design goodies recently? We’d love to hear about them! Please feel free to share your findings in the comments below.

Footnotes Link

  1. 1 https://www.smashingmagazine.com/2008/10/30-beautiful-vintageretro-photoshop-tutorials/
  2. 2 https://www.smashingmagazine.com/2009/06/60-rare-and-unusual-vintage-signs/
  3. 3 https://www.smashingmagazine.com/2008/10/26/retro-and-vintage-typography-showcase/
  4. 4 https://de.pinterest.com/yuyudik/air_poster/
  5. 5 http://www.thetravelgearreviews.com/25-vintage-travel-posters
  6. 6 http://www.galerie123.com/en/
  7. 7 https://de.pinterest.com/tamar1959/glorious-vintage-graphics-travel-posters-books-and/
  8. 8 https://www.flickr.com/photos/quesea/3637292150/in/photolist-6xq5eC-jpwZWc-6xq3Vj-pz94PF-m84DDJ-okeAeW-rPJLSG-cnKmCq-BsrpRq-8RSWm5-igeVho-cQAeRb-jCa4gA-pX3dwu-cQAf11-gcf4tJ-f5WvFj-pa8bDW-8TcJMC-c8R5pQ-7rTYb6-2gcR1t-dxvpCc-c146Lf-pGTjZL-ChnXzN-c146u1-cQAfQQ-cQAeWb-gX7jfu-c149Kh-pBcA8G-d553aS-eiv9o4-aUqkoe-8T9D6k-8T9D4i-e6nCL3-ebEQit-iQxMty-aiDczT-6FErts-fpiQ4c-a3wPtW-icPzET-dydZPd-dLY4jz-fGiFD2-cQAfC3-cQAf6Q
  9. 9 https://www.flickr.com/photos/quesea/3637292150/in/photolist-6xq5eC-jpwZWc-6xq3Vj-pz94PF-m84DDJ-okeAeW-rPJLSG-cnKmCq-BsrpRq-8RSWm5-igeVho-cQAeRb-jCa4gA-pX3dwu-cQAf11-gcf4tJ-f5WvFj-pa8bDW-8TcJMC-c8R5pQ-7rTYb6-2gcR1t-dxvpCc-c146Lf-pGTjZL-ChnXzN-c146u1-cQAfQQ-cQAeWb-gX7jfu-c149Kh-pBcA8G-d553aS-eiv9o4-aUqkoe-8T9D6k-8T9D4i-e6nCL3-ebEQit-iQxMty-aiDczT-6FErts-fpiQ4c-a3wPtW-icPzET-dydZPd-dLY4jz-fGiFD2-cQAfC3-cQAf6Q
  10. 10 http://www.galerie123.com
  11. 11 http://www.galerie123.com
  12. 12 https://www.flickr.com/photos/boston_public_library/3531511692
  13. 13 https://www.flickr.com/photos/boston_public_library/3531511692
  14. 14 https://standardsmanual.com/pages/original-nycta
  15. 15 https://standardsmanual.com/
  16. 16 https://standardsmanual.com/pages/original-nycta
  17. 17 https://www.smashingmagazine.com/wp-content/uploads/2016/04/nyc-transit-authority-manual-cover-opt.jpg
  18. 18 https://www.smashingmagazine.com/wp-content/uploads/2016/04/nyc-transit-authority-manual-signage-opt.jpg
  19. 19 https://standardsmanual.com/pages/original-nycta
  20. 20 https://www.smashingmagazine.com/wp-content/uploads/2016/04/nasa-graphics-standard-shuttle-opt.jpg
  21. 21 https://www.smashingmagazine.com/wp-content/uploads/2016/04/nasa-graphics-standard-space-station-opt.jpg
  22. 22 https://www.smashingmagazine.com/wp-content/uploads/2016/04/nasa-graphics-standard-clothes-opt.jpg
  23. 23 https://www.smashingmagazine.com/wp-content/uploads/2016/04/nasa-graphics-standard-signs-opt.jpg
  24. 24 https://www.flickr.com/photos/yearofthesheep/sets/72157627821634720
  25. 25 http://www.theolympicdesign.com/deu/olympic-collection/classification/design-manuals/
  26. 26 https://www.smashingmagazine.com/wp-content/uploads/2016/04/montral-olympics-cover-large-opt.jpg
  27. 27 https://www.smashingmagazine.com/wp-content/uploads/2016/04/montreal-olympics-logo-large-opt.jpg
  28. 28 https://www.smashingmagazine.com/wp-content/uploads/2016/04/montreal-olympics-logotype-large-opt.jpg
  29. 29 https://www.flickr.com/photos/yearofthesheep/sets/72157627821634720
  30. 30 http://www.designishistory.com/home/swiss/
  31. 31 https://www.flickr.com/photos/20745656@N00/4492390970/in/photolist-7QYFjJ-7QYHAh-7QV34K-7Rdx4n-7VS8bi-7SnLQh-7RuxKR-6obaiq-7TgF5S-7RuyL6-7Uowc8-7SiKCe-7SncBo-7SnfkA-7Tdjuc-7UrGhu-7UrJhA-7Uarem-7VVjhG-7VVr83-7TmuxF-7SjkQv-7UL3Z9-7QYjgh-7RdT6D-7VVui5-7QVrB6-7RuwVi-7TpUt9-7TpQmL-7ULkeQ-7TmFiD-7Uakod-7Uopcv-7UnHs8-7U7gJk-7RdFD4-7UnFf4-7VS9YM-7RgUzo-7QYoY1-7UKZs5-7SnjAs-7UqSTh-7UqMY9-7TgmJb-7QYvaj-kGRGxi-69CgF6-7Fh4tj
  32. 32 https://www.flickr.com/photos/20745656@N00/4492390970/in/photolist-7QYFjJ-7QYHAh-7QV34K-7Rdx4n-7VS8bi-7SnLQh-7RuxKR-6obaiq-7TgF5S-7RuyL6-7Uowc8-7SiKCe-7SncBo-7SnfkA-7Tdjuc-7UrGhu-7UrJhA-7Uarem-7VVjhG-7VVr83-7TmuxF-7SjkQv-7UL3Z9-7QYjgh-7RdT6D-7VVui5-7QVrB6-7RuwVi-7TpUt9-7TpQmL-7ULkeQ-7TmFiD-7Uakod-7Uopcv-7UnHs8-7U7gJk-7RdFD4-7UnFf4-7VS9YM-7RgUzo-7QYoY1-7UKZs5-7SnjAs-7UqSTh-7UqMY9-7TgmJb-7QYvaj-kGRGxi-69CgF6-7Fh4tj
  33. 33 https://www.flickr.com/photos/20745656@N00/4516395897/in/photolist-7VVr83-7TmuxF-7SjkQv-7UL3Z9-7QYjgh-7RdT6D-7VVui5-7QVrB6-7RuwVi-7TpUt9-7TpQmL-7ULkeQ-7TmFiD-7Uakod-7Uopcv-7UnHs8-7U7gJk-7RdFD4-7UnFf4-7VS9YM-7RgUzo-7QYoY1-7UKZs5-7SnjAs-7UqSTh-7UqMY9-7TgmJb-7QYvaj-kGRGxi-69CgF6-7Fh4tj-7UG7HF-6yekzT-7UH4uH-7T6H9M-6TQVxX-kCUVuB-7T9XWG-6odP5q-5fjdTD-6odPgC-6odNJw-6odNTm-6P7H6d-6P7Haf-aze2K5-6yekFt-9Rag7o-4B6CQP-4Gcvng
  34. 34 https://www.flickr.com/photos/20745656@N00/4516395897/in/photolist-7VVr83-7TmuxF-7SjkQv-7UL3Z9-7QYjgh-7RdT6D-7VVui5-7QVrB6-7RuwVi-7TpUt9-7TpQmL-7ULkeQ-7TmFiD-7Uakod-7Uopcv-7UnHs8-7U7gJk-7RdFD4-7UnFf4-7VS9YM-7RgUzo-7QYoY1-7UKZs5-7SnjAs-7UqSTh-7UqMY9-7TgmJb-7QYvaj-kGRGxi-69CgF6-7Fh4tj-7UG7HF-6yekzT-7UH4uH-7T6H9M-6TQVxX-kCUVuB-7T9XWG-6odP5q-5fjdTD-6odPgC-6odNJw-6odNTm-6P7H6d-6P7Haf-aze2K5-6yekFt-9Rag7o-4B6CQP-4Gcvng
  35. 35 http://swissincss.com/
  36. 36 http://swissincss.com/
  37. 37 http://swissincss.com/
  38. 38 http://swissincss.com/
  39. 39 http://www.swissted.com/
  40. 40 http://www.swissted.com/
  41. 41 http://www.swissted.com/
  42. 42 http://www.swissted.com/
  43. 43 http://www.swissted.com/
  44. 44 http://midcenturymoderndesign.tumblr.com/
  45. 45 https://www.flickr.com/groups/mid_century_modern_labels/pool/
  46. 46 http://happyeastern.tumblr.com/
  47. 47 https://www.flickr.com/photos/20745656@N00/sets/72157594296535170/
  48. 48 https://www.flickr.com/photos/sandiv999/sets/72157622505228065/with/4153992933/
  49. 49 http://vintagetravelposters.info/
  50. 50 http://vintagetravelart.tumblr.com/
  51. 51 https://www.flickr.com/groups/2148585@N23/pool/
  52. 52 https://www.flickr.com/groups/1018564@N25/pool/
  53. 53 http://www.galerie123.com/en/
  54. 54 http://letterlibrary.tumblr.com/
  55. 55 https://www.flickr.com/photos/mrmorodo/collections/72157628866082811/
  56. 56 https://de.pinterest.com/mirellabruno/vintage-graphic-design-loves/

↑ Back to top Tweet itShare on Facebook

Cosima has been an editor at SmashingMag since 2013. Whenever she's not writing articles for the bi-weekly Smashing Newsletter or the Quick Tips series, she’s probably working on a new Smashing eBook.

  1. 1

    An excellent article, thanks.

    Appreciate the links to help us delve deeper. I could read / look at / get lost in this stuff forever…

    1
  2. 2

    “good teacher teaches great teacher inspires” – it’s really true!!!
    thx for the article….!
    Two days ago I’ve done my project :)
    I had only 1 problem: I found only my home-printer :(
    but thx to Poster Printer (RonyaSoft), I’ve printed all my gigant works at home!!!!!
    I’m soooo glaaad!!! :) :) :)
    besides, who need url: http://www.ronyasoft.com/products/proposter/en/

    0
  3. 3

    Good article and nice visuals

    0

↑ Back to top