Chapter 73 : Traditional Graphic Design versus Digital Graphic Design

Now, instead of a mass audience consuming media from a single source, we have multiple sources, multiple channels and multiple audiences. Every participant is potentially a sender as well as a receiver of information, and the barrier to entry is no longer the fortune required to set up a TV station or a newspaper, but the price of a PC and an Internet connection. Much of contemporary political graphics in particular is designed with the internet in mind…with the steady growth of broadband connection, a full-color poster can be created as a digital file small enough either to send by email or to download from a website set up for the purpose, and printed by the recipient in as many copies as necessary or simply passed on digitally."
—Colin Moore,
Propaganda Prints: A History of Art in the Service of Social and Political Change, A+C Books, London, 2011

With a greater acceptability and penetration of digital media a growing number of graphic designers are abandoning traditional studio media -- those good old pen, ink and paper -- in favour of Computer Aided Design, using graphic design softwares and various desktop applications like Photoshop, Illustrator, and so on. Storing their portfolios on clouds that give them file syncing capabilities, these designers can easily access their artistic portfolios which then can be submitted to clients or to be shared with the other contributing artists in a project.

The digital design programs make it possible for the artists to publish their portfolios on their own sites. Digital media are faster and provide an incredible amount of capability and flexibility at the fingertips of designers, to redraft, recompose or rescale their artworks, change their colour schemes, and add various visual impacts in an instant. However, what these programs cannot offer is artistic sensitivity and design creativity. For instance, if one Googles for images on "digital graphic design" one will see numerous examples of cold and tasteless digital illustrations with all kinds of digital trickery but without any artistic merit. This can be contrasted to the designs of the times bygone when art and science had not yet diverged and documenting the visual world was still an artist's crucial role, when natural history artists and skilled printers created works that exude stunning artistic characteristics.

Many experimental and innovative proponents of Computer Aided Design argue that the digital media should supplant traditional graphic design techniques and designers should discard their time-honored media; such as graphite pencils, fineliners & studio markers, airbrushes, compass sets, scale rules & rulers, templates & stencils, and so on in favour of digital design. While the more traditional artists maintain that conventional drawing instruments are indispensable for artistic creativity. Of course, hand-drawn images have long been essential for visual communication of complex phenomena, where the artists created simple, clear, and meaningful images by focusing on the most important details required in the information set.

Examples of hand-drawn visual communication 
 
Paeonia suffruticosa Andrews var. papayeracea [as Paeonia moutan Sims var. papayeracea] [6269-737989-9167] Curtis’s Botanical Magazine, vol. 47: t. 2175 (1820) [J. Curtis]

Risso, [J.] A. und [P.] A. Poiteau, Histoire et culture des orangers. Nouvelle édition entièrement revue et augmentée ... par A. du Breuil. With 110 engraved plates, printed in colours and finished by hand and 30 woodcuts in the text. Pairs, G. Masson and H. Plon 1872. Blindstamped orig. cloth, front cover with gilt stamped title vignette. Folio. 2 ll., 228 pp.


A hand coloured print from Rev. Francis Orpen Morris' A History of British Birds. The renowned English printer, Benjamin Fawcett,approached Morris to write the text when Morris became Vicar of Nafferton. A History of British Birds was printed and bound in the small village of Driffield and shipped in tea chests to London. The final 6 volume work contained 358 hand coloured plates.

Engraving published in 1869 in Paris, France, from Charles D'Orbigny work ''Dictionnaire Universel d’Histoire Naturelle''. Charles-Henry d' Orbigny (1806 – 1876) was a French botanist and geologist

Engraving of a secretary bird from Charles D'Orbigny work ''Dictionnaire Universel d’Histoire Naturelle''. Charles-Henry d' Orbigny (1806 – 1876)



Today many young designers are faced with a dilemma; do they need to learn how to hand draw perspectives or other visual effects in traditional techniques, when computers can generate similar representations in a fraction of time?. It stands to reason, of course, to argue that acquiring any set of techniques, be it a well developed skill in traditional art or learning how to illustrate with a digital software is always a worthwhile endeavour that make any artist a better one. However, having a solid foundation in drawing is particularly important for an artist when one wants to realize a vision. The traditional drawing skills equip artists with versatility, dexterity and facility to visually communicate complicated concepts more intelligently, and in an intellectually more sophisticated manner. They allow the artists to exaggerate certain feature of their images, while reemphasizing or deleting some other segments in order to create more harmonious compositions and at the same time enhancing the artistic integrity of the image. The computer aided designs do such functions with preset software limits and do not allow for improvisation and innovative thinking.

Unquestionably, to have the option of creating a design promptly and manipulating its composition, scale, or colours swiftly and so effortlessly are great advantages of computer aided design. However, I personally prefer to use digital software as a complementary tool to my traditional drawing media.  I can study and explore further dimensions in my artistic visions that probably weren't possible in the past at such time-efficient manner. For example consider the following two digital versions of one of my traditional works.












Technology has allowed me to take the advantage of a wider set of capabilities to experiment and explore my artistic vision, and thus communicating visually with a wider audience. Working digitally also allows me to return to my previous works afresh and examine them in lights of new ideas that I otherwise may not have time to do. The following digital images show how other graphic designers use digital capabilities in tasteful and artistic way.

Of course as a "Graphic Designers"  one needs  to master the use of Illustrator, Photoshop and Indesign. This familiarity would allow us to have a greater focus  in our web design on pre-print production, typography, the design of logos, brochures, posters and images, as well as in designing  brochures, product design, advertising, and merchandise.

A Digital Designer is more technically oriented.  She may work on website design, mobile apps, and other online content for a range of industries. She may also work in 3D modelling or 2D animation, which require a more in depth understanding of various computer languages.





Alberto Seveso, Italy




Benjamin Delacour, Strasbourg, France

Sakke Soini, Helsinki, Finland.


Alberto Cerriteño, Mexico





Alberto Seveso, Rome, Italy.

Silvia Cordedda, Carrara, Italy

Eli Vokounova, Prague, Czech republic.




Igor Šćekić, Zagreb, Croatia.


Evgeny Kiselev, St. Petersburg, Russia.

Erik Johansson, Gothenburg, Sweden.

Into The Green ,  Anton Burmistrov



Today digital media designers are generally trained in animation, motion graphics, screenwriting, video editing, digital audio production and video production.  Digital media designers, like their traditional graphic designers are visual communicators that convey information via their web design, digital imaging, screenwriting and media production.  They create their work in a digital or electronic format, which are digital replica of print material, the product is created from scratch to be accessed on a digital platform.

Web design encompasses many different skills and disciplines in the production and maintenance of websites. The different areas of web design include web graphic design; interface design; authoring, including standardised code and proprietary software; user experience design; and search engine optimization. Often many individuals will work in teams covering different aspects of the design process, although some designers will cover them all.

Graphic designers mode of production  is only suitable for a small  market  and it is relatively more expensive. Obviously, any dissemination of information would be more efficient and less costly via web design. However, one needs to rely on the support facilities of  web/internet providers.


User Experience / User Interface or UX/UI.

Designers should aim to create designs that users will find easy to use and pleasurable. User interfaces are the access points where users interact with designs. Graphical user interfaces (GUIs) are designs’ control panels and faces; voice-controlled interfaces involve oral-auditory interaction, while gesture-based interfaces witness users engaging with 3D design spaces via bodily motions. User interface design is a craft that involves building an essential part of the user experience; users are very swift to judge designs on usability and likeability.

For example, a Digital Designer will use UX/UI factors in an e-banking system looking at the processes for a checkout. Was the experience for the user easy and were they able to successfully navigate their way to making a purchase in as little time, effort and knowledge as possible? Examples such as Google, the iPhone, the iPad, and the Amazon Kindle have shown that user experience is an important product differentiation. Consumers will buy and use products based on their design, usability, and appeal. This expectation for well-designed products has even translated to business applications, such as Salesforce.com and SAP’s Fiori mobile apps, as employees have come to expect enterprise software to be as easy to use as consumer applications.

The three key elements of a UX design process are:

  •  Conducting user research to understand the users’ characteristics, behaviors, needs, and context of use. 
  •  Using this understanding of business and user needs to design a solution that follows human factors principles and design best practices. 
  •  Evaluating the design with users by conducting usability testing and making changes based on the findings in an iterative design process.

Color Models

The color mode of graphic design and web design used are completely different. Due to the rely on printing, the graphic design usually uses CMYK color model — named after the four base colors of the model: cyan, magenta, yellow, and black. The four-color printing process uses four printing plates; one for cyan, one for magenta, one for yellow, and one for black. When the colors are combined on paper (they are actually printed as small dots), the human eye sees the final composite image.

Web design uses RGB according to its special imaging model, which is made up of red, green, and blue.  RGB model is used on  computer monitors and is what a user  will view on the screen. Thus RGB is retained for projects that are designed to stay on screen (websites, online documents, and other Web graphics, for example).

The RGB colors, however, can only be viewed with natural or produced light, such as in the computer monitor, and not on a printed page. This is why CMYK dominates the commercial printing world .  When two RGB colors are mixed equally they produce the colors of the CMYK model, which are known as subtractive primaries.
  • Green and blue create cyan. 
  • Red and blue create magenta. 
  • Red and green create yellow. 
  • Black is added to the model because it cannot be created with the three subtractive primaries (when combined they create a dark brown). The K, or “key,” stands for black.
Given that computer monitors are only capable of displaying images in RGB,  graphic designers must work on screen in RGB, although their final printed piece will be in CMYK. Digital files should be converted to CMYK before sending them to commercial printers unless the print shop requests something else. Furthermore, some programs, including Photoshop, which uses RGB for photography, limit what one  can do to CMYK images.


Choosing Web Fonts

Typography plays a crucial role in web design. Different font styles communicate different subconscious messages to people. For instance, geometric fonts with homogenized proportions tend to represent design purity, cleanliness and simplicity – values that many technology brands are currently keen to express. Many fashion houses, on the other hand,  prefer high contrast modern designs with their elegant hairline strokes, bracketed serifs and smooth arching curves, expressing a timeless style. Trying to appear more human and consumer friendly, commercial  banks, following the financial crisis of 2008/09 have shown a tendency to move  away from authoritarian serif designs in favour of softer expressions.

  • Standard fonts include Garamond, Times, Georgia, Arial, Helvetica, and Verdana, which were designed for legibility and work well for larger blocks of text. They’re common fonts that many people have heard of. There are a number of fonts, however, that fall into the “standard” category with names that you may not recognize.
  • Font weights for body copy are usually called Roman, Body, or Regular. Readers aren’t distracted by the design of these classic fonts, enabling them to focus on the text at hand. Standard fonts are designed for easy reading, so they work well in the smaller point sizes and in larger blocks of text.
  • Fancier fonts, on the other hand, or other weight variants of a font like Bold, Condensed, Semi Bold, Black, and Ultra, have a lot of detail and personality, ideal for larger-set headings and subheadings consisting of a few words. These fonts grab people’s attention, but they aren’t designed for a long page of text. You can often distinguish the decorative fonts just by their names, such as Kid Print, Comic Sans, and so on (see the following figure).

A web designer must start by considering whether a serif or sans serif  type is suitable for his project.  Serif  are the little ledges that adorn  the tips  various letters. They originate from carved inscriptions, mostly from the Roman Imperial period.  Sans-serif fonts, on the other hand, don’t have these ledges. Some modern sans-serif fonts do have little embellishments on their tips, making you look twice, but they’re still considered sans-serif fonts. Both serif and sans-serif fonts can be used for larger blocks of body copy. Typically, serif fonts give the page a more conservative, classy, or newsy look, while using san-serif fonts yields a cleaner, more modern feel.

Serif is further divided into four typeface families.
  •   Old Style 
    • The oldest Serif family includes fonts such as Adobe Jenson, Centaur, Goudy Old style, and many more. Their typeface is modeled on what text used to look like in the 1400

  •  Transitional  
  • Transitional  serifs are somewhat  more modern-looking. This typeface family includes Times New Roman, Baskerville, Georgia, etc.       


  • Modern 
    • As the name implies these  modern-serifs are more  contemporary looking. This includes Didot, which is the typeface used for the title of Vogue magazine.


  • Slab-Serif 


  • Slab-Serifs are a type family with thick serifs. Examples of slab-Serif typefaces include American Typewriter, Archer, etc.



  • Sans-Serif Type Family
    •  Grotesque
      • The oldest type in sans-serif is  Grotesque ,  which includes News Gothic, Franklin Gothic, and more.




    • Neo-Grotesque: 
      • This type is slightly more modern and more eligible. Helvetica and Ariel are examples.



    • Humanist: 
      • Humanist type is described by some as  somewhat futuristic. Gill Sans is an example.


    • Geometric: 
      •  Geometric is supposed to be even more futuristic. Futura is an example.






    References 
    Bilda, Zafer and Halime Demirkan. 2003. “An Insight on Designers’ Sketching Activities in Traditional Versus Digital Media.” Design Studies 24: 27-50.

    Brandon, Lynn. 2001. “Effects of Hand-Drawing and CAD Techniques on Design Development: A Comparison of Design Merit Ratings.” Journal of Interior Design 27: 26-34.

    Cuff, Dana. 2001. “Design Software’s Effects on Design Thinking and Teaching.” Architectural Record 189: 200-206.

    Gibson, Kathleen. 2007. “Automated Creativity: Digital Morphology and the Design Process.” Journal of Interior Design 32: 41-47.

    Hennessy, Sara. 1999. “The Potential for Collaborative Problem Solving in Design and Technology.” International Journal of Technology and Design Education 9: 1-36.

    Johnson, Timothy P. 2001. “Digital Drawing: Illustrative Drawing and Rendering with Photoshop.” Landscape Architecture, November, 44-48.

    Lu, Jiang. 2005. “Bridge the Differences between the Digital and the Traditional Media.” Deliberate Design - A Deliberate Design - A Humane and Enlightened Course of Action, IDEC, Savannah, Georgia, 76-77.

     Levin, Helen. 2002. “A Response to William Mitchell on ‘The Death of Drawing.’” Leonardo 35: 118.

     McLain-Kark, Joan. 2000. “A Strategic Story of Using Computer Technology: The EPA Project by HOK.” Journal of Interior Design 26: 25-40.

    Meneely, Jason and Sheila Danko. 2007. “Motive, Mind, and Media: Digital Sketching in the Creative Culture of Design.” Journal of Interior Design 32: 69-90.

    Reiss, Gwen N. 2001. “Drawn to Perfection.” Preservation 53: 50-53. Seelig, Warren. 2003. “Digital Dialogues: Technology and the Hand.” Surface Design Journal 28: 6-11.

    2 comments:

    1. I agree, these designs are beautiful. However, they are more infographics than effective dashboards in terms of the amount and depth of insight they communicate. Accepting that, the design, colours and graphics are a visual delight.

      Clipping Path Service

      ReplyDelete
    2. Wonderful article you have published . So much thanks for this post .

      ReplyDelete