The Smashing Book

In summary the book is about everything you need to know to create websites, from design, typography, layout, color usage, interface design, coding, branding, web-development and much much more. At the end of the book is an interesting topic; Learning from experts, which includes interviews and insights on common topics when designing and creating websites. The last chapter is the Smashing Magazine Story, Sven Lennartz and Vitaly Friedman go deeper into how Smashing started and where it is today and in the future.

The first pages show the table of contents which is a bit to short for me, headlines only. What interests me is what I can learn at the chapters of the book. If I want to use this book as reference guide when working on a project I quickly need to find the information and how I can learn from that. Here’s mine interpretation of what you will learn from The Smashing Book.

1. User interface design in modern web applications

Dmitry Fadeyev talks about the theory as well as the practical techniques involved in visual interface design, starting with the basics characteristics of interface design to how information is adapted combined with many examples.

2. The art and science of CSS-Layouts

Jacob Gube and Kayla Knight go deeper into the need and basics designing websites in CSS layouts. They discuss four types of layouts: fixed-width, fluid, elastic and hybrid, all accompanied by examples and DIY CSS code. In conclusion they give well advise on what to choose for your next web design.

3.(Web) Typography: Rules, guidelines and common mistakes

This chapter describes methods and techniques for typography on the web and what characteristics are best practice for (large) content websites in readability, line length and line height as well as a short typographical terms index. The chapter goes deeper into the balance in typography within design, placement and legibility, with examples and most popular typefaces available. Further on in this chapter the authors Alessandro Catteneo, Yves Peters and Jon Tan talks about text replacement techniques and how that can benefit your design. Great read!

4. Usability principles for Modern Websites

Andrew Maier and David Leggett takes it deeper into the principles of an usable website design by setting out the characteristics on what is important and to whom it concerns. This chapter is accompanied by many examples and practical tips to create an usable website design.

5. The ultimate guide to fantastic color usage in web design, usability and experience

What an enormous title Darius A Monsef IV came up with, anyway this chapter tells you about color in web design. This chapter is full of examples and color wheels but it is not really learning you anything about color or how to use color wheels in website design.

6. Performance optimization for websites

Rene Schmidt tells about techniques on how to improve the website performance with short and practical examples. A bit too technical for me.

7. Design to sell, increasing conversion rates

Dmitry Fadeyev wrote this great chapter on focus and placement. With practical tips the author talks about the AIDA sales funnel and how to get website visitors into buying something from your website.

8. How to turn a site into a remarkable brand

Chris Spooner takes it step by step in how to create a website that sticks… With many examples and principles this chapter tells you how to create your own brand.

Learning from the experts: Interviews and Insights

Steven Snell got together with over 20 expert designers and developers to share their knowledge and philosophy in design topics. The panel discusses the following topics design & development, the design process, self improvement and skill development and business and freelancing. A true gem of the Smashingbook where designers give their opinion and practical tips on the process. Everything wrote in a very accessible way. #mustread

Behind the curtains: The Smashing Magazine Story

The last chapter is devoted to the Smashing Story, Sven Lennartz and Vitaly Friedman talks about the start up of The Smashing Magazine and how everything evolved to where SM is today.

Book vs online

The Smashing Magazine (online) is a great resource of information when you are into learning design, typography and inspiration. The book is a reflection of the online information but more in an educational manner and you will pick up the book more likely to learn something and use it effectively. With online media you quickly scan the pages and move on, therefore I believe the book will be a huge improvement for spreading knowledge and will become a springboard for those who are interested in this field.

I hope SM will continue to publish the great online content and start series of Smashing books with practical learning content.

Hardware quality and size of the book

After two weeks of intense reading the Smashingbook seems to fall apart, the binder is very though, this makes it hard to open pages and lay the book beside the computer to type in the example code or check a reference online. To my opinion the book is a bit too small for its content, great content but it doesn’t read very easy. I would suggest for future books to use a larger book size, less pages and more white space on the pages.

Conclusion

The Smashing Book is a great, really great book for everybody who is interested in design and web-development. Especially the typography and learning from the experts chapters where inspirational resources to me. The content is great but I believe the layout of the pages should be as a book. Support the Smashing Magazine Book by ordering your copy and I hope SM will continue the concept of bringing the content by book.

Availability of The Smashing Book

Currently the Smashing Book is available through the SM website shop for $29,90 or €23,90 and payment is processed with many available options such as creditcard and paypal.

• Specifications: size 210 x 140 mm, full color high quality, 311 pages, published by Smashing Media GmbH, Lübeck Germany 2009
• Get the SM Book here: The Smashing Book is released: Buy Now!

Did you buy they book, please share your opinion about the Smashing Book in the comments, thank you in advance!

Symbol Signs

In this free collection I have added common used symbol signs for public services such as Toilets, Telephone, First Aid, Elevator, Information, Restaurant, Coffee Shop, Smoking, Baby, Recycle Icon, Shower, Reception desk, Arrows collection and much, much more.

The symbol signs can be used for signage & wayfinding projects. The complete symbol collection is optimized for reproduction methods such as engraving, laser engraving/cutting, screen printing and self adhesive film to manufacture the signs you need.

Toilet symbol signs

The symbol signs have been designed for good readability and functionality, when installing the typeface into your computer the typeface symbol signs is added to your system, I have set the icons to match the most common letters for the symbols, for example F = female, M = male, d = disabled, L = arrow left, R = arrow right, U = arrow up, D = arrow down, and so on. This allows you to quickly add the symbol sign you need.

Example symbol signs with text in grid design

This is a sample grid design using Museo Sans 500 by Jos Buivenga and the symbol signs collection, both work really well for signage purposes. Next articles will include a free complete design template for hotel signage and wayfinding, examples of signs and articles on how to create signs using a grid based design and Indesign. If you want to recieve these articles please subscribe to the free RSS feed.

Detailed information, terms of use

• Collection of 50 common used symbol signs
• Professional designed by Sander Baumann, copyright 2009
• For personal and/or commercial signage & wayfinding design
• Released under Creative Commons Attribution 3.0
• Free available as OpenType font
• You expressly agree that any use of the symbol signs collections is entirely at your own risk

Download Symbol Signs Collection

Download Symbol Signs as OpenType

A manual for students, teachers, professionals, and clients.

This is exactly what this book is about, easy readable and recognizable for everybody to read and learn wayfinding design. I have read this book with great pleasure and using it as a reference manual in my daily activities.

Information Design for Public Places

In the first chapter the book describes the history of wayfinding and the spectrum of projects, which you will learn about the different areas wayfinding designers work in. There are several great examples of wayfinding projects shown and Gibson takes it deeper into the structure of projects and where the wayfinding designers fits in. Every chapter features a page written by people from the industry, making this book great fun to read and you will get different perspectives on the topics.

Design Process

As wayfinding designer there are many different kind of signs needed in a project, from small toilet signs to large boxed letters on the roof of the building. To enhance the wayfinding system all signs need to interact which each other in order to let them work together effectively. The book describes many different type of signs and explains about strategic planning and information graphic design. With several examples on how to document a wayfinding system this part really stands out in the book.

Wayfinding design

In the section wayfinding design, Gibson talks about typography, layout, symbols, color, materials and media. This section is a great learning experience to create signage & wayfinding design. With an very interesting page from Jonathan Hoefler on type design, legibility, purpose and wayfinding design these chapters will make you want to create wayfinding design!

Practical tips

The last section of the book takes you into how wayfinding projects are initiated and what the requirements should be in order to select a wayfinding designer. I especially enjoyed the part about documentation and fabrication, one of the most essential parts of creating a good manual for a wayfinding project.

Conclusion

Personally I enjoyed reading this book very much, it is easy to read, recognizable, short stories but with an edge to keep it clean and simple. Each chapter starts with a small introduction and a line about Learn About, where you quickly see what to expect from this section in the book. As said above the different insights from other people in the industry makes this book a great reference guide into wayfinding design. What I love about this book that it is written for everybody. If you are into environmental graphic design, signage/wayfinding than this is the book for you!

The Wayfinding Handbook is a complete guide to the discipline, from planning and design to practical considerations, such as setting up teams and managing projects.

Availability

• TwoTwelve started a minisite about the book The Wayfinding Handbook
• Get the book The Wayfinding Book at Amazon
• Interesting interview with David Gibson about wayfinding and the book at BusinessWeek.
• Special page at Facebook.
• Website of TwoTwelve.

Details of The Wayfinding Book
Price $24.95
ISBN 9781568987699
7 x 8.5 inches (17.8 x 21.6 cm), Paperback, 152 pages
265 color illustrations; 5 b/w illustrations
In print (publication date 3/1/2009)
A Princeton Architectural Press publication

I can only guess about the reason why architects make so little use of typhographical elements on their buildings. The main reason will be that the building design doesn’t need it. Most buildings can make their function clear without the use of signage on the façade. As you will find on the buildings listed below, architects used the signage to show the name of the building to the world; there is no building to be found with its function printed on it. The function is supposed to be clear.

A famous architect once stated: ‘form follows function’. That’s why you know what the particular function of a building is. Architects follow their mantra.

Café de Unie (The Union), Rotterdam, The Netherlands

One of the first uses of typographic lettering in architecture is the façade of the café ‘De Unie’. This building was completed in 1925, and has the looks of a Mondriaan painting. From the outside the building looks very much like the front cover of the design magazine ‘De Stijl’ (The Style). This similarity is no coincidence; the architect was a member of the Style movement. Members from various disciplines, like architects, graphic designers and interior designers had a strong influence on each other.

You can find this building near Rotterdam central station. It was destroyed during the second world war and has been rebuild in 1985, 500 meters from its original place.

Bauhaus, Dessau, Germany

At art school, everyone learns about Walter Gropius and his Bauhaus movement. The Bauhaus has been very influential in architecture and other disciplines of art. This modernist building was build in 1926 and has a beautiful lettering on its front façade.

Seattle Art Museum, U.S.A.

In 1991, Pritzker Prize winner Robert Venturi designed the Seattle art museum. To make sure no other use will ever be made of the building, ‘Seattle Art Museum’ has been carved into the front façade.

Minnaert building, Utrecht University, The Netherlands

The Minnaert building on the campus of Utrecht University has been named after the Belgian astronomer Marcel Minnaert. The architectural firm Neutelings Rietdijk has made very original use of huge letters to give the building its name. The columns that carry the upper levels are integrated within the letters.

Library of Alexandria, Egypt

Snøhetta is a Norwegian architectural firm with a very beautiful website. The buildings they design are fine too. Take for example the library in Alexandria, a huge cylinder covered with concrete plating. On those plates you can see all kinds of typographical elements in non western languages, mostly hieroglyphs.

Terror Háza múzeum / House of Terror museum

House of Terror is a museum located at Andrássy út 60 in Budapest, Hungary. Designed by architects János Sándor and Kálmán Újszászy.

The reconstruction turned the exterior of the building into somewhat of a monument; the black exterior structure (consisting of the decorative entablature, the blade walls, and the granite sidewalk) provides a frame for the museum, making it stand out in sharp contrast to the other buildings on Andrássy Avenue. Wikipedia.

City Museum Melbourne, Australia

Designed by Garry Emery, Mark Janetzki and Ben Kluger for the City Museum Melbourne. This large folded monumental sign draws the attention to the museum and gives direction to the entrance.

Eureka Tower Carpark

Also designed by the Emery Studio Melbourne, big painted letters on the walls and floor, looking directly the letters are distored but standing in a right position the letters can be read perfectly. Fabulously done artwork by Axel Peemoeller.

LAX

One of the large LAX signs that greet visitors to Los Angeles International Airport. This sign is at the Century Boulevard entrance to the airport.

Art school made me do this

A fun project by Rutger de vries (Perongeluk) who used this old building to express his design ideas. It was doomed to demolition, the former nursing home in Utrecht (The Netherlands). After the elderly residents had been relocated, it had served as a student residence for another six years, but now it stood empty. Rutger de Vries says:  “My work is transitory in nature; in fact I prefer to present it in places that have almost ceased to exist, where it can contrast with the setting”.

You.

Can you name a building where the designer made good use of typographic elements? Let me know by adding a comment!

This is a guest post by Frank van Leersum, a Dutch student architecture who likes to write about architecture and books. Visit his Dutch weblog Aureon or follow him on twitter.

Contrast between the foreground and background is one of the most important factors for the ease of reading. If coloured text is used on a bright background the contrast will be weak, for optimal contrast results is white text against dark colored backgrounds. In signage & wayfinding design color is the combining factor to harmonize the sign with the environment. Color programs will distinguish signs from each other and can offer an indication of the message without having to be able to understand the language of the sign.

Basics of color groups: Color wheel

Swiss painter and designer Johannes Itten created a color wheel that is a organization of 12 color hues around in a circle showing relationships between the colors. The colors are presented in the following way:

• Primary colors: Blue, red & yellow
• Secondary colors: Green, orange & violet
• Complementary colors: Red–orange, red–violet, yellow–orange, yellow–green, blue–violet & blue–green.

Most color wheels are based on Goethe’s Theory of Colours, the first systematic study of the physiological effects of color (1810). His observations on the effect of opposed colors led him to a symmetric arrangement of his color wheel, “for the colours diametrically opposed to each other… are those which reciprocally evoke each other in the eye.” (via wikipedia)

The color wheel can be a basis for the color scheme for the design you are about to create. Using the wheel you can easily find the combinations between the colors and see what works best. See the opposite colors and combine the colors into a signage color scheme.

Meaning of color

• Black is not actually a color but is often used as background surface in sign design, black can offer a attraction in a visual crowed environment. Meaning of black: Black is associated with power, elegance, formality, death, evil, and mystery.
• White as background surface has the ability to absorb dark lettering into its surroundings, in order to make white work good in sign design use a matted surface with glossy lettering. Meaning of white: White is associated with light, goodness, innocence, purity, and virginity. It is considered to be the color of perfection.
• Red is a signal color, as background red is mostly used for warning signs. Meaning of red: Red is the color of fire and blood, so it is associated with energy, war, danger, strength, power, determination as well as passion, desire, and love.
• Yellow in sign design is used as background, yellow has a function of sending out a message and works good in a spacial environment, it stands out. Meaning of yellow: Yellow is the color of sunshine. It’s associated with joy, happiness, intellect, and energy.
• Blue is one of mankind favourite color, but for design blue will not always have the best results, try using various hues of blue to find the best matching results. Meaning of blue: Blue is the color of the sky and sea. It is often associated with depth and stability. It symbolizes trust, loyalty, wisdom, confidence, intelligence, faith, truth, and heaven.
• Resource the meaning of color further on this page.

Black background

In sign & wayfinding design contrast will let you read the signs at ease. Below you will find various examples of good and bad contrast in order to make the design work.

With a black background the lettering tends to stand out more onto to background than with other colored backgrounds. Black is one of the few surfaces that lets other colored text work great together. Beware of too small lettering with too high contrast (white lettering), these will lead to less legibility of the text because of overwhelming background. With large lettering white on black works great. Also yellow on black is a good combination.

Advisable work areas: Airport signage, office building signs, visual overwhelming environments, hotel signage, indoor usage.

White background

White background surface gives the most workable combinations, but beware of that white can absorb its environment. Black lettering tends to be squeezed into the background making it hard to read. Lower contrast lettering gives better results like blue, orange and red.

White backgrounds can be used specific sign projects where design plays a bigger part than the actual wayfinding. For instance using silver lettering on a white background can give fabulous results, due the shadow of the silver lettering the text becomes readable on the white surface.

Advisable work areas: Museum signage, office building signs, pylon signage, retail signage, hospital signage, indoor & outdoor usage.

Yellow background

Yellow background works best in visual crowded environments, for architectural and psychological factors yellow is often used. Yellow with black lettering sends out a clear information message which is needed in such an environment. Using yellow also makes in easy to use orange, red and green which all work great together in a signage system.

Yellow is a much used background color for airport signage, originally started by Paul Mijksenaar for Schiphol Airport signage, nowadays yellow is seen in many airports around the world. Yellow in combination with black lettering gives ease to read and at the same time a clear information message in its surroundings.

Also for traffic signs yellow works good as background color in combination with black lettering. In a outdoor situation, yellow stands out from its background giving a clear message. In many European countries yellow is chosen as background color.

Advisable work areas: Airport signage, road signs, public spaces, indoor & outdoor usage.

Red background

Red is often used for warning signs, red sends out a signal of warning, danger. Many of the warning signs consist of a red background with yellow or white lettering, by using pictograms as warning the signs are multi-language and don’t need explanation, even if you cannot read the text.

Red is a very powerful color which stands out in a visual crowded environment. I have seen various other signs produced with red but in my opinion red is a signal color. Works great with black, white and yellow lettering.

Advisable work areas: Warning signs, public spaces, indoor & outdoor usage.

Blue background

Blue is one of mankind favourite color, as is represents sky, heaven, trust and faith. The color blue is good recognized with white lettering as information sign. In the Netherlands all highway signs are with blue background as well as the railway signs.

To use blue in sign systems beware of create enough contrast in order to make the signs work best. For instance with light blue a higher contrast lettering will be needed such as black and for dark blue white lettering will work best.

Advisable work areas: Highway signs, railway signs, hotel signage, retail signage, public spaces, indoor & outdoor usage.

Purple background

Purple will not be your direct usage of background color for signage color systems, but purple is a fashion color which is asked by clients to use. Purple works great with lighter colored lettering such as white or yellow.

Purple can be used in signage systems but beware of its architectural environment, as purple is a very powerful color it can easily fade into the background making the sign unreadable.

Use the color wheel to create the hue of colors around the color purple. Purple represents royalty and spirituality, it was Pantones color of the year 2008. PANTONE® 18–3943 BLUE IRIS.

Advisable work areas: Museum signage, hotel signage, retail signage, indoor usage.

Silver (brushed) background

Silver (metal) is an often used color as background in sign systems. With metal signs you are able to gain a robust look & feel for the signage system. Metal has a different surface when looking at it from different angles, making it not always a good contrast with the lettering.

On a silver background almost all colors work well, even white. In future articles I will go deeper into using silver as background.

Metal signs are frequently used in office signage, with black lettering it will create a very stylish look and feel.

Advisable work areas: Office signage, nameplate design, public spaces, indoor & outdoor usage.

Typography & color contrast

Not only is the contrast important also the chosen typeface will make the difference in a good or bad sign. When using too bold weighted typefaces the text will look like its expanding of the sign, when using too light weighted typefaces the text will fall back into its background. Medium or Regular weights are usually the best options to choose for a good and readable sign.

Please share your thoughts

What do you find the most attractive/readable colored background?
Looking forward discussing about colors & signs! Thank you in advance.

Detail metal pylon signage

The original brief from the client/architect was to create a architectural pylon which will draw attraction in a corporate way, to have a directional function and space for various logos and of text. In a short meeting we all agreed on the materials; metal and the design brief was created as following:

• Metal (raw) materials
• Illuminiated Signs
• Full color usage of logo
• Clear direction to the office buildings and streetnames should be on the signs
• Corporate design
• Accesable from both sides
• Readable from a distance

First sketches

For all my design work I use Adobe Illustrator CS3, I have worked with Illustrator since version 8 and it allows me to quickly create results in 2D and 3D. Within the first series of drawings various variations of a pencil were made because of the main rental company in these office buildings is Staples. Soon we discoverd that pencils (or parts of them) where not working as a signage landmark. After creating several more designs the image as shown above became the final design. From there on I started working on the build of the metal plyon design with the following demands:

• The concrete foundatation may not be visible
• The electricity should be connected from the ground and not visible
• Illuminated elements should be easily replaced and should have a high preformance lighting
• Stainless steel parts from the landmark should be easily replaced with damage
• Strong steel casing and vandal-resistant

The Build

From several 3D angles the pylon signage was drawn and the internal elements were designed, I have had close contact with the client/architect and constructor to enhance all features and make no or litte design changes from the final design. After all details and the steel casing was drawn, everything was send to a construction ingenieur party to check if my calculations are according standards. When everything was approved and the placing request was granted  from the commune, the build could be started. For all visual metal elements we used the material metal Stainless Steel Aisi 316 K320. In inside steel casing was made of square pipelines welled together and powder coated to reduce corrosion on the several parts.

Illuminated signs

The pylon signage should be readable from a distance and the client requested to add the logo to the signs, this increases the recognizability of the companies in the office buildings. To create a unique look and feel to the landmark I added detail to the illuminated signs by a small stainless steel square border and let the plexiglas plate fall back a little, which will draw the attention by the detail. In inside illuminated equipment consits of a single TL-element mounted at the top of the sign, packed in a U-shape element the light is directed downwards. With a bend mirror-plexiglas the light is transported towards the plexiglas plate, allowing a high reflect diffus (white) effect. By using these elements not only you will get a high performance illuminiated sign but also reduce the costs of using just one TL-element. We have used white satin opaal plexiglas plates for a non-reflecting surface.

Installing the Pylon Signage

At the location where the landmark was being placed a concrete plate was placed with a diamater of 2 x 2 meters weighing over 1600 KG. In this concrete plate several steel bolds where mounted with a chemical brace. The landmark was then placed onto the bolds using a lifting element placed on top of the landmark. All the stones where placed back into position and the ground and the illuminated signs where placed into the fittings in the pylon.

Final results

Our company very much enjoyed this project and we would like to thank the architect and all parties involved. Let me know what you think of this stainless steel landmark?

Designers Quotes

Architecture design quotes

• Organic architecture seeks superior sense of use and a finer sense of comfort, expressed in organic simplicity. Frank Lloyd Wright
• I’ve always believed that architecture is more important than decoration. Scale and proportion give everlasting satisfaction that cannot be achieved by only icing the cake. Billy Baldwin

Design Philosophy

• Design is in everything we make, but it’s also between those things. It’s a mix of craft, science, storytelling, propaganda, and philosophy. Erik Adigard
• Design is a plan for arranging elements in such a way as best to accomplish a particular purpose. Charles Eames
• Design’s fundamental role is problem solver. Fast Company, 2005
• Good design, at least part of the time, includes the criterion of being direct in relation to the problem at hand — not obscure, trendy, or stylish. A new language, visual or verbal, must be couched in a language that is already understood. Ivan Chermayeff
• Good design is the most important way to differentiate ourselves from our competitors. Samsung CEO Yun Jong Yong, 2004
• Graphics is the visual means of resolving logical problems. Bertin
• A design isn’t finished until somebody is using it. Brenda Laurel
• Intelligent design itself does not have any content. George Gilder

Branding

• Brand value is very much like an onion. It has layers and a core. The core is the user who will stick with you until the very end. Edwin Artzt
• Design is not just what it looks like and feels like. Design is how it works. Steve Jobs, 2003
• A logo is not a brand. The BrandGap
• You are what you are seen to be. Erik Spiekermann
• [logos are a] graphic extension of the internal realities of a company. Saul Bass
• Accessible design is good design. Steve Ballmer

Business

• If you think it’s expensive to hire a professional to do the job, wait until you hire an amateur. Red Adair
• Sometimes there is simply no need to be either clever or original. Ivan Chermayeff
• Invention is 10% inspiration and 90% perspiration. Thomas Edison
• I don’t design clothes, I design dreams. Ralph Lauren

Typography

• Typography at its best is a visual form of language linking timelessness and time. Robert Bringhurst
• Most people think typography is about fonts. Most designers think typography is about fonts. Typography is more than that, it’s expressing language through type. Placement, composition, typechoice. Mark Boulton
• Writing is not a series of strokes, but space, divided into characteristic shapes by strokes. Gerrit Noordzij, 1931
• From all these experiences the most important thing I have learned is that legibility and beauty stand close together and that type design, in its restraint, should be only felt but not perceived by the reader. Adrian Frutiger
• Faces of type are like men’s faces. They have their own expression; their complexion and peculiar twists and turns of line identify them immediately to friends, to whom each is full of identity. J.L. Frazier
• Great typophile thread with many more typographical quotes.

Favourite designers quotes from fellow bloggers

I have contact various authors from design blogs and asked them their favourite designers quote, this came out as a very positive and inspiring design quotes. Thank you for participating!

Jin Y from design & inspiration blog 8164.org send in the following quote:
• Form follows function-that has been misunderstood. Form and function should be one, joined in a spiritual union. Frank Lloyd

Comment by Jin Y: I’ve been a long time admirer of Mr. Wright’s work. His designs are elegant, simplistic and comfortable. As a web designer, I often see the correlations between good architecture design and good web design. Both have the elements of form and function. I often hear people talk about form and function as if they were mutually exclusive, or one precedes the other.

---

Dmitry Fadeev from Usabilitypost send me the following quotes:
• The two most important tools an architect has are the eraser in the drawing room and the sledge hammer on the construction site.” Frank Lloyd Wright
• To design something really well you have to get it. You have to really grok what it’s all about. It takes a passionate commitment to thoroughly understand something — chew it up, not just quickly swallow it .. .. A lot of people in our industry haven’t had very diverse experiences. They don’t have enough dots to connect, and they end up with very linear solutions, without a broad perspective on the problem. The broader one’s understanding of the human experience, the better designs we will have. Steve Jobs, Wired (March, 1996)

---

David Airey from LogoDesignLove and David Airey send in the following quote:
• The real issue is not talent as an independent element, but talent in relationship to will, desire, and persistence. Talent without these things vanishes and even modest talent with those characteristics grows. Milton Glaser

---

Dan Reynolds from TypeOff send in the following quotes:
• “Schrift ist nicht alles, denn Schrift ohne Anwendung ist wie eine Blume ohne Duft, ist wie eine ungekorkte Flasche und ein ungeküßtes Mädchen.” This could probably be translated as, “type is not everything, because type without an application is like a flower without aroma, an uncorked bottle and a girl who has never been kissed.” Günter Gerhard Lange (1996)
• “To be blunt, and it is good advice to serious newcomers: do not make the mistake of being afraid to be labelled ‘conventional’, ‘traditional’, or any other such dusty term.” Fred Smeijers, from Type Now: A Manifesto (2004)

---

LaurenMarie from CreativeCurio send in the following quotes:
• Design is the method of putting form and content together. Design, just as art, has multiple definitions; there is no single definition. Design can be art. Design can be aesthetics. Design is so simple, that’s why it is so complicated. Paul Rand
• I am always doing that which I cannot do, in order that I may learn how to do it. Pablo Picasso
• Don’t worry about people stealing your ideas. If your ideas are any good, you’ll have to ram them down people’s throats. Howard Aiken (not a designer, but rather the main guy behind IBM’s Harvard Mark I computer. Still, this could apply to design!)

---

Leon Paternoster, a teacher, designer and blogger send in the following quotes:
• Good design, at least part of the time, includes the criterion of being direct in relation to the problem at hand — not obscure, trendy, or stylish. A new language, visual or verbal, must be couched in a language that is already understood. Ivan Chermayeff
• Colour does not add a pleasant quality to design — it reinforces it. Pierre Bonnard
• Communicative grammar is generally defined by contrast, balance, harmony, and distribution. Andy Rutledge
• The design process is essentially a process of subtraction, organisation and emphasis. Leon Paternoster
• Simplifying design equates to reducing the choices available to the user to a few core, meaningful options. Leon Paternoster

---

Adelle Charles from Fuel Your Creativity send in the following quote:
• “Good designers can create normalcy out of chaos; they can clearly communicate ideas through the organizing and manipulating of words and pictures.” Jeffery Veen

---

Erik Brandt designer & teacher at Minneapolis College of Art and Design and blogger send in the following quote:
• For after all, a poster does more than simply supply information on the goods it advertises; it also reveals a society’s state of mind.” No posters, no culture? Armin Hoffman
• “Among the few I have indicated, is there no dynamic man of action, the rebel who will help determine the aspect of the collective expression of tomorrow? Ponder this question and know that to make beautiful creations for the sake of their aesthetic value will have no social significance tomorrow, will be non-sensical self-gratification. Every era contains the conditions for providing a rebel.” Piet Zwart

---

Thank you all very much for sending in the quotes, highly appreciated! As DWP reader I would suggest checking out the websites of the fellow bloggers. Thanks again.

Share your favourite design quote?

Please let us know your favourite quote or share the quote of somebody that inspired you. Thank you in advance, looking forward reading your favourite designers quote!

Rulerplus

RulerPlus is a simple application for your iPhone / iPhone 3G / iPod Touch, providing you with a simple 7 cm / 2 inch ruler. Ruler+ let’s you take measurements quickly and easily. Ruler+ also allows you to extend the ruler. Simply move your iPhone to the right and press ‘+’ to create the extended ruler. Supports centimers / millimeters and inches.

• Price *FREE*
• Developer Website
• Install this app via iTunes

OMNI Focus

OmniFocus for iPhone and iPod touch works great as a stand alone application or in conjunction with OmniFocus for Mac. It’s easy to sync your OmniFocus data between multiple Mac computers and your iPhone using your iDisk if you’re a MobileMe subscriber or a by using a generic WebDAV server.
Available for $19,99

• Price *PAID*
• Developer Website
• Install this app via iTunes

AIR Sharing

Mount your iPhone or iPod touch as a wireless drive on any Mac, Windows, or Linux computer.
Drag-drop files between your iPhone or iPod touch and your computers.
View documents in many common format. Familiar Finder-like file browser. Prominent display of available space. Check the developers website for more info. Available for $ 6.99

• Price *PAID*
• Developer Website
• Install this app via iTunes

OpticsCalc

OpticsCalc is a handy optical calculator for the iPhone and iPod Touch for everyone from students to engineers who know optical theory, but need a quick and efficient way to perform common calculations. It frees your mind from having to remember all the equations, and lets you concentrate on solving the problem at hand! Available for Eur 2.99

• Price *PAID*
• Developer Website
• Install this app via iTunes

10base-t interactive

Mrmr is a technology that enables you to use ordinary cell phones and PDAs as controllers in audio-visual performances, or to participate in interactive museum exhibits, or to use your mobile device in the place of the mouse or trackpad from your full-size computer.

• Price *FREE*
• Developer Website
• Install this app via iTunes

Airdesign Chair

Home Sizer is the perfect tool for anyone wanting to estimate the size and function of their dream home, or to just calculate the square footage of an existing home. Currently only provides for measurements in feet & inches. Available for $0,79

• Price *PAID*
• Developer Website
• Install this app via iTunes

Palettes

Palettes is a productivity tool for creating and maintaining color palettes. You may create any number of palettes. Create palettes from images and web sites. Add colors from several color models, web sites, color lists, images, or by entering CSS color strings. Available for Eur 3,99

• Price *PAID*
• Developer Website
• Install this app via iTunes

ZeptoPad

ZeptoPad changes as you add your ideas: sketch; mindmap; design; planning; and so on. You can scribble on the iPhone screen and also type text from the virtual keypad. You can drag and move text or picture elements at any time, cut, paste, and resize. When you meet other users of ZeptoPad, you can send a worksheet to another iPhone directly. ZeptoPad — the only limit is your imagination!
Available for $7,99

• Price *PAID*
• Developer Website
• Install this app via iTunes

Things

Other task managers either oversimplify or are too difficult to use. Either way you are not getting stuff done. Things instead has the right balance between ease of use and powerful features. With Things’ elegance and beautiful design, procrastinating never looked less attractive.

BeamCalc

Enter the light’s height above the target and distance across the floor. BeamCalc shows the resulting throw distance and elevation angle. Enter the light’s beam size in degrees to calculate the pool width. Adjust beam size or location to achieve required pool size. BeamCalc works with any units: feet, inches, centimeters, … even miles. Available for Eur 1,59

ColorExpert

Color Expert contains powerful tools to help artists and designers identify, translate, capture and showcase color. Designers know inspiration can come anywhere at anytime. Just look around. Some of the best ideas are waiting for you in the real world away from the studio. Now with Color Expert, you’ll have the tools to capture the moment, the moment a color captures you. Available for $9,99

Files

Files allows you to store and view files on your iPhone or iPod touch. You can connect to Files from any Mac or PC and drag and drop files straight from the Finder or Windows Explorer, as you would with any other shared folder. In fact any client which understands the WebDAV protocol can connect to Files, available for £3.99.

BeamMe

beamME allows you do send your personal or business card from your iPhone to any other mobile device or computer, including BlackBerries, Android phones, Treos, Macs, PCs and more.

i41CX+

Advanced programmable and expandable RPN scientific calculator with virtual thermal printer/plotter suitable for a wide variety of scientific, engineering, mathematical, financial, and technical applications. Available for Eur 11,99

iBlueSky

BlueSky is a brainstorming and mind-mapping solution for the iPhone and iPod Touch. Collect and organise ideas you have at odd moments, then email the complete project in PDF and PNG formats to any contact. You can even print a hard copy of your work from the PDF file. Availabe for Eur 5,99

Equivalence

Equivalence is the last conversion tool you’ll ever need. Designed from the ground up by engineers and for engineers, Equivalence makes your tedious, day-to-day conversions between unit systems a breeze. Less intensive conversions are even easier, which makes it great for simple and advanced users alike. Available for Eur 3,99

Units

Units is a simple unit conversion utility for the iPhone/iPod Touch. Unlike most other unit converters, Units looks and works a lot like a calculator. You punch in digits and Units does the conversion on the fly. Easy for converting typographic points to milimeter or inches. Available for $0,99

Scale Rule

The app is essentially a caliper, the top and bottom jaws can be freely dragged while the distance between them is constantly updated in the middle. White areas are being measured, black areas are not. You can switch between metric or imperial measurements with one click. Selecting the scale button will give you a list of over 100 commonly used scales to choose from. Available for $0,79

Caliper

Adjustable caliper jaws for pixel-precise measurements
Multi-Touch control — move upper and lower caliper jaws simultaneously. Available for Eur 0.79

Google Calender

View your schedule from anywhere. Check your Google Calendar schedule from anywhere on your iPhone. Browse any day to see all scheduled events at a glance. Add events on the fly. Type event details, press “Add now” and you are good to go. Google Calendar will add the event to your schedule.

Order Design Work

Looking for a designer? Now you can get quotes on graphic design work directly off your iPhone/iPod touch. You can choose from iPhone pages, widgets, websites, logo design, postcards, business cards, brochures, 3D images, and even flash and 3D animation. 18 years of experience with clients such as a PGA tournament, Miller Brewing, NBC Universal, Snap-On Tools, Johnson Wax, American Heart Association and many small and mid size companies.

Dexigner News & Events

Dexigner application delivers latest design news, events, exhibitions, conferences, and design competitions. Get latest design news, current & upcoming design events and design competitions from Dexigner Design Portal on your iPhone/iPodTouch.

Show me your favourite iPhone Apps

Please let me know in the comments about your favourite iPhone app that changed the way you design have another workflow or any other purpose your want to share. Thank you!

Düsseldorf Airport Signs

Photo credit iwouldstay

Airport Signage Design

When designing signage for a Airport or a other public building you have to take a good notice of the visual surroundings the signage will be placed in. The backgound colors of walls and windows, the amount daylight let in the building, the lighting and more environmental elements are important when designing signage for a aiport. In a visual crowed environment it is important that signage design stands out to its background, for a maximum effect. Use a color system with not to many variations and be consistant with the color usage. Think about using illumnated signs to enhanche the readability of the signage and always use mockups of the signs to test if the signage is working in the visual surroundings.

Color, typography design and use of pictograms

Design high contrast signs to ensure good readability and legibilty of the signage. Colors that work well are a dark background with a light colored text and pictograms. For example a black background with white illuminated lettering will ensure a high contrast which has a good readability from a distance. Other commen color combinations are a yellow background with black lettering. For typography use a sans type like FF Info by Erik Spiekermann or Frutiger by Adrian Frutiger. Use a font that have a high x-height which will increase the legibility of the signs. Use only one font in all visual communication levels of the airport signage. For international airports it is vital to use symbols to indicate the facilities in and around the airport, always strengthen the symbol with written text in the native language and perforably in English language. This will ensure that most of the visitors can read the signs.

Photo credit sabrinak

Typeface FF Info

Designed by Erik Spiekermann and Ole Schäfer, FF Info Collection offers a large variety in type weights and pictogram sets with a good legiblity suitable for airport signs.

Arrow design

Arrows are one of the most important design features of a wayfinding system for airports, with a pointing arrow you will be able to guide visitors to their destination. Choosing a arrow within a design can make or break the design, don’t over due the arrow but gently incorporate the arrow into the sign in balance with type. Recently I’ve released a arrow collection to use in a design. Download the 56 free arrows as a Illustrator vector file here.

Sign design using a grid

Always use a grid to design Signage & wayfinding systems in order to maintain balance and flexibility in the design. In a future article I will go in dept by explaining how to design signage using a grid.

Inspiration: Personal favourites

Below you will find a showcase of my personal 5 favourite airport signage designs. High contrast illuminated signs, using clear lettering.

Seattle Airport Signage

Singapore Terminal 3 airport signage

Copenhagen airport signage

Schiphol Amsterdam, Signage

Photo Courtesy: Martijn van Exel, visit his website Schaaltreinen.

Melbourne Australia, Airport Signage

Portland International Airport Signage

More Airport Signs Inspiration

Below a showcase of 19 more photos of airport signage design.

Frankfurt International Airport

Munich Airport Signage

Zürich airport signage

Warsaw Airport Signage

Singapore airport signage

Ataturk Airport — International Terminal

Oporto’s new airport signage

Zürich basic signage

Berlin, Schönefeld Airport signage

Newark International Airport

Paris — CDG Airport Terminal 2 Signage

Malaysia’s KLIA airport

Madrid Airport Signage

Doha, Qatar

Thai airport signage

Dubai airport signage

Oaxaca City Airport

Incheon International Airport

Bengaluru International Airport Signage

Other information & related resources

Bureau Mijksenaar has been proven to be a world leader in airport signage design, Paul Mijksenaar has designed airport signs for John F. Kennedy, Newark and LaGuardia, Sardinia’s Italy and Schiphol. His designs can be marked as clear high contrast signs. At Mijksenaars website you can find more detailed information about these projects.

• Personal tips and information about airport signage design by Paul Mijksenaar
• A case study by Jenny Reising at Signweb about Schiphol Airport signage.
• MetaDesign created the signage system for Dusseldorf Aiport, in this detailed PDF you can find various information about the design.
• A case study in comparing typefaces for airport signs by Robert Waller. This study combined three research methodologies to inform the choice of a typeface for signs at London’s Heathrow Airport, see this website for more information.
• FF Info by available via FontShop.

Comming up

Next article will be a design tutorial how to design airport signage, stay updated for more free design articles, subscribe to the RSS feed.

Share your thoughts

I’m curious to know which of the above mentioned airport signage designs you like the best? Please leave a comment in the comment fields below. Thank you!

Neues Museum

For all signage and wayfinding at the Neues Museum the architect chose a famous type by Erik Spiekermann (also from Germany), the typeface Meta. Throught the museum in all levels of communication Meta is used. A typeface that fits well into its surroundings.

Design Deutshland case study 08

The current exhibition presents a cross-section of current and classic designs of German designers and companies from different industries. From graphic and interior design to design of industrial products ranges the spectrum of this thematic section of draft German designers and companies. The case study will stay in the museum until October the 5th of 2008.

Graphic, product & industrial design

Other exhibitions at the Neues Museum

The art collection offers many insights into the development of art since the sixties. The museum is divided in seperate rooms and every room showcases a exhibition on its own, the walls are printed with quotes from designers, making it a visual experience walking through the Museum.

Design Collection

When walking through the museum you feel the inspiration and you will enjoy the many different art shown. You can find work of designers Warhol, Beuys and Neo Rauch. Some of the latest acquisitions from the museum are the works of British artist Julian Opie and from Czech artist Zdenek Sýkora. The museum walls are plain white that allows the art to come alive in the spaces, but the roof is made of glass and lets in daylight which sometimes gives too much light.

Other information

When you are near Nürnberg it well worth the visit, also the city of Nürnberg, with its old buildings and architecture is well worth seeing. We have spend about two hours in the museum to see its important works. Please visit their website for the latest information about exhibitions, artists and opening hours.

Future exhibitons from 31st October 2008 a new exhibition will take place “Who killed the painting?”, the comprehensive collection of Fluxus Germany. The new collection includes important works by the likes of Joseph Beuys, Nam June Paik, Arthur Køpcke, Ben Vautier and Wolf Vostell icons of art history.

• The official website of NMN (Neues Museum Nürnberg) (German only).
• A informative article at Wikipedia (German only) about the museum.
• See a 360 Panoramic view of the sqaure the museum is located at.
• The official website of the architect Volker Staab Architekten Berlin.
• The location of Neues Museum in Germany with Google Maps.

Neues Museum

Staatliches Museum für Kunst und Design in Nürnberg
Klarissenplatz, D-90402 Nürnberg
Tel +49 (0)911 / 240 20 41, http://www.nmn.de/
Opening hours: Tue-Fri 10am-8pm, Sat+Sun 10am-6pm