Thursday, December 17, 2015

Study Task 08 - Design Principles - Typesetting

Re-typeset Lewis Carroll's - A Mouses Tale using a postmodern approach and a modernist approach.

Modernist Typographic styles are typically very ordered and precise with little room for character, meaning the type hardly ever has a personality of its own. Modernist typography is set to create order, legibility and clarity, not to convey meanings through its physical appearance.

These are the elements that you will commonly find in modernist typography:

- Grids, Margins and Columns
- Standardised Typefaces
- Consistent type Size & relationship
- Control over orphans, widows & rivers
- Legibility and Readability

Post-modern typography on the other hand is very different. Words and phrases are set to leap out at you from a page with their own individual personalities and messages. Colour, layout, size and style all play a part in expressing the message of the type; not just the meaning it is spelling out.

It is about communication and as David Carson puts it: 'Just because something is legible doesn't mean it communicates, and more importantly, doesn't mean it communicates the right thing.
These are the elements that you will commonly find in post-modern typography:

- Breaking the rules
- Expressionism
- Concrete Poetry

Concrete poetry, pattern poetry or shape poetry is a form of post-modernism where the poem physical takes the shape of elements relating to the poem. The typographical arrangement of words is as important in conveying the intended effect as the conventional elements of the poem, such as meaning or words, rhythm, rhyme and so on.



For study task 8 we were given Lewis Carol's poem, 'The Mouse's Tale' to typeset in both of these typographic styles, practically exploring the ways in which they differ. 
For the modernist approach I kept the writing flushed left, to reduce the stress on the readers eye, allowing it to travel back to the same place at the start of each new line.
I then considered line length. I didn't want the lines to be too long or short as both of these factors can effect readability however I also needed to be aware of the natural breaks in the content of the poem and keep my eye on the rough edge of poem (on the right hand side).  
In the end I finished up with quite short line lengths, however the overall appearance was still neat, legible and clear to read. I had to also watch out for orphans and widows when rearranging the text to fit within the lines. It is clear I had some difficulty in the 2nd/3rd lines of the poem, not sure whether to keep as one line or split in to two as you can see.


I found the concrete poetry / post-modern approach much easier to typeset, though that too came with some difficulties.

I used the approach of filling the shape of a mouse with the text from the poem and added a head to make it actually look like a mouse. I think it worked quite well is terms of appearance however legibility and readability is somewhat reduced. Kerning on the tail was also an issue and keeping the spacing between the lines consistent was an issue.





OUGD405 - Studio Brief 02: What makes a successful leaflet?

I conducted research into the main elements that made a good leaflet at :

https://leafletdesignprint.wordpress.com/2014/10/03/leaflet-design-tips/#more-3

#1. Your leaflet is only as good as your creative brief


Every good leaflet starts with a well thought out brief that details the objectives the leaflet needs to achieve. Before creating a leaflet you need to consider all of these essential areas: 

Where will you display or distribute you leaflets?
- What size leaflet will best fit your needs? 
- What do you want to achieve with your leaflet? What is the point of it?
- Audience – who will your leaflet be aimed at?
What do you want your leaflet viewer to do?
- What will be the main Call To Actions so that it’s clear how your audience can take things further?

#2 AIDA: Attention, Interest, Desire, Action

AIDA is a popular acronym used in marketing that describes a common list of events that should occur when a someone engages with effective marketing material. It is definitely worth bearing in mind when getting together headlines, body text & imagery for a leaflet.


A – Attention (Awareness):
which implies you need to attract the attention of your audience. What will appeal to them?
I – Interest:
to raise customer interest by focusing on and demonstrating advantages and benefits, in addition to features.
D – Desire:
convince your audience that what you are offering is of interest to them and they should keep your leaflet.
A – Action:
lead customers towards taking action and doing something. So make sure your leaflet follows the AIDA formula!

#3. Making a good first impression…

There’s a lot of competition in promoting something these days and it’s therefore imperative that you make a good first impression with your leaflet. There will be other leaflets on the shelf next to yours and you have to compete for the viewer's attention to grab yours. To make a good first impression – there are 2 facets of it – design quality & grabbing attention with a good headline and/or hero image.

#4. Why Design Quality Matters


Firstly – the design quality (look & feel) – instantly signifies the quality of a product or service.  An unprofessional looking leaflet instantly signifies an unprofessional service/business/product being promoted in the leaflet. Cheap, poorly produced leaflets quickly get thrown in the bin as we just instinctively know, through the poor quality design that it’s not a professional and trust-worthy/reputable service we are likely to use. Therefore you must carefully consider elements like paper stock and production. 


#5. Interesting & Engaging Content

As well as the look or the design, the leaflet also needs to have substance – and this substance comes through wise choice of text and imagery, which is chosen to match your communication objectives and appeal to your intended target audience.

Leaflet Text – Consider what is really going to be of interest to your audience? As ever when presenting text, remember less is always more, as too much info, and a leaflet that is too text dense – just doesn’t look as inviting to read and can put people off. You need to convey your messages with immediacy, brevity and clarity. The copy should not be in bulky paragraphs, you need short, sharp statements, bullet points and bold headings.  

Leaflet Imagery – We’ve all heard the saying “pictures tell a thousand words”, and with the small space we have on a leaflet – the use of images are a great way to promote your 
information in a small space. As we do not want to overwhelm the reader with too much text copy in your leaflet; the idea is to wet the appetite. And nicely taken (professionally if possible), images are a great way to catch attention and break up your text. Pictures are key to instantly making your audience aware of exactly what it is your leaflet is about within seconds and affecting that all important decision – whether to actually pick up and read your leaflet. So use images that reinforce your services and are relevant to the text so they attract the right audience.

#6. Call to Action

A Call to Action is the means by which a viewer will take further action upon seeing your leaflet (such as visit a website, or call a phone number) – and every leaflet should have a call to action. 

#7. Proof your leaflet. And again.


Nothing says amateur like spelling mistakes; it might seem obvious but copy checking should be standard for anything going out to the public – so don’t be afraid to proof your leaflet a couple of times, or even better get someone else to help you with it as they will look at it with fresh eyes.

#8. Printing & Papers

Once you have the design sorted, and everything is looking great and reading well – you need to get it printed. You need to think about the paper to be printed on. What finish will fit the design approach? Silk? Gloss? Matt/Uncoated stock? What paper weight? Bearing in mind that heavier paper costs more, but could signify better quality, but would also make a batch of say 5000 leaflets weigh a lot more (if delivering by hand). Also does it matter if your leaflets flop in the hand or when stood up? Do you need sturdy paper? These are all design elements that need to be carefully considered. 

Other areas to consider: 

Core colour palette: Use of colour a is great way to attract people but stick to a core colour palette – which compliments the information – but also gives a distinctive look to the leaflet to help it stand out.

Relevant Fonts: With regards to fonts – consider how you want the font to make the leaflet appear, weather that look is stylish, elegant, quality, understated, refined, funky, cutting edge….you get the picture! Don't go over the top with different fonts. Only use 1 or 2 font families – so the leaflet doesn’t look like a dog’s dinner and to help with creating a distinctive visual style.
 

Wednesday, December 16, 2015

OUGD405 - Study Task 3: Public Service Video



I chose the 1976 'Rabies Outbreak' video to analyse for this task. 


Message:
You must never smuggle animals into the UK from another country as they are at risk of carrying the rabies disease, and therefore are in danger of infecting British animals with the disease. Also if you know of anyone who may have smuggled animals into the country/ is intending on, you must report them immediately to the police. 
Key Facts:
If rabies came to britain:
  • All dogs would be leashed and muzzled
  • Foxes would be destroyed and all wildlife would be at risk
  • No animal would be moved in or out of the infected area
  • All cats would be restrained and made to be kept indoors/under surveillance 
  • Any loose or stray animal would be seized, taken away and destroyed if none was to claim it

Tone of voice:
The tone of voice is very serious and aims to scare viewers as a deterrent of rabies. Short, harsh sentences like "Rabies is a killer" and "Keep rabies out" are sharp, clear messages that shock viewers and clearly get the message across. Rhetorical questions like "Could you imagine being scared of every friendly animal you came across" make the viewer think and simulates a world where rabies is a real threat.
Audience:
The audience is anyone who may be planning on travelling to another country or who knows someone who may have recently got back from another country and could have smuggled an animal back into the country. Mainly however the target audience would be 16+ yrs.

Thursday, December 3, 2015

OUGD405 - Studio Brief 01: Wayfinding Development

Aims: Before I went any further in designing my way finding system I wanted to go over the brief and outline the deliverables.
  • A functional navigational wayfinding system for your selected environment, informed by thorough research and development.
  • The identification and selection of an appropriate, consistent typeface. Consideration of appropriate type styles and sizes for specific uses.
  • The development of appropriate pictograms for directions and identification of facilities.
  • The identification and selection of a limited and appropriate colour swatch with associated PMS, CMYK and RGB values.

INITIAL IDEAS

By exploring a variety of ideas for a way-finding system in the Light I developed a few possible concepts that I thought had potential. 




The first idea was to mark out the floor number and establishments on each particular floor with large 3D metal numbers. The numbers would stand at the top and bottom of the escalators and next to the entrances and have the names of the establishments on that floor engraved onto the side. The drawbacks to this design are that you can’t see where other shops and restaurants are in the building and legibility would be hindered from a distance. 



A different idea was to have a starting point in the centre of the room and have a number of different trails running off from it in the direction of the different establishments.

These trails would either be painted onto the floor,  vinyl stickers or light bulbs built into the floor. 

The issues with this design were that the floor is made of marble and stone, therefor paint or vinyl sticker would clash wth the natural colour of the floor and lights would not show up very well in daylight hours. Another issue with this design  is the the “pathways” could get crossed over and there are too many different establishments on each floor for the system to be easy to understand.  Also, visitors would never use the same starting point each time and always enter from different doors. Following the pathways would also stop customers browsing in different shops.



Similar to the metal numbers idea, another concept was to make use of the brick walls in the Light by painting giant numbers onto the walls, again listing the various establishments on that floor. These would act as only part of the wayfinding system, and be  more decorative than informative. However it would allow customers to quickly decifer what floor they were on and what establishements were on that floor.



The use of directional signs and markers in the Light would be hindered by the building's architecture with it's high ceilings and wide open plan spaces. Therefore a different strategy needed to be made to help guide users through the environment. Making changes to the existing wayfinding stystem so it was more legible, easier to understand and had a more consistent design, seemed like the most appropriate path to go down. 

Designing a map that had the floorplan for all 4 floors on each map rather than just the currrent floor like the existing maps would increase the legibility of the current way finding system in the Light. Redrawing the floorplan using clean, straight, lines and a consistent use of line weights, colours and typefaces would also improve the effectiveness of the current system. To decipher which floor the visitor was stood on, the design would incorporate some form of  highlighted section to allow that particular floor to stand out on the map. This could consist of exaggerating the details on that floor, making it glow, using a different colour or blocking the other floors out. 


A slightly more off the wall idea was to create a ‘Lightbulb Tree’ which would point customers in the direction of their desired establishment. 

The ‘branches’ on the tree would point in varied heights and directions of specific establishments in the shopping centre for visitors to get a rough idea which way to go. Issues with this design however included how to display place names on the lighbulb tree, how to make the tree legible and understandable from a distance and up close amongst a number of other design floors. Therefore I decided against following up this idea.

After looking through my initial designs and calculating their plausibility and usability, I decided to continue with 2 of the ideas: 
  1. A series of floorplans illustrating the establishments on each floor
  2. The Painted wall numbers 

PICTOGRAMS

Before making a start on the floor-plans a series of pictograms had to be designed. These included:

  • Toilets: male / female / disabled
  • Lifts
  • Escalators 
  • Carpark
  • Fire Exit

These are the initial sketches for the escalators [on the left] and the car park [right]. I wanted the designs to be more unusual than regular symbols as the Light is a more upmarket establishment, so a more refined and elegant set of pictograms is required.


Above are the sketches I made for the toilets and lifts. 

By developing the initial sketches by making them into vectors using illustrator I could test the pictograms legibility at different scales aswell as making them look much more professional and ready to be applied to signage around the building. 

The designs in vector form:


Lifts / Toilets / exits




Stairs / Escalators / Car Park

Above are the final pictograms.

FLOORPLANS

By tracing over the photographs I had taken of the preexisting floorpans in the Light using Illustrator I could begin creating a set of vector drawings for a new way finding system. 

Instead of using hand rendered effects I kept the lines clean and minimalistic by using consistent line weights and strokes. Doing this created a more modern and refined design than the one currently in use at the Light.

This was the initial skeleton for the layout of all 4 floors: Courtyard Level, Arcade Level, Balcony Level and Upper Balcony. 









Incorporating symbols into the design was also a crucial part of the floor-plans readability. I had to consider which symbols needed to appear on the floorplans and whether to include the names of the establishments within the diagram or to use numbers, or letters.

Using names or the company’s logotypes would make the design too cluttered so in order to keep the design minimal the floorplan would feature numbers for the establishments, similar to how the floorplans at the Trinity Cente work. 


By studying the Light’s pre-existing floorplan I could see it was successful how landmarks such as the street names outside the doors could be used as reference points for visitors, therefore I decided to also include them in my map. 

The floorplan element of the map consists mainly of numbers and pictograms such as the lifts, esclators and toilets as not to over complicate the design referring back to the main design principles for a successful navigational system. 

  • Do not make them think
  • Create a comprehensive, clear and consistent visual communication system with concise messaging.
  • Show only what is needed
  • Show information what relevant is to the space, location and / or navigation path.
  • Remove excessive information
  • Remove unnecessary elements to create a clear visual environment ahead.
[http://designworkplan.com/wayfinding/introduction.htm]


The establishments were numbered in the top left corner of each rectangle to keep the design, consistent, legible and easy to read. Aswell as this Street names, directional arrows and directions to other levels in the building were added to the design.

The order in which the floorpans should appear was also a crucial element of the design regarding legibility  At first I wasn’t sure whether it should be laid out in physical order or order of readability (from top left to bottom, with ground floor being at the top. )

After referring back to my primary and secondry research I found that the majority of floorplans designed in this way were laid out in their physical order with ground floor being at the bottom of the map.

This led me to shuffle the entire design around resulting in this:




A list system was then needed to work in conjunction with the floorplans explaining which establishments are on each floor allowing visitors to easily find their way around the building. 



This is how I envisioned a map of my floorplans to look with a column of large numbers in a serif font indicating the floor levels so visitors could easily determine where they wanted to be. At the moment the Light does not use floor markers such as these to determine the different floors. Their system consists of Courtyard Level, Arcade Level, Balcony Level and Upper Balcony. To new customers this could be a potentially confusing system as they wouldn't know which level is positioned there purely from reading the names. To get around this a combination of the floor name and floor level would be used in the design. 

A coded list of establishments that corresponded with the numbers on the actual floor plan itself would run down the middle column.

The floorplans would then run down the right hand column in order of physical appearance, ground being on the bottom and the third floor being at the top. 





For the large floor numbers I wanted to find a sophisticated, yet slightly unusual serif typeface that would be easy to read from a distance, yet add an elemenent of style and elegance to the design. 

After searching through various typefaces on DaFont Mike Diehl and Paul Volk’s 1991 font ‘Edition’ particularly stood out. 

The elements about this font that struck me were it’s long tall capheight and ascenders, which resonated with the building’s architecture with high ceilings and tall glass windows and doors. 

Its varied line weights, especially on the 2 also stood out to me.  I felt the other typefaces I had looked at (the bottom 4) were all a bit too chunky and art deco and didn’t really give off the sleek, elegent tone I was trying to portray. 

The serif element to the typeface was also crucial for the design as I have learnt in previous study tasks, adding a serif to a letter form allows it to become slightly more legible to the viewer, and when reading my floor plan from a distance I needed my typefaces to be as legible as possible. 




Next I had to choose a typeface to use to display the floor level names eg. Arcade Level, as to not confuse pre-existing customers and regular visitors and to also display the names of the establishments. 

I went back through my research to see what had worked effectively on other designs such as the floorplans for the Trinity Centre and Leeds Art Gallery, and found that sans serif fonts were regularly used for the smaller sections of text. 

However referring back to previous research for other projects, when it came to smaller printed text a serif font had always been more fsvourable as the most legible. 

Therefore, for my design I chose a typeface that encompased elements of both serif and sans serif typefaces. The font I went for was Andale Mono, a monospaced sans-serif typeface designed by Steve Matteson. The interesting thing about this typeface was that it has slight serifs on letters such as the g, i , j and l. 

The typeface is also has some other unusual characteristics such as a dot inside the zero.



Experimenting with just upper case and a mixture of both upper and lower I found that a mixture worked better for legibility and was also used in the other way-finding systems I had studied. 

COLOUR SWATCHES


I wanted to keep the colours for my wayfinding system in the light, earthy and timeless yet modern aswell so it wouldn't  clash with the building’s architecture. 

Currently the building uses a whole host of colours in their colour scheme consisting of pink, yellow, burgundy and light blue. 



Not only does this look unrefined and clumsy but it also creates an inconsistent way finding system. 

I wanted my colour palette to seamlessly blend in amongst the stone and brickwork of the building creating a timeless wayfinding system to be enjoyed by it’s visitors for years. 

For this reason a neutral colour palette of charcoal grey and white was the most suitable for my design. Specifically the colour #46464

COMBINING DESIGN ELEMENTS

This is where I started experimenting with putting all the elements of my floorplan together, considering composition, scale and colours. 

The order of establishments goes in clockwise order / starting at top left then going down around the floorplan. This is easier to understand than listing the establishments in alphabetical order on each floor as there are not that many buisnesses in the LIght so finding a specific establishment would not take too long. 

Using a dark charcoal background with the writing and floorplans laying on top in white for increased legebility. Muted, earthy tones resonate with the materials used in the building’s architecture and allow the design to remain timeless despite passing trends and fashions.

Experimenting with a number of different designs to help the visitor establish which current floor they were stood on, enabled me to choose the most appropriate outcome. 

Using a dotted line between the names of the establishments and their corresponding number aided with legibility as it helped the eye travel across the layout easily and naturally without getting lost.

Here are a few experiments of floorpans using different techniques to highlight specific maps.



This design shows a backlight to highlight the current floorplan and floor number while the others remained just painted/engraved.





Here, a completely different approach of blocking out the details on the other floors and just leaving filled-in outlines looks quite effective aesthetically, however it is not practical and almost draws the viewer’s eye away from the current floorplan. You also can’t see where anything on the other floors are positioned, which may hinder the wayfinding experience. 


This design softly highlights the current floorplan by using a lighter grey background behind the map.  


For this floorplan adding a bright orange to the current floorplan introduced a touch of colour into the design and brings it to life. The issues with this design however is that the colours clashed slightly with the elegant yet earthy colour palette of the building's architecture and that of the rest of the design.


The most effective floorpan was the one that used a backlight to highlight the current floorpan as it is clean, elegant and minimalistic subtly highlighting which floor you are on, yet it is easy to read the information for the other floors if you want to. 

Using Photoshop allowed me to test how the design would look in it’s environment using by creating a stand and positioning it over a photograph of the Light. 

I applied it in two different formats to test how well it would work against a wall and as a stand-alone piece of signage. 



At first I was concerned that parts of the sign such as the ground floor section would be too close to the floor and hard for visitors to read as it would mean them having to bend down to view the information. 

Positioning the map on a plynth helped with this drawback. 

The small projected ‘shelf’ also displays the current floorplan the visitor is stood on, further aiding legebility. 




The signage would be positioned on the wall between 900 and 1800 mm above the ground for maximum legibility to the broadest target audience. 

It is important to not have the signage too low in crowded areas such as walkways as signage may become obscured and customers may feel pressured to rush when stopping to look at the information as to not be in the way. 

This is how the final pictograms look when combined with the colour scheme. The shapes successfully stand out against the dark background and would be easily legible from a distance, as the contrast between the symbols and signage would be high. 



I then tested the legibility of the designs by photoshopping them into their chosen environments to see how they would look.


One possible application of my design could be the use vinyl stickers to apply my pictograms to their environment

Vinyl stickers are an excellent alternative to paint and stencils for the following reasons:

•  Require no paint, no paste and leave no residue. They are a lot cleaner and easier to apply. 
•  Affordable, they are instant to apply and wouldn't require a professional decorator. 
•  Easy and quick to remove without damaging the wall or paint. 
•  Available in a wide range of colours, sizes and shapes.



This gives a sense of how the car park pictogram would look when applied to a glowing sign, demonstrating how effective it would be in different mediums.



Lift Pictogram applied to a brick wall, demonstrating how it would work as a stencil.



Fire exit symbol applied to glowing neon sign.