This exercise involved looking at examples of information graphics. I must admit I’d never totally considered infographics much in the past but looking now they really are all around us. I chose to design an infographic based around my journey to work/ desk. My tutor sent me some links to a website on visual complexity – an online community which showcases the best in data visualisation and infographics. This site is packed full of really interesting and sometimes pretty complex infographics. From looking at it I decided that I wanted to try do something quite graphical and representational. http://www.visualizing.org/explore#featured=1&sort=recent I also looked at They Draw and Travel – a site where people post illustrated maps of cities/ places they’ve visited. The majority of these are more designed to be visually attractive and illustrated rather than give a more graphical representation but I still think the site was worth looking at. The two approaches to depicting the info are quite different but I decided I wanted to try something which was quite technical looking and striking (well I can but hope!) I took some images of Primark in Glasgow which had these illustrated maps of the city. These are more for aesthetic purposes. From my various searches I decided to put together a mood/ idea board for reference. Info graphics mood board- decisions designers made, appropriateness http://www.creativebloq.com/graphic-design-tips/information-graphics-1232836
Online image Accessed 8th March 2014 https://www.behance.net/zhiliang
Hongkiat 2014 50 Informative and well designed infographics Available from http://www.hongkiat.com/blog/50-informative-and-well-designed-infographics/ [Accessed: 18th March 2014]
The next part involved us describing our immediate surroundings using information graphics. I was deciding whether to do my desk or my morning journey as they both would require quite different approaches. The journey is more of a map and I think I’d want to try to be fairly accurate with my surrounds in terms of where they are located. The desk on the other hand would immediately to me be more of a drawing. Anyway I started with my journey to work and considered the main points on my journey , thinking about landmarks and key information and filtering information that wouldn’t be essential for the graphic. – landmarks , glasgow church , traffic lights, homeless man, hill , gft, steeple,art school crane – What helps me on my journey, fuel, ipod, book – Weather I encounter As I made a start with sketches I was trying to keep in mind the various examples of infographics and what elements they included and made them effective. To start with I think I was focusing on it being almost like a map of my journey but the purpose really is to give information about my journey – not really to map the route. I also thought that infographics don’t necessarily need to show a lot of information but just info in a really clear and interesting way. A lot of the ones I’ve looked at above include statistics or are trying to chart some information. I decided to break it down into stages. 1. What do I want my infographic to say/ show – how much info is there 2. How can I get this across in a simplified way using graphics Break my desk down – Food stuffs, Art materials, Supplies – coke etc, The hub (the computer/ my internet) – everything is close at hand – hands reaching out, chair, mouse, cup on window ledge, notepads, something to show the tabs on my computer – overload/ facebook, categorise them – keep simple I also found some online editors to create your own infographics and that and looking at these in combination with my boards I was able to come up with numerous options for both the desk idea or my journey to work. http://piktochart.com/ I sketched out some ideas and had a few which had potential .
My next hurdle was thinking about how to create the graphics themselves. I decided Illustrator was probably my best shot but I’m not overly experienced using it so knew there would be a bit of a learning curve. I did some searching on online illustrator tutorials to get a feel for some of the methods. It was during this process I came across the work of Paul Butt. This tutorial looks great and his work is truly beautiful to look at and in its precision. To try at somepoint – http://www.digitalartsonline.co.uk/tutorials/adobe-illustrator/design-magazine-infographic/
Online image accessed 9th March 2014 http://sectiondesign.co.uk/comic-book-movies All images Paul Butt http://sectiondesign.co.uk/ I felt a bit overwhelmed looking at the tutorial but was thinking I’d start off using Illustrator on a more basic level!! I also came across this which was reminded me of my typography magazine cover.
PSFK Illustrated History of Typewriter 2014 http://www.psfk.com/2014/03/an-illustrated-history-of-typewriter-design-infographic.html [Accessed 19th March 2014]
The sites below are great for looking at inspiring infographics. http://dailyinfographic.com/ http://www.fastcodesign.com/section/infographic-of-the-day http://www.coolinfographics.com/
I also liked this one which is quite relevant to some of the upcoming exercises on logo and branding
PSFK Brand Logo Design http://www.psfk.com/2014/03/brand-logo-design.html [Accessed: 20th March 2014]
I started with my desk and mapped out what I thought were some things I’d like to include. At the centre of my desk is my computer surrounded by items which I use regularly. Thinking about linking the elements bringing in colour to try categorize the items Background wood effect . I created the majority of the little icons in Illustrator which was a minor achievemment. I was particularly pleased with the mini teddy. I tried to think how the info would be read and the hierarchy of the elements. With the computer being the biggest item, its the item that you are immediately drawn to and I would say thats the most important item on my desk.
Using lines with rounded corners to link the items. I created these in Illustrator first using the rounded corners option for a line (note for self for future projects) . Felt like this was getting somewhere.
Different layout moving items to the side and introducing a few new objects. Trying to link with a different map of my desk.
Throughout these I was continually thinking – Do they communicate something visually which is relatively clear and easy to understand . I decided I also wanted to try another few styles of infographics and decided to experiment with depicting my journey to work. I tried to stick with a bright and interesting colour scheme. Again, I created the majority of these vectors in Illustrator . The Gills Sans text is nice and clear easy to read with Franklin Gothic used for the labels with different colour. I think initially I had thought I wanted to create something more technical/ statistical looking, but in reality the information I wanted to show didn’t really fit into this category and I feel that the desk image and the journey to work , break down the information in a way which is easy to understand.
I also decided to take a completely different slant and try a sort of map version / journey giving some more technical information. Again, I think this has some promise but I prefer the other layout as above.
Overall, I think my examples are quite clear infographics which are relatively interesting to look at. However, I’m aware that they are more picture / symbol based than purely type/ numbers/ colours as outlined in the brief. That being said my examples are certainly infographics and for the information they depict are quite suitable as I don’t think something overally technical would have been as good to look at. If I was to do this exercise again I might try focus more on using purely Type perhaps selecting fonts/type with different properties to convey different items/ elements. Eg slanty font for walking up a hill, TYPEWRITER font for my computer etc
After tutor report
Reflecting on my tutors comments about this exercise I do take on board that perhaps the desk examples look a bit too clip art like and don’t really say anything new or different about me whereas the latter journey to work examples have more information in them and in doing so have a better level of resolve.