typesetting literatureeyelearn.org/ma-stu-gallery/typeproj-2016/alana/... · lyric breakdown on...

17
1 Typesetting Literature Research & Planning By Alana Foley-Keane

Upload: others

Post on 04-Jun-2020

1 views

Category:

Documents


0 download

TRANSCRIPT

Page 2: Typesetting Literatureeyelearn.org/ma-stu-gallery/typeProj-2016/alana/... · Lyric breakdown On this page, I have just broken down the lyrics, focusing on which words need to be more

2

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

Contents

Page 3: Typesetting Literatureeyelearn.org/ma-stu-gallery/typeProj-2016/alana/... · Lyric breakdown On this page, I have just broken down the lyrics, focusing on which words need to be more

3

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.

Introduction

Page 4: Typesetting Literatureeyelearn.org/ma-stu-gallery/typeProj-2016/alana/... · Lyric breakdown On this page, I have just broken down the lyrics, focusing on which words need to be more

4

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

Chosen text

Page 5: Typesetting Literatureeyelearn.org/ma-stu-gallery/typeProj-2016/alana/... · Lyric breakdown On this page, I have just broken down the lyrics, focusing on which words need to be more

5

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.

Page 6: Typesetting Literatureeyelearn.org/ma-stu-gallery/typeProj-2016/alana/... · Lyric breakdown On this page, I have just broken down the lyrics, focusing on which words need to be more

6

Exploring Typography Art

Page 7: Typesetting Literatureeyelearn.org/ma-stu-gallery/typeProj-2016/alana/... · Lyric breakdown On this page, I have just broken down the lyrics, focusing on which words need to be more

7

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

Old styled fonts

Reference to the olden day’s way of

transportation

Very interested in this contemporary,

almost pop art twist on Frank

Sinatra portrait

Page 8: Typesetting Literatureeyelearn.org/ma-stu-gallery/typeProj-2016/alana/... · Lyric breakdown On this page, I have just broken down the lyrics, focusing on which words need to be more

8

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.

Page 9: Typesetting Literatureeyelearn.org/ma-stu-gallery/typeProj-2016/alana/... · Lyric breakdown On this page, I have just broken down the lyrics, focusing on which words need to be more

9

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 magical 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.

Page 10: Typesetting Literatureeyelearn.org/ma-stu-gallery/typeProj-2016/alana/... · Lyric breakdown On this page, I have just broken down the lyrics, focusing on which words need to be more

10

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.

Page 11: Typesetting Literatureeyelearn.org/ma-stu-gallery/typeProj-2016/alana/... · Lyric breakdown On this page, I have just broken down the lyrics, focusing on which words need to be more

11

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.

Final Design Inspiration

Page 12: Typesetting Literatureeyelearn.org/ma-stu-gallery/typeProj-2016/alana/... · Lyric breakdown On this page, I have just broken down the lyrics, focusing on which words need to be more

12

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.

Page 13: Typesetting Literatureeyelearn.org/ma-stu-gallery/typeProj-2016/alana/... · Lyric breakdown On this page, I have just broken down the lyrics, focusing on which words need to be more

13

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.

Page 14: Typesetting Literatureeyelearn.org/ma-stu-gallery/typeProj-2016/alana/... · Lyric breakdown On this page, I have just broken down the lyrics, focusing on which words need to be more

14

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.

Page 15: Typesetting Literatureeyelearn.org/ma-stu-gallery/typeProj-2016/alana/... · Lyric breakdown On this page, I have just broken down the lyrics, focusing on which words need to be more

15

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;

Page 16: Typesetting Literatureeyelearn.org/ma-stu-gallery/typeProj-2016/alana/... · Lyric breakdown On this page, I have just broken down the lyrics, focusing on which words need to be more

16

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.

Deliverables

Page 17: Typesetting Literatureeyelearn.org/ma-stu-gallery/typeProj-2016/alana/... · Lyric breakdown On this page, I have just broken down the lyrics, focusing on which words need to be more

17

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/

References