Design Writing Research
TOPIC : Drawing by hand is the most important part of the visual design process.
Flavie Fournier BA Graphic Design Prague College 2012-2013
SUMMARY Introduction .............................................................................................................................................................p.2
PART 1.....................................................................................................................................................................p.3 Drawing : a way of expression..........................................................................................................................p.3 Drawing as a psychological therapy............................................................................................................p.4 Drawing makes us feel good............................................................................................................................p.4 Link with the graphic designers....................................................................................................................p.4
PART 2 - PhysiologY.................................................................................................................................p.5 The power to grip..................................................................................................................................................p.5 The tool : a part of the hand...........................................................................................................................p.5 Distance and knowledge...................................................................................................................................p.7 Feelings and reflection.....................................................................................................................................p.8 Hapticity - The science of touch....................................................................................................................p.8 The haptic feedback and blind individuals................................................................................................p.9 Tactil feedback helps to combat stress.......................................................................................................p.9 Drawing is the first understanding of the object/subject.................................................................p.10 Drawing is a long path of research............................................................................................................p.10
PART 3 - Society and Technology........................................................................................p.12 The place of the computer.............................................................................................................................p.12 In webdesign, is the hand drawn style is welcome?...............................................................................p.12 Hand-drawing supports the idea of the products................................................................................p.13 Hand-drawing for webdesign ? Yes, but with moderation.................................................................p.14 Conclusion...........................................................................................................................................................p.15 Referencing, Bibliography..............................................................................................................................p.16 1
Fig. 1.Maurits Cornelis Escher, Drawing Hands, 1948 http://www.mcescher.com/Gallery/back-bmp/LW355.jpg
Introduction Drawing by hand is a part of the human. For 40 000 years, the human has been exploring the abilities and skills of his hands. These members are the bond between the human body and the outside world. Juhani Pallasmaa has said ‘The tool is an extension and specialisation of the hand’. For twenty years, the Information Technologies (IT) have been spreading up and have been winning the trust of the humans. The topic is going to argue that drawing by hand keeps his place in a world inhabited by the technologies in a permanent way with the 3 following parts : - Psychology : Drawing by hand, the clue for the ineffable thoughts and things - Physiology : Drawing by hand, a old connection between the pencil and the hand - Society : Drawing by hand, the style not old fashioned yet
2
PART 1 - Psychology Imagination, brain, thought and reflection are some words which link the psychology with the process of drawing by hand. With in the first part of this research, it will be shown to prove that drawing by hand is a kind of language which helps, when the words are missing. Then, a link will be made with graphic designers. Do they miss of words sometimes ? The brain and hands are interdependent. We can be sure that it’s the brain which is always sending orders but there is an exchange. Indeed the communication happens both ways. ‘The extraordinary evolution of the human brain may well have been a consequence of the evolution of the hand’ (Juhani Pallasmaa, 2009, page 33). So we can wonder : is it our brain or our hands which draw ? How does the process of drawing link the brain with the hands ? Which benefits does drawing by hand bring to our happiness of mind ?
Drawing : a way of expression Drawing by hand is a kind of expression which transfers ideas more clearly than the verbal one. According to Juhani Pallasmaa (2009, page 36) ‘Artistic images expose us to images and encounters of things before they have been trapped by language’. That means that drawings can be useful to help us understand lots of facts. For example let’s talk about the way that traumatized children express their emotions. They go to a specialist to express their troubles. ‘Children express their ideas and perceptions of the world they live in, as well as how the deal with in’ (Burns 1982; Hammer 1997; Moschini 2005 cited in Hamama, L. and Ronen, T. , 2009, page 93). fig. 2 Child of 6 year old ‘‘What My Dad Looked Like After the Accident”. Drawing is a translation used by children to be understood by adults. Many experiments has been done about self drawings and self-portraits, which have changed the behaviour of children. These experiments have taught that self-drawing has been useful to learn more about the behaviour and the emotions of children. So the drawing transfers the thoughts and emotions to the paper. They have been transferred out of their mind. They are visible and children can be better understood. 'The design is structured as speech, space replaces time, replaces the color tone of voice'.(translated in english, Grande Encyclopédie Larousse, 1971-1976, page 4196) Drawing can complement written or spoken language. The drawing acts as a bridge and the things that cannot be easily defined are identified thanks to their visual representation. As a practical example, we can speak about the Chinese language which uses special signs to represent words, ideas and sounds. The Chinese language is the first one in the entire world. That means that almost one milliard of people often uses 6,000 Chinese characters roughly (there are 80,000 Chinese characters but lots of them are not used anymore). In the future, we will prefer the language of symbols than words ? fig.3. Pattern Chinese character, 2010 http://www.makingfriends.com/biblecrafts/pattern_chinese_characters.htm 3
Drawing can provide another mode of possible communication at home between parents and children. The conclusion of this study has brought that there is an effective way to know the feelings and emotions of the children. This is to analyse their drawing by hand.
Drawing as a psychological therapy A drawing is ‘worth a thousand words’. Indeed, a drawing is richer than a discussion when it’s about conveying key information. The power of the drawing is recognized since the 1970’s. Cathy Malchiodi, art therapist, research psychologist and author in the fields of art therapy, has spoken about children who have been physically abused in several studies. ‘Drawing is particularly useful in trauma intervention...encourages the expression of emotionally-laden events more successfully than talking alone’. The most simple drawing can be the key to unlock the hardest emotion and to make it to be understood easily and quickly.
Drawing makes us feel good Researchers have some hypothesis about how drawings are helpful for verbal reports. An experiment called the NICHD (National Institute of Child Health and Human Development) protocol was conducted by the Israeli Youth Investigators. One child was interviewed twice and between the two interviews, he had a thirty minutes break and he was asked to draw during this free time. The results found that during the first phase, it was the interviewer who spoke the most. In the second part, after the break time, the child seemed be more free, calm and he expressed more himself with verbal language and the words were free and well organized. With children, we use drawing as a mediator. That solution creates a link with their thoughts and emotions. When they draw something, they find the quiet and their complicated feelings become easier to understand and to express. Drawing by hand is a path that children like, because after this step, they feel more confident with themselves and with others. When a child draws, a connection is created with his fantasy world and with his secrets. The drawings transform these things into reality because there are represented on paper.
Link with the graphic designers Drawing by hand makes complicated feelings, thoughts and emotions more easy to understand for children. What about adults or graphic designers ? Do they feel more confident when a blurry idea is drawn on paper ? Is it still blurry ? At the beginning of a project, graphic designers have lots of ideas, but not really the precise one. As long as they do sketches and researche, they try to translate and to interpret what they see in their minds. At the beginning, they explain these first ideas with words only, but they are not understandble. A pen and a sheet of paper helps them to identify the visuals and to invite someone else to enter in the world of their mind. At the end, we have succeed to create a connection between our mind and the outside - the others’ minds. Drawing is a language without boundaries and we don’t have to know a specific vocabulary or set of knowledge. To recognize what a drawing is explaining, we need a visual culture. During the childhood, kids read books with pictures and words. So they began to learn, to discover and to name the things with the images. We link this with the fact the drawings of our ancestors preceded verbal communication. They weren’t able to use words to communicate with others because the words did not yet exist. The shapes and lines our ancestors created had common points with real objects, it’s why they made a link with the two similar visuals.
4
PART 2 - Physiology Grasping a pen, hand, arm and feedback are some keywords that are important for second part of this topic. When we draw, something happens physically. Holding and using a tool with the hand is one of the oldest abilities of humans.
The power to grip ‘The power grip preceded the precision grip in the evolution of the human hand’ (Juhani Pallasmaa, 2009, page 47). With humans, manual dexterity has been developing since the Palaeolithic area. By doing increasingly something with the hands, we have wanted to do more with them, because humans have learned a lot of things thanks to them. We call that the ‘know-how’, we can get and develop that with them. We call that the ‘know-how’, we can get and develop that with training.
The tool : a part of the hand
fig.4. Paleolithic wall art in Lascaux (2012) http://architecture.desktopnexus.com/wallpaper/180299/ ‘The tool is an extension and specialisation of the hand’ (Juhani Pallasmaa, 2009, page 47). Drawing by hand has 37,000 years of History. Our ancestors, the australopithecines were drawing with tools from the Palaeolithic area, it exactly called the wall art. We can see an evolution of the size of the tools needed (fig.5, fig.6, fig.7, fig 8 and fig.9)
fig.5. Aurignacian Scraper from the site of the sinkhole Cantalouette http://www.inrap.fr fig.6. Pencil (2011) www.forbes.com fig.7. Computer mouse (2003-2013) www.wisegeek.org fig.8. Wacom Bamboo: pen + finger joint (2011) www.createlier.org fig.9. Hand holding touchpad pc and finger touch (2013) http://fr.123rf.com ‘The tool has grown to be a part of the hand’ (Juhani Pallasmaa, 2009, page 48). What does it means ? Physiologically, something is missing in the hand to express and draw. During the Palaeolithic area, and even today, the human is able to draw with the hands directly (fig.4.), with the skin touching to the medium.
5
In relation to contemporary work, a developer and user experience/interface designer, Matt Gemmell, has shared a video named ‘Fingers Tools’ (fig.10. and fig.11.) available on his website (http://mattgemmell.com/) and on YouTube. This video exactly illustrates the fact that the hands can have a tactile connection to the medium. Each finger has his own status and that improves the abilities of the hand. The technology is constantly evolving and could be a bridge between hand drawing and the computer.
fig.10.
Finger Tools (2010) http://mattgemmell.com/2010/08/11/finger-tools/
fig.11.
The tool creates a short boundary between the hand and the medium. Instead of feeling texture and drawing with the fingertips, we use a pencil that we manipulate. We have to concentrate on what we could do with five fingers condensed into one pencil. Let’s imagine if we would have one tool at the ends of each finger (fig.12 and fig.13)
fig.12. Edward Scissorshands’ movie realised by Burton.T (1990) www.thatfilmguy.net fig.13. Small Utility Tools Are Attached To Finger Tips (2011) www.adafruit.com This is more precise and the drawings are more complicated. ‘In drawing and painting, the pencil and the brush become inseparable extension of the hand and the mind’ (Juhani Pallasmaa, 2009, page 50). On the contrary, it’s difficult to imagine the fact that the graphic designer and his mouse are totally bound to each other. H.Weber (2012) provided the necessary information that ‘The tactile sensations and permanent nature of a pen on paper helps you actually understand what you’re doing.’ Someone with his pen or pencil move together, it’s not only the hand anymore, it’s the entire body. ‘The muscles of the artist’s entire body seen to participate in the physical act of drawing’. (Juhani Pallasmaa, 2009, page 94) With a computer mouse, the arm and the index finger move in front of a computer. There are less physical activities but more brain-based ones. With computers, the graphic designer has to become more intellectual.
6
It’s more about knowledge, learned skills and interfacing with a very complicated tool, based around learning the ‘language’ of computer software, and that mediation between original thoughts and production of an image. ‘The pencil in the architect’s hand is a bridge between the imagining mind and the image that appears on the sheet of paper’ (Juhani Pallasmaa, 2009, page 17). The pencil gives the idea reality and brings the physical side/characteristic to the imagining mind. As long as the visual is in the mind, it doesn’t exist physically. There are differences however between the image in the mind and the one on the paper. In fact, the hand doesn’t understand the entire image in the mind. It grasps the main lines and shapes. The drawing is a kind of copy or imitation of the perfect image in the mind. ‘In fact, every act of sketching and drawing produces three different sets of images : the drawing that appears on the paper, the visual image recorded in my cerebral memory, and a muscular memory of the act of drawing itself ’. (Juhani Pallasmaa, 2009, page 90) Sketching and drawing physiologically allow us to remember our first idea in three differents ways : eye, mind and hand. Drawing by hand involves the sense of touch. By using a manual tool, we can feel the texture of the medium and then we adapt the way of drawing or holding the tool. When the eyes are blinded, there is still the sense of touch left. The drawer frees his mind, because the eyes don’t check/keep watching what the hand does anymore. When we draw with a computer screen, recording our work the work spacehas no real tangible scale. If our eyes are closed we can not know if we are sketching in the work space. There are no senses to guide us so we don’t have landmarks anymore. Anton Ehrenzweig, a trained lawyer, said ‘Creativity is always linked with the happy moment when all conscious control can be forgotten’. Drawing by hand allows us to express quickly the creativity in the mind. Are we happy to work/ draw on computers ? Before working on a computer, all the creativite part is done, the execution part is the only part left. In this way, we will be more satisfied and we will feel more secure that the visual idea has been saved on something real/physical. After the idea has been saved, computers are helpful to finalize, to push the drawing forward to be next to the drawing on the paper. Sometimes, we find the hand-drawn sketches better than the final, digitally-made on that was created with one software.
Distance and knowledge ‘The computer creates a distance between the maker and the object’. (Juhani Pallasmaa, 2009, page 97) While working on software, it’s necessary to translate each action, each move and every thought into a vocabulary. The distance created by the computer is real. Indeed we are separated by the menus, the options, the effects and then by the mouse. Ultimately, they are essentially virtual elements that separate us from drawing. What are the consequences ? Can it have some benefits ? Until a drawing made by software is printed, it doesn’t exist yet, because it’s just digital data on the computer. It’s usually about numbers, subtraction, rotation and others commands (fig.14.) to create graphics. We speak a lot of mathematics. Even when we would like to do something abstract, we have to choose, to control, to think about which tool, which brush and which color that we are going to use. ‘The problems...are evident particulary in the most sensitive and vulnerable early phases of the graphic design process...The hand with a charcoal, pencil or pen creates a direct haptic connection between the object, its representation and the designer’s mind...whereas computer operations and imagery take place in a mathematicised and abstracted immaterial world’. (Juhani Pallasmaa, 2009, pages 95 and 96) fig.14. Adobe Illustrator Tools Icons (2012) www.design-freebies.com 7
Feelings and reflection The following example will contrast the methodology in doing the same thing on drawing software with doing it by hand. It’s all our mode of thinking which is different with the software than by hand. For example, with Adobe Illustrator, we have two shapes and we would like combine them in to one shape. The right command is «unite». At the start, we have to ask ourselved «what do I want to do ?». It may seem a little bit mindless, but that’s how we get the answer. Use of software requires more thought and logic, because after naming the act, we can find the associated mode on the software. On the other hand, we learn another language and we develop some skills and become specialists. A nursery and a baker can’t know what we mean when we speak about this ‘graphic language’. Each professional world and its equipment has his own language and has to be evaluated. That means, computers are everywhere in every work places. ‘When drawing by mouse and computer, the hand usually selects the lines from given set of symbols that have no analogical...relation to the object’. (Juhani Pallasmaa, 2009, page 97) That means we do a long list of processes, which, when combined, result in a final image. To do the equivalent on a paper sheet, we draw shape one and shape two, then we take an eraser and the brain quickly sends a message to the hand («erase to get only one shape») which erases the lines in the middle of the two shapes.
Hapticity - The science of touch Anne Marie Helmenstine, Ph.D. (2013) provided the necessary definition of hapticity : The term hapticity is used to describe how a group of contiguous atoms (fig.15.) of a ligand are coordinated to a central atom. Haptics are a recent enhancement to virtual environments and give forced feedback of the virtual world. This means that a haptic device can provide weight, roughness, or collision feedback to the end user. This technology has found its way in virtual reality simulation, surgery, education and training, rehabilitation, exploration of environments, manufacturing and design.
fig.15. Cyclic ligands (2007) www.ccdc.cam.ac.uk
Drawing by hand means holding a tool, touching a medium, mixing and spreading colors. It is based around touch and physical contact or communication. Obviously we can’t draw something without a medium. Indeed, the tool and the hand don’t have a kind of boundary or wall. Jeffrey J.Berkley, an inventor in Seattle, has said ‘To be able to interact with an environment,there must be feedback’. Our eyes indicate to us where we are in relation to the medium. This signifies we already know that we will get a response after the first contact of the tool with the medium. We gain additional information when our tool comes into contact with an other object. This is haptic feedback. ‘For example, when simulating the feel of a rigid wall with a force feedback joystick,...the farther the user penetrates the wall, the harder the motors push back to force the joystick back to the wall surface. The end result is a sensation that feels like a physical encounter with an obstacle’. (Jeffrey J. Berkley, 2003) It’s two forces which are opposites and they send a kind of message back and forth to create a contact and 8
an energy. It does not literally mean that the medium pushes the tool while we are drawing something, but only its presence stops or grasps the movement of the tool. With this feedback, the distance between the user and the computer is deleted, because a real connection links the two elements. It’s not only the person who orders and answers anymore. Everyone needs this feedback to be able to feel that we are drawing by hand. Is it so much different for blind people ?
The haptic feedback and blind individuals ‘The haptic system...would appear to be far more crucial to blind than sighted individuals who need to collect information about the objects in their environments’ (Vinter, A., Fernandes, V., Orlandi, O. and Morgan, P. 2012 page 1819). Indeed, blind people need this feedback. This is their landmark and the sense of touch is their strongest one. There have been comparisons with the exploring tactile patterns by children and with their drawings. Every sighted and blind individual has a lot of sensibility in the hands and above all at the end of fingers. For grasping and exploring, we use always them. Since the age of around five years old, we use fingers to explore objects contours. This process is called ‘the contour following procedure’ . With this information gathered, we can recognize one entire shape which has a meaning. During this study ‘Exploratory procedures of tactile images in visually impaired and blindfolded sighted children’, some children had to explore movements with their two hands and their fingers in order to get a very good idea of the pattern’s shape. Children don’t have feedback for that experience, but they have developed/increased their sense of touch, using their hands as much as possible. With minimal reliance on the other senses, their missing senses allowed them to explore and discover more the skill of their hands. This study definetely concluded that certain exploratory strategies are more beneficial at the earliest possible age to avert and limit deficits in the visual senses. ‘Blind adolescents employed both hands and used multiple strategies more often than sighted adolescents’ (Vinter, A., Fernandes, V., Orlandi, O. and Morgan, P. ,2012 page 1828). ‘The children with low vision tended outperform the blind and sighted children in the drawing task. This suggests that a residual visual capacity associated with haptic skills leads to the best performance in spatial recognition tasks’. (Heller, 2002; Passini, Proulx & Rainville, 1990; Ungar, Blades, Spencer & Morsley, 1994 cited in Vinter, A., Fernandes, V., Orlandi, O. and Morgan, P. ,2012 page 1829) The both senses together are strong and useful tools. That means that a sighted child who uses very well his haptic skill could be very talented. Blind children and ones with low vision benefit from their haptic skills which can compensate for their weaker sight, and can allow them to perform certain tasks equally well as to sighted children. During the ‘contour following procedure’, they are more similary to our ancient ancestors, who drew with the hand and the fingers directly. This act is a kind of observation. This is not about curiousity, it’s a procedure of understanding and learning. ‘The confusion between foreground and background’ doesn’t happen with the touch exploration. For example with an object, if we want to represent it in three dimensions with a specific software, we need to interpret some information and to create an artificial environment for the 3D object to exist within. Firstly, the size is necessary on the XYZ axis, and it must be placed in space. Then, the lights and the shadows are necessary to make a difference between the foreground and the background of the object.
Tactil feedback helps to combat stress Working on a computer for a long time can be very stressful, because we do many actions on differents software quickly. Sometimes, we can make frustrating mistakes, because we are doing too much stuff simultaneously and we become upset. Dennerlein, Martin, and Hasser studied how a force feedback mouse could improve the movement time performance of two common interactions on a Windows-based GUI (in 2000). 9
They have found that with tactil feedback in addition to the visual information (for mobile phone users) minimized their mistakes. Without visual information, but with high tactility, users made only a few more mistakes (1,8% average error rate). This is quite a low rate. ‘Tactile feedback can help to offload the visual channel for the operator, reducing stress and improving efficiency’ (Immersion, The Value of Haptics, 2010). It’s relevant and positive to know that tactile feedback can reduce stress. That means that this feedback make us feel good. So can we say that holding a pen for drawing by hand helps us to stay calm ? Numerous studies of ergonomics of computers in the workplace show that using a computer a lot is stressful, because we don’t have feedback and we feel too far from the computer. To support this fact, a recent study from 2006 of the use of Visual Display Terminals (VDT’s) called ‘‘Impact of Computer Workstation Design on Health of the Users’’ by Suman Singh and Jyoti Wadhwa demonstrates that working on computers brings health problems. This is a link between computers and people. In the study, it asked the participants how they felt after a long time using a computer. Seventy-six percent felt mental stress. The conclusion of this study is a lot of people aren’t able to spend physycally and mentally too much time working on computer. Tacile feedback indicates to us if we are following a good path. It gives us a response which validate our moves or actions. Something else follows us, this kind of helper, so we are more trusting. We can link this fact with the old expression : ‘‘Doing something with closed eyes means that we are confident.’’ Therefore, we could do something or even draw by hand with closed eyes if we really trust in our tactile senses, but for that we have to increase the exploration with the hands.
Drawing is the first understanding of the object/subject ‘Drawing constitutes a very effective way of revealing the understanding of shape’ (Vinter, A., Fernandes, V., Orlandi, O. and Morgan, P. ,2012 page 1821). That means that drawing by hand is helpful to learn and tame what is around us. For graphic designers of video games, understanding the shape of an object is indispensable. Indeed, after several sketches of differents views, the graphic designer better understands the object, how it moves and how lights work on it. Then, he can start the animation procedure.
Drawing is a long path of research We link drawing with exploration. ‘I personally want to see the traces, stains and dirt of my work...errors and failures, ...for as long as I am developing and idea’ (Juhani Pallasmaa, 2009, page 109). The step of drawing by hand is important for the history of the work (fig.16.). Indeed, the designer can understand and remember the paths that he has chosen. That will be helpful for next steps as his hand and his tactile senses have a memory. Drawing by hand is a kind of research. We are looking for a new shape for a logotype or we would like to design a realistic character. The first sketches are always bad. Cedric Villani, a French mathematician, wrote ‘ writing and design help channel, setting and shaping the ideas vague and fugitive’.
fig.16. Pallasmaa, J. Sketch of Icelandic landscape m.architectural-review.com 10
When a designer starts on a bad path, his first drawings are still available and real on paper. They are the roots, so he may restart on a different path, based on what he has learned from them. We have to start again, to erase some lines, to change the pen and make some tests of colors. Graphic designers are researchers and explorers. The final goal is the treasure, the sketches are the paths, the erased lines are the dangers or the enemies. To find the big idea, we do a lot of research, and at the end we get references. To be the most amazing and to convince the customer of our project, all our exploration is useful and drawing by hand is a part of it. The tactile and embodied experience of doing work in a physical space has benefits. According to William Kentridge (fig.17.) ‘The workshop is a closed space ... like a bigger brain. Wandering in the workshop is the equivalent of turning ideas into his head, as if the brain was a muscle that could be put into practice for the condition and improve its performance.’(translated in english, 2009, cited in Caraës, M-C. and MarchandZanartu, N. , 2011, page 27)
fig.17. Kentridge, W. (2009) L’artiste au travail www.nplusun.org At the beginning, when we draw by hand we draw a lot of differents visuals but after a while, the brain becomes concentrated and there is one path left. This is the benefit of drawing by hand, this action frees the mind. We can feel confident of the big idea, before taking the next step to the computer.
11
PART 3 - Society and Technology Introduction Currently, images, information and transportation move with unprecedented speed. Indeed, we can get something very fast and when we want it. What’s happening ? We don’t have enough time anymore to make deliberate steps one after an other. Do we have still enough time for that ? In webdesign, is it still important to do sketches and can we use hand-drawing for websites ? What part do computers play in our professional and personal life ?
The place of the computer Effective computers have been created since 20 years ago. At the begining, they were not destined to be in our homes. It was only a tool of work with some profesionnal softwares. Now, the computer multiplied his functions, skills and performances thanks to advancement by mathematicians, engineers and scientists. Using the computer even at home is became a part of life. ‘Even a child of 8-9 years is looking for net information just for completion of his/her school assignment’ (Suman Singh and Jyoti Wadhwa, 2006, page 1). Today, we do too many tasks with computers, for example, researching work, buying clothes and communicating. For a graphic designer, the role of the computer is not only a tool for work. It’s a kind of continuous assistant. It is also used for cyber activity. On the internet we look for websites all and we don’t count the spent time on computer anymore at home. Do we spend all our free time on computer ? Fortunately, there are a lots of activities not available on the computer left to do like cooking, running, walking, eating and drinking. The cyber activity can become dangerous if it’s excessive. It can create ‘cyber-kids’. The child expert, Dr Michele Borba (2012) provided the necessary information that ‘64 percent of teens say they do things online that they wouldn’t want their parents to know about’. Children and teenagers know to do many things on the computer. They teach computer applications to their parents and they don’t have self-control in video games and websites. The computer has definitely taken an important place in our personal and professional lives. ‘As today’s consumer, media and information culture increasingly manipulate the human mind...One of the primary tasks of arts is to safeguard the authenticity and independence of human experience’ (Juhani Pallasmaa, 2009, page 148). With a pen and a sheet of paper in a park, the designer is totally all on his own, he is free. Website and software aren’t next to him to influence him. Indeed, his only source of research and inspiration is his life, his memory, what he has seen when he was walking on the street or the last newspaper. The designer is more focused on himself and his imagination. Definetely, it’s on the sheet of paper that we get ideas because if you are not confident with them at this step of the graphic design process, this is not the computer which gives us the solution.
In webdesign, is the hand drawn style is welcome? It is commonly acknowledged that good webdesign has to be simple, accessible and apparent. The visitor doesn’t have to think a lot because he is the consumer and if he wants to come back, that means that the website meets all the functional requirements. It doesn’t really matter if a website is done with Flash or X(HTML), the most important thing is that it has a unique and distinctive style.
12
The picture (fig.18.) is a preview of a website with hand-written elements. Because of its unique appearance the users have to explore the website and to be curious to find what they want. While users surf the internet, are they not curious ?
Fig.18. K4 Laboratory (2012) www.hongkiat.com/blog/60-beautiful-hand-drawn-web-design/.
Hand-drawing supports the idea of the products Behind the product, hand-drawn elements are not only the background of the website. They bring some informations that the final visual product can’t. In fact, these elements give a more personal explanation with emotions. With the final product, the client has access to the roots of the product. ‘In a world where eventually everything becomes similar’ (Juhani Pallasmaa, 2009, page 148), hand-drawn elements leave a kind of mark. If we compare two websites without hand-drawing elements, we can find many differences between them, the style, the organization of information, the colors. But they use the same shapes for the headers, they make groups to organize their projects. Instead of a website with handdrawn elements, its owner would like to share more with the visitors. The main menu can be hand-written (fig.19.). This design choice might tell a visitor : this is his website, with his history, his style, his project. So this graphic designer wishes to present and show himself through his website. His work process, his handwriting, his hand-drawing, he opens one supplementary door to the world where the client can know more about him and his work process.
fig.19. Hand-drawn rectangles for navigation options (2008) http://www.smashingmagazine.com/ To show his hand-drawing, he uses the scans, so he doesn’t try to reproduce or to copy the drawing already done. In fact, he shares the authentic visual version of the product. To see the sketches next to the final digitally made ones remind the visitor that there exists a step before the digital one. Lennartz (2008) provided the necessary information that ‘When it comes to web design too often perfect, colorful and boxy designs make the cut; however, the reality is different, as it is hard to find objects with a perfect shape and a perfect color in our daily routine.’ Effectively, the final made digitally product has to be finished, clean, without fault and all the details placed precisely with perfection. When it comes to buying website template, for example, the product has to be perfect, without mistakes done by hand. The customer is looking for the best concept and the best idea to make the most effective sales. A perfectly finished website done represents safety and comfort. All the informations is clear, the design is smooth and geometric and the navigation works well. 13
Lennartz (2008) provided the necessary information that ‘Sometimes it’s enough to add just few irregular (or dirty) elements to achieve a more realistic look.’ (fig.20. and fig.21.)
fig.20. Biola Undergrad http://www.hongkiat.com/ fig.21. Boompa http://www.hongkiat.com/
Hand-drawing for webdesign ? Yes, but with moderation Katie Hamness, graphic designer expressed in her article, ‘One of the biggest trends this year has been the return of the hand-drawn look’ (2012). The design world is like the fashion one the things that used to be old fashioned come back into fashion many years later. The websites with glossy elements and with 3D effects aren’t appreciated as much as before, because they are so common place. Sven Lennartz is the Co-Founder of Smashing Magazine. In this article the hand-drawn elements are associated with something friendly and warm. Hand-drawn style and grunge style don’t necessarily mean dirty and not finalized. Indeed, we have to carefully control these natural effects to find a balance with a digital typeface, for example, to complement the hand-drawing style. Creating a website is not the same thing as painting a canvas. The website doesn’t have to look like a work of art or a photograph of a sketchbook. Right here (fig.22 and fig.23.), we can see two bad websites with too much hand-drawn elements.
fig.22. No name
fig.23. No name
http://www.smashingmagazine.com/2008/06/18/hand-drawing-style-in-modern-web-design-volume-2/ 14
Conclusion Drawing by hand will be always a part of the human. Understand and outline the thoughts remains still a challenge for all the designers. Drawing by hand allows the human to keep the connection between his mind with his hands. ‘Any business, regardless of sector and size, use the services of IT to build or defend its competitiveness and market position’. (Translated in english, Ghernaouti-HĂŠlie, S. and Arnaud Dufour, A. , 1999, page 96) On computers, menus and commands gave to the drawing a more intellectual side. In the web design, the drawing by computer and the drawing by hand can be gathered to realise great graphic projects. The drawing by hand is the most important part because put the first idea on paper allows to be clear and confident. How can imagine the future ? Instead to using a mouse, the virtual design process would be controlled by the brain, users would no longer need their hand and pencil. Fortunately, there is still time for every designers to keep drawing by hand.
15
Websites : http://www.hongkiat.com/blog/advantages-pen-paper-computer-design/ Borba, M (2012) Parenting Cyber-Kids: Knowing How to Monitor Their Online Activity. Available at :http://www.micheleborba.com/blog/2012/03/15/parenting-cyber-kids-knowing-how-to-monitor-their-online-activity/ (Accessed : March 15th, 2012) Lennartz, S. (2008) Hand-Drawing Style In Modern Web Design – Volume 2. Available at : http://www.smashingmagazine.com/2008/06/18/hand-drawing-style-in-modern-web-design-volume-2/ (Accessed: 18 June 2008). Lennartz, S. (2008) The Secrets Of Grunge Design. Available at :http://www.smashingmagazine.com/2008/03/11/the-secrets-of-grunge-design/ (Accessed: 11 March 2008). Hamness, K. (2012) Back to the Basics: Hand-Drawn Designs Regain Popularity. Available at : http://absolutemg.com/2012/09/26/handdrawn-design-elements-making-comback/ (Accessed: 26 September 2012). Weber, H. (2012) Why every designer should start with paper, not Photoshop. Available at: http://thenextweb.com/dd/2012/01/11/why-every-designer-should-start-with-paper-not-photoshop/ (Accessed: 11 January 2012). Immersion (2010). Available at: http://www.immersion.com/resources/haptic-whitepapers/index.html#tab=value-of-haptics Gemmell, M. (2010) Finger Tools. Available at: http://mattgemmell.com/2010/08/11/finger-tools/ (Accessed: 11 August 2010). Helmenstine, A-M (2013) Hapticity Definition. Available at: http://chemistry.about.com/od/chemistryglossary/g/Hapticity-Definition.htm
Books : Written in 1995. Appeared in Web Graphics Sourcebook, ©1997 by Ed Tittel, Susan Price, and James Michael Stewart, published by John Wiley & Sons Caraës, M-C. and Marchand-Zanartu (2011) Images de pensée. Paris : RMN. Ghernaouti-Hélie, S. and Arnaud Dufour, A. , (1999) De l’ordinateur à la pensée. Paris. Pallasmaa, J. (2009) The Thinking Hand, Existential and Embodied Wisdom in Architecture. Publisher: John Wiley & Sons. Ghernaouti-Hélie, S. and Arnaud Dufour, A. , (1999) De l’ordinateur à la socièté. Paris.
16
Images : fig. 1. Escher, MC. (1948) Drawing Hands [Lithograph]. [Online]. Available at: http://www.mcescher.com/Gallery/back-bmp/LW355.jpg fig. 2. Child of 6 year old ‘‘What My Dad Looked Like After the Accident”. Using drawing as intervention with traumatized children. Malchiodi, C-A. , p. 5, image. fig.3. Pattern Chinese character, 2010 Available at: http://www.makingfriends.com/biblecrafts/pattern_chinese_characters.htm fig.4. Paleolithic wall art in Lascaux (2012) Available at: http://architecture.desktopnexus.com/wallpaper/180299/ Fig.5. Aurignacian Scraper from the site of the sinkhole Cantalouette Available at: http://www.inrap.fr/archeologie-preventive/Ressources-multimedias/Dossiers-multimedias/ Chronologie/Chronologie-des-periodes-de-l-histoire-et-de-l-archeologie/p-12507-Fiches-chronologiquesversion-texte-.htm?rub_id=8&periode_id=5 fig.6. Pencil, 2011 Available at: http://www.forbes.com/sites/rogerkay/2011/03/23/microsoft-may-have-to-sharpen-its-pencil/ fig.7. Computer mouse (2003-2013) Available at: http://www.wisegeek.org/how-should-i-dispose-of-my-old-computer-accessories.htm fig.8. Wacom Bamboo: pen + finger joint, 2011 Available at: http://www.createlier.org/atelier/archives/1194 fig.9. Hand holding touchpad pc and finger touch (2013) Available at: http://fr.123rf.com/photo_15514085_main-tenant-pc-tablette-tactile-et-le-doigt-le-toucher. html fig.10. and fig.11. Finger Tools (2010) Available at: http://mattgemmell.com/2010/08/11/finger-tools/ (Accessed: 11 August 2010). fig.12. Burton. T. (1990) Edward Scissorshands Available at: http://www.thatfilmguy.net/edward-scissorhands-1990/ fig.13. Greneker, L. (1937) Small Utility Tools Are Attached To Finger Tips [Invention]. [Online]. Available at: http://www.adafruit.com/blog/2011/05/10/small-utility-tools-are-attached-to-finger-tips/) (Accessed: 10 May 2011). fig.14. Adobe Illustrator Tools Icons (2012) Available at: http://www.design-freebies.com/freebies/adobe-illustrator-tools-icons
17
fig.15. Cyclic ligands (2007) Available at: http://www.ccdc.cam.ac.uk/support/documentation/csd/teaching_egs/teaching_ examples.3.84.html fig.16. Pallasmaa, J. Sketch of Icelandic landscape Available at : http://m.architectural-review.com/8641723.article fig. 17. Kentridge, W. (2009) ‘L’artiste au travail’ [Image]. [Online]. Available at : http://www.nplusun.org/blog/kentridge-image-de-pensee/ (Accessed: 23 December 2012). Fig. 18 K4 Laboratory (2012) 50 Beautiful Hand-Drawn Web Design. Available at: www.hongkiat.com/blog/60-beautiful-hand-drawn-web-design/. fig.19. Hand-drawn rectangles for navigation options (2008) Available at : http://www.smashingmagazine.com/2008/06/18/hand-drawing-style-in-modern-web-design-volume-2/ (Accessed: 18 June 2008). fig.20. Biola Undergrad http://www.hongkiat.com/ fig.21. Boompa http://www.hongkiat.com/ fig.22. No name fig.23. No name http://www.smashingmagazine.com/2008/06/18/hand-drawing-style-in-modern-web-design-volume-2/
18
Articles : Hamama, L. and Ronen, T. (2009) ‘Children’s drawings as a self-report measurement’ , Child & Family Social Work, February, Volume 14, Issue 1, pages 90–102 Mimic Technologies Inc. Jeffrey J. Berkley (2003) ‘Haptic Devices’ Vinter, A., Fernandes, V., Orlandi, O. and Morgan, P. (2012) ‘Exploratory procedures of tactile images in visually impaired and blindfolded sighted children: How they relate to their consequent performance in drawing’ , Research in Developmental Disabilities, June, Volume 33, Issue 6, pages 1819-1831 KATHLEEN COULBORN FALLER, LINDA CORDISCO-STEELE, DEBRA NELSON-GARDELL (2010) ‘Allegations of Sexual Abuse of a Child:What to Do When a Single Forensic Interview Isn’t Enough’ , Journal of Child Sexual Abuse Singh, S. and Wadhwa, J. (2006) ‘Impact of Computer Workstation Design on Health of the Users’ Cathy A. Malchiodi , ‘Using Drawing As Intervention With Traumatized Children’ Annie Vinter *, Viviane Fernandes, Oriana Orlandi, Pascal Morgan (2012) ‘Exploratory procedures of tactile images in visually impaired and blindfolded sighted children: How they relate to their consequent performance in drawing’ Roland S. Johansson,*, Anna Theorin, Go¨ ran Westling1, Mikael Andersson, Yukari Ohki1, Lars Nyberg (2006) ‘How a Lateralized Brain Supports Symmetrical Bimanual Tasks’ Jinyi Long, Yuanqing Li, Tianyou Yu, and Zhenghui Gu (2012) ‘Target Selection With Hybrid Feature for BCI-Based 2-D Cursor Control’ PAPER VS. ELECTRONIC RECORDS Immersion, ‘The Value of Haptics’ (2010) Translations : Definition encyclopedia : (Original version in french) ‘‘le dessin est structuré en tant que discours hic et nunc ; l’espace y remplace le temps (caractéristiques du trait, insertion du dessin dans la feuille de papier, sa place, son organisation, son déroulement temporel), la couleur remplace le ton de la parole (agressivité du rouge, tristesse des teintes sombres, angoisse du noir, etc.).’’ La Grande Encyclopédie, Edition Larousse, 1971-1976, page 4196 Kentridge, W. (cited in the french book Images de pensée, 2011, page 27) (Original version in french)‘L’ atelier est un espace fermé...comme un cerveau en plus grand; la déambulation dans l’atelier est l’équivalent des idées qui tournent dans la tête, comme si le cerveau était un muscle que l’on pourrait exercer pour le mettre en condition et améliorer ses performances’ (Translation in english, see Part 2, Drawing by hand is a long path of research) ‘The workshop is a closed space ... like a bigger brain. Wandering in the workshop is the equivalent of turning ideas into his head, as if the brain was a muscle that could be put into practice for the condition and improve its performance.
19
Ghernaouti-Hélie, S. and Arnaud Dufour, A. , 1999, page 96 (Original version in french) ‘Toute entreprise, quels que soient son secteur d’activité et sa taille, a recours aux services de l’informatique pour construire ou défendre sa compétitivité et sa position sur le marché.’ (Version translated in english) ‘Any business, regardless of sector and size, use the services of IT to build or defend its competitiveness and market position’. Videos : Magic at your fingertips : http://www.youtube.com/watch?v=p_9oW81qna8&feature=player_ embedded#! BendDesk : http://www.youtube.com/watch?v=5VNTPwVvLzE Pen touch : http://www.youtube.com/watch?v=9sTgLYH8qWs «Touché» : http://www.youtube.com/watch?v=E4tYpXVTjxA 20 Finger Multi-Touch Technology : http://www.youtube.com/watch?v=ew5URiWrr08
Bibliography Websites : Miller, E. (2013) Designing For Print vs. The Web Available at : http://graphicdesign.about.com/od/printvsweb/a/print_vs_web.htm Sherman, F. (2013) What Is Paper-Based Web Design? Available at : http://smallbusiness.chron.com/paperbased-design-28292.html Center for Health and Healing (2002) Art Therapy - History & Philosophy (2011) Available at : http://www.healthandhealingny.org/complement/art_history.asp (Accessed: 13 Janvier 2011). Definition of hapticity : Centre of Studies & Technical Research of Gipuzkoa (2013) What is a Haptic Device? Available at : http://www.ceit.es/en/areas-of-r-a-d/applied-mechanics/haptic-a-interfaces-with-force-reflection/revima/haptic-device Publishing, D. (1994) Small Business Technology Transfer: Abstracts of Phase I Awards. NetLibrary. [Online]. (page 5) Available at : http://books.google.cz/books?id=RiqMELXJWX0C&pg=PA5&lpg=PA5&dq=A+haptic+di splay+methodology+will+allow+for+high+fidelity+force+feedback+at+reduced+cost+with+a+mechani sm+which+is+inherently+safe+for+the+user&source=bl&ots=4T6EvFvJHC&sig=9AD1Ln0zMUcjsKodr 2ZmcrRdQ7Y&hl=fr&sa=X&ei=89sYUYPwB4em4AS7sICgDA&redir_esc=y#v=onepage&q=A%20haptic%20display%20methodology%20will%20allow%20for%20high%20fidelity%20force%20feedback%20 at%20reduced%20cost%20with%20a%20mechanism%20which%20is%20inherently%20safe%20for%20 the%20user&f=false Mallgrave, H-F. (2011) The Architect’s Brain: Neuroscience, Creativity, and Architecture. NetLibrary. [Online]. (page 13) Available at: http://books.google.cz/books?id=R_fcdlEvXWUC&pg=PT174&lpg=PT1 74&dq=hapticity+d%C3%A9finition&source=bl&ots=oRD9gaPCCs&sig=ldwSWGNFs8yJGreA5knpoCN zoXI&hl=fr&sa=X&ei=ANkYUencGKeF4ASUz4HgCw&redir_esc=y Articles : Huss, E. , Sarid, O. and Cwikel, J. (2010) ‘Using Art as a Self-Regulating Tool in a War Situation: A Model for Social Workers’ , Health & Social Work, August, Volume 35, Number 3, pages 201-208 Maarten, W.A. , Wijntjes, A. Thijs van Lienen a, Ilse M. Verstijnen b, Kappers, Astrid M.L. (2008) ‘Unidentified haptic line drawings are identified after sketching’ Lev-Wiesel, R. , Daphna-Tekoha, S. (2000) ‘Understanding clients’ relations with significant others, silent language and defense mechanisms through the use of color’ , American Journal of Art Therapy, Volume 39, pages 35-40 Payne, MA. (1996) ‘Some effects of sex , age and houseold structure of family drawings of Barbadian Children’ , The Journal of Social Psychology Yuan, H. , Perdoni, C. and He, B. (2010) ‘Relationship between Speed and EEG Activity during Imagined and Executed Hand Movements’ , NIH Public Access 20
Vainio, L. and Mustonen, T. (2010) ‘Mapping the Identity of a Viewed Hand in the Motor System : Evidence From Stimulus–Response Compatibility’ , Journal of Experimental Psychology: Human Perception and Performance Maschi, T , Morgen, K. , Hatcher, S-S. , Rosato, N-S. and Violette, N-M. (2009) ‘Maltreated Children’s Thoughts and Emotions as Behavioral Predictors : Evidence for Social Work Action’ , SocialWork, Volume 54, Number 2 Bohan, M. , McConnell, D-S. Chaparro, A. and Thompson, S-G. (2010) ‘The Effects of Visual Magnification and Physical Movement Scale on the Manipulation of a Tool With Indirect Vision’ , Journal of Experimental Psychology: Applied Tan Ping Hua, Yeong Che Fai, Ricky Yap, Eileen Su Lee Ming (2011) ‘Development of a Low Cost Haptic Knob’ Yuanqing Li, Jinyi Long, Tianyou Yu, Zhuliang Yu, Chuanchu Wang], Haihong Zhang], Cuntai Guan (2010) ‘An EEG-based BCI System for 2-D Cursor Control by Combining Mu/Beta Rhythm and P300 Potential’ Ki-Uk Kyung, Dong-Soo Kwon, Gi-Hun Yang (2006) ‘A Novel Interactive Mouse System for Holistic Haptic Display in a Human-Computer Interface’ , Iinternational Journal Of Human–Computer Interaction Saltuklaroglu, T. and Kalinowski, J. (2005) ‘How effective is therapy for childhood stuttering? Dissecting and reinterpreting the evidence in light of spontaneous recovery rates’ , International Journal of Language & Communication Disorders