Typesetting

Literature

Research & Planning

Disaster in Greenwich.mov https://drive.google.com/a/greenwich.ac.uk/?utm_source=en&utm_medium=button&utm_campaign=web&utm_content =gotodrive&utm_term=carousel&usp=about_start&urp=https://www.google.co.uk/#folders/0B6KazXrmxpRPcXdxeUZT eHBLOG8 By Alana Foley-Keane 1

Contents

 Introduction  Chosen text: Love & Marriage, By Frank Sinatra  Exploring Typography Art  Mood board (exploring the lyrics)  Lyric breakdown  Colour Inspiration  First Mock-up  Final Design Inspiration  Final Design  Colour Palette  Font faces  Deliverables  References

2

Introduction

For this piece of coursework, we have been asked to choose a piece of text either a passage from a novel, a poem, or lyrics from a song and expresses the meaning of text through colour, and typography only. Images are banned from this project, yet we are able to use numerous CSS rules to help express meaning to the text.

For my piece of text, I have chosen to use a Frank Sinatra ‘Love and Marriage’ song as I am a big fan of his music, and I feel these specific lyrics will allow me to experiment with font styles, and layouts as there are some phrases I can visually express using typography, and CSS rules. For example:

You can't have o n e without the other

I also chose this song as it links to my Nan & Grandads passing away, and thought it would be a nice opportunity to include them into my thinking processes and pull inspiration from their own relationship, and wedding photographs.

3

Chosen text

Frank Sinatra - Love and Marriage lyrics (Songwriters: JAMES VAN HEUSEN, SAMMY CAHN)

Love and marriage, love and marriage Go together like a horse and carriage This I tell you brother You can't have one without the other

Love and marriage, love and marriage It's an institute you can't disparage Ask the local gentry And they will say it's elementary

Try, try, try to separate them It's an illusion Try, try, try, and you will only come To this conclusion

Love and marriage, love and marriage Go together like a horse and carriage Dad was told by mother You can't have one without the other

4

Exploring Typography Art

Just to get the ball rolling I began searching typography art pieces to spark some imagination for my typesetting project. I have included the ones that most interested me below even though there not very suitable to the coursework brief as the typography are creating image silhouette. Yet I thought this would be the best way to explain my thought process throughout the project.

5

Exploring Typography Art

6

Mood Board

So this is just a little mood board I have come up with exploring the lyrics, and imagery I would associate with the song lyrics, to help spark some themes I can use to influence my typesetting literate piece. I have also included some scanned images of my Nan and Grandads wedding, as like I said at the beginning of the project I wanted to use them as a source of inspiration, and there marriage took place around the time Frank Sinatra was in full swing.

Like a horse & carriage Reference to the olden day’s way of transportation

Very interested in Old styled fonts this contemporary, almost pop art twist on Frank Sinatra portrait

7

Lyric breakdown

On this page, I have just broken down the lyrics, focusing

on which words need to be more emphasised than other using typography and size to help create a rhythm through the song. Please read my written annotation, to understand my way of thinking through the lyrics.

8

Colour Inspiration

For my first mock-up, I was highly inspired by Broadway shows, theatres, and the show ‘Bewitched’.

My reasoning behind using the show ‘Bewitched’ as an influence was that I thought it fitted well with performing arts as seen in Broadway shows, and Frank Sinatra performing background. Likewise, ‘love’ is a magi cal thing, there are no explanations behind it, or physics to understand it similar to the witch in ‘Bewitched’.

Broadway shows inspired my colour inspiration, and typography choices

the song itself has a fun beat to it, almost ‘bibbidi bobbidi boo’ rhythm

therefore wanted to portray this through my visuals, similar to how Broadways programmes advertise there shows through visuals.

9

First Mock-up

As you can see below, this is my first mock-up of the design. I have used a variety of typefaces depending on the visual message I want to convey. In terms of composition I have aligned it to the left as it is not a poem, and wanted my reader to read it in a ‘bibbidi bobbidi boo’ rhythm, and then towards the end the lyrics start to step across

the screen to show the song is coming to an end.

10

Final Design Inspiration

After receiving feedback from my lecturer, I decided to take a different path in my design, and influences. In terms of typography, and colour influences I looked towards Frank Sinatra’s old album covers, and the font faces used on his poster for inspiration. Which then lead me on to look into old styled newspapers hence the reason for sepia tones, and a large range of typefaces. It was a little risky using up seven different typefaces yet I think it worked well with the song lyrics, as different styles, and fonts have been used to portray certain emotions, or help to give indication to the reader on how to read through the lyrics, and when to pause at the appropriate times.

11

Final Design Inspiration

Here you can see screenshots of websites that have influenced my final design. I started to look towards print-based influenced websites as I wanted to portray an old

school sepia toned website

replicating some of Frank

Sinatra album covers.

12

Final Design

My final design uses sepia, pink colour palette. My reasons behind this was I wanted it to replicate the 40’s, and 50’s,the time of the singer and his greatest hits, and also the hint of pink in the brown to symbolizes a women’s touch. I did not want it to look to masculine, as it is essentially a love story.

13

Colour Palette

As mentioned previously I used a variety of sepia tones, and

allowed my research images to influences my choice of colour to

help set the mood accordingly.

14

Font faces

I used a wide range of web fonts for my design. As I wanted to try to re-create an old styled newspaper, I have used some bold typefaces, yet some handwritten styled typefaces to portray certain emotions in the song. Please view my lyric breakdown to understand my decisions fonts, and expanded line heights…etc. It was a bit risky to include six different font faces as it can

lose consistency throughout the design. Yet I feel I have manage to pull it off well, considering the site does have a flow, and

the chosen typefaces complement each other to a certain extent portraying the era of Frank Sinatra.

Font -family’s: 'Dancing Script', cursive; 'Old Standard TT', serif; 'Sancreek', cursive; 'Pirata One', cursive; 'Dawning of a New Day', cursive; 'Fredericka the Great', cursive;

15

Deliverables

I have successfully met the criteria and have created website focusing on typography, and colour, containing x3 pages (The lyrics, The Inspiration, and About the Artist). My design is also responsive from mobile devices, to large computer screens.

16

References

Exploring Typography Art References: http://ragheb-abuhamdan.deviantart.com/art/typography-poster-369898316 https://www.etsy.com/uk/listing/172678639/frank-sinatra-the-best-is-yet-to-come?ref=market http://silverthornz.deviantart.com/art/Evolution-of-Typography-186361560 http://crzisme.deviantart.com/art/World-Map-Typography-262638545 https://www.behance.net/gallery/13762869/Henrietta-Lacks-Event-Poster http://webneel.com/webneel/blog/25-amazing-typography-graphic-designs-your-inspiration http://blakeestes.deviantart.com/art/Calvin-Harris-Typography-352002956

Mood Board References http://t40siwntw4ng7.deviantart.com/art/Frank-Sinatra-better-30460699 Images used from Nan & Grandads own wedding https://www.trails.com/how_11328_sailboat-rope-splicing-instructions.html

Colour Inspiration References http://mentalfloss.com/article/59789/14-things-you-probably-didnt-know-about-bewitched http://www.deviantart.com/tag/bewitched http://www.playbillstore.com/wisopr.html

Final Design Inspiration http://www.examiner.com/article/frank-sinatra-told-george-michael-to-loosen-up https://www.pinterest.com/scottwampler/sinatra-album-covers/

Final Design Website Inspiration http://www.lordlikely.com/ http://www.dollardreadful.com/ http://www.teamfannypack.com/ http://radio.nymoon.com/ http://www.cirq.com/

17