Month: October 2015

Modular Fonts Project

We were to design modular fonts based on the markings made in class.

Here are the markings done with inks, brushes and charcoal:

.IMG_20151104_235917

Samples of Modular Fonts found online:

http://luc.devroye.org/fonts-51336.html

8 Fresh and Free Fonts for your next Projects

http://www.webmutant.com/

Markings were then turned into fonts with Adobe Illustrator. The fonts are called Sugi after a root which is used for brushing teeth in the Middle East and Asia. It is because they look like brushes.

modular font

Other options explored on Adobe Illustrator:

Print

CV/Portfolio Website , Digital Media in Art and Design

An assignment was given to create a CV/portfolio website

1) Tutorials are on these sites:

http://www.w3schools.com/html/default.asp

http://code.tutsplus.com/tutorials/design-and-code-your-first-website-in-easy-to-understand-steps–net-6062

https://www.codecademy.com/courses/web-beginner-en-LceTK/0/1

http://www.theage.com.au/it-pro/expertise/nine-great-sites-to-teach-yourself-how-to-code-20140321-hvlc3.html

2) How to view the source code of a web page:

http://www.computerhope.com/issues/ch000746.htm

Chrome (ctrl+U)

Sample of source code for BBC news

source code for bbc

3) Here are samples of existing websites:

http://www.bbc.com/news

http://www.independent.ie/irish-news/

Simple, straightforward design, users can just click on links to get more information.

http://www.awwwards.com/web-design-awards/pauline-osmont-1

Background image covers the screen, navigation bar as footer. Minimal four pages

paulinepauline2

Simple black background with an illustration in the middle.

locuma1

Another designer’s site:

http://www.rebeccadautremer.com/

page

I love the simplicity, screen filled with an image and minimal info:

http://www.awwwards.com/web-design-awards/karim-rashid

karim karim2

Simple illustrations and block bold colors.

Sam Markiewicz – Flat UI Design Website

https://s-media-cache-ak0.pinimg.com/736x/c0/04/7b/c0047b5ac2db98d7ddf7a6499f7127d6.jpg

http://www.massimobonini.com/en/home/

yo

yo2

I like the simplicity, one page has all the information, one colour.

More samples on this website:

http://www.wix.com/blog/2014/01/artist-website-examples/

Sample of web page layout found online:

More layout samples available on the link below:

http://designshack.net/articles/layouts/10-rock-solid-website-layout-examples/

screenshot

screenshot

https://webflow.com/blog/examples-of-unique-website-layouts

https://www.whitehouse.gov/

Screen Shot 2015-11-05 at 12.30.58

Sketches done in notebook:

IMG_20151110_122442IMG_20151110_122435

Wireframes done in Photoshop:

WIREFRAME

WIREFRAME4

Self Evaluation/criticism

First Draft

Header, text disappears into the stripes. Description font too big, turquoise background color hurts the eyes.

Screen Shot 2015-10-15 at 13.14.31

Second Draft

Header too distracting. Colour combination to loud. Images too big

draft2

Third Draft

Using a different header done on Photoshop.

draft

With the problems I’ve encountered, solutions and tutorials were found on W3 Schools and other websites:

How to insert links to images:

http://www.echoecho.com/htmllinks06.htm

http://stackoverflow.com/questions/21532976/ul-is-not-inside-div-container

Screenshots taken on mobile phone of tutorials from W3Schools

Screenshot_2015-10-20-21-16-02Screenshot_2015-10-20-11-43-19Screenshot_2015-10-20-11-48-19

Feedback from Lecturer

3/1/2015:

Text too plain, need to reconfigure, place them in containers, add a little color, different fonts as example in BBC news website.

5/11/2015:

To arrange images in gallery on white background, grid style. Minor changes to text in content. To reconfigure About Me page.

Sample of ‘About Me’ page:

Finally, 5 pages completed!

Main Page:

final1

About Me

final2

Education

final4

Work Experience

final3

Gallery

final

Word as an image

Word as an image project

Words chosen are Evil and Fear.

Here are the options I’ve done, first with sketches then Adobe Photoshop and Illustrator

The idea was Fear of death. Men burdened by Death, and a gravestone symbol. Options done:

FEAR FEAR FEAR FEAR

Money is the root of all evil, color red chosen, likeness to Nazi color and propaganda posters.

Final outcome:

evil

Research:

Sample images found online. An image and text.

typography-in-webdesign27 images (2) download (2) images (1)

 

Vintage type images:

c9e7634f33bf73bcf068d497a568d9a4 vint-typo-1 GoMedia_tutorial_Jan2013

Images associated with fear and evil:

Money is the root of all evil quote:

MONEYISTHEROOTOFALLEVIL 1379196171_money-evil

Icon of Hitler and the Nazis

iconpopmania-134 swastika-adolf-hitler-and-movies-7516872-1280-1024

Hear no evil, speak no evil and see no evil

images (3) skeleton-no-evil

Vintage death as skeleton

1381192179-1 78a9dc46f82386c7ea1e5638743f7415 150px-CathedralOfTrier_Skeleton download (3)

Tombstones to symbolize the fear of death

81RQNMFnGFL._SL1500_ tombstone_final

Sketch for the word Fear done in sketchbook:

word as an image

Film Poster Project: The Shining

Module: Ideas Generation in Art and Design.

To design a poster based on the film titled The Shining.

The Shining is a 1980 British-American psychological horror film produced and directed by Stanley Kubrick, and starring Jack Nicholson, Shelley Duvall, Danny Lloyd, and Scatman Crothers. The film is based on Stephen King’s 1977 novel The Shining.In the film, Jack Torrance, a writer and recovering alcoholic, takes a job as an off-season caretaker at the isolated Overlook Hotel. His young son possesses psychic abilities and is able to see things from the past and future, such as the ghosts who inhabit the hotel. Some time after settling in, the family is trapped in the hotel by a snowstorm and Jack gradually becomes influenced by a supernatural presence, descends into madness, and ultimately attempts to murder his wife and son.

Here are some samples of posters done by other designers:

saul-bass-poster-design

A poster designed by Saul Bass. Minimal colors and block letters

Print

A poster designed by Tom Whalen shows the Overlook Hotel, snowstorm and corpses in the ground.

haunting-poster-art-for-the-shining

Designed by Matthew Griffen shows Jack carrying an axe in a snowstorm (scene from the movie) Using only achromatic colors.

budich-the-shining

Joshua Budich designed an illustrated poster. It shows all the characters, using red and achromatic colors.

Here are samples of minimalist posters:

http://www.polyvore.com/cgi/img-thing?.out=jpg&size=l&tid=50056291

Art prints by Misery using the main items in film, key from room 237 and typewriter.

Kristjan Lyngmo using the wallpaper pattern from the 70’s that’s used in the set as background, axe that was used to kill the twins.

Designed by Chad Trutt using a layout of the maze from the movie.

The Shining Poster by RustyCharles

Poster by Rusty Charles. Illustration of the main character, Jack.

More illustrated posters by a very inspiring Australian artist named Ken Taylor

Link to his page:

http://kentaylor.com.au/

Samples of his work:

drive newfinalvsuckerpunch

Samples of posters from the book: The Independent Movie Poster Book, by Spencer Drate, Judith Salavetz and Dave Kehr.

From the collection of the Posteritati Gallery. Book from college library.

poster1

The idea was to draw Danny on his bike with the text ‘The Shining’ as shadows behind him.

poster2

Stark black and white contrast.The idea was to illustrate Jack’s menacing face white either  white or red background.

poster3

The idea is to place axe on top box, Jack’s eyes on second box and Danny in last box along with the text.

poster4

Using black as background, and focus on either Jack or Danny’s face

poster5

Ideas for text placement.

poster6

Idea was to use Jack’s lower torso dragging an axe with red background.

Here are Images of the cast from the film:

Danny Torrance

danny_big download (1)

Jack

download images jack

Wendy – Wife

Shelley Duvall The Shining kubrick

Patterns/wallpaper used in the set

The-Shining-the-shining-25459834-500-313

The Grady Twins.

the-grady-twins-copy

Mind Map in a sketchbook

Scan_20151007 (3)

Nouns and verbs that described the film:

  • murder
  • haunting
  • dread
  • chilling
  • dark
  • cabin fever
  • menacing
  • isolation
  • snow storm
  • horror
  • madness
  • telepathic ‘shining’
  • fear
  • eerie
  • helplessness

Few sketches in notebook:

img004

Links to sites visited:

http://www.fact.co.uk/whats-on/the-shining-re-2012

http://rustycharles.deviantart.com/art/The-Shining-Poster-272096091

http://www.openculture.com/2014/08/saul-bass-rejected-poster-concepts-for-the-shining.html

http://www.imdb.com/title/tt0081505/fullcredits/

A sample of a poster done using the set of the film: Poster by Federico Babina

Archiset illustrated film sets
by Federico Babina

Archiset-illustrated-film-sets-by-Federico-Babina-_dezeen_17

Posters/Ideas I’ve done on Adobe Photoshop:

the shining1

Using red to symbolize blood. Fonts that looks like it was written with an axe/knife. Main characters, Danny the son, lighter shade to show innocence, and his ‘shining’ ability. Jack the father in the background looking menacing.

the shining 2

A poster with the main characters. Another idea is to have the good guys on one side and the bad guys on the other.

the shining 3

Using old typewriter font as used in the film.

poster3

Using Adobe Illustrator and Photoshop to create a black and white poster.

POSTER

The poster above was a mistake with the placing of paper in the printer, so I created a pattern, outlines of all the characters overlapping each other.

POSTER2

Using axe marks as text and maze that was in the film as the background.

POSTER3

Using the old typewriter font as background.

drawing1

Illustration of the cast done with pencils.

tri

Danny on his tricycle and the text as his shadow.

theshining1

The poster above is too busy, too many distractions with the wallpaper pattern that was used in the film. The text does not stand out.

Samples of text that was used for horror films:

1980s horror movie poster logos and typography.

More research:

A DVD I borrowed from the Raheny library shows a documentary exploring the numerous hidden meanings discovered within the movie.

  1. Color red to symbolize the Nazis.
  2. Typewriter used was a German product with an eagle emblem (Nazis) and eagle sculptures as props in the set.
  3. American Indian art and sculptures used in the set.  It is to symbolize the murder of Native Americans – and the consequences of that murder.
  4. More details on this website:http://www.drummerman.net/shining/essays.html

Here is a link to the trailer:

A website that compiles all of the movie posters:

http://www.movieposterdb.com/movie/0081505/The-Shining.html

Samples of typography that suits the movie:

IMG_20151103_141558IMG_20151103_112407

More samples of poster ideas: Negative space and image in the middle.

IMG_20151102_113105

An old vintage poster, black and white:

IMG_20151102_112627

Other Attempts:

face

Another poster I tried with Adobe Illustrator and Photoshop. Drawn with pencils. Text using Mom’s Old typewriter font to match the typewriter that was used in the film. Image of Jack Nicholson, menacing and rest of the cast fitted in.

blood

This poster has a pool of blood as the background with images of the cast drawn with pencils. Think the blood background is too pixellated.

Tried placing the illustration on stained glass. Characters are lost.

STAINED GLASS

Scaled Jack’s head down to give more negative space. Now to figure out the text to go with it.

face

Tried half of his face and the three characters on his forehead, to show they were on his mind, and that he was out to kill them. Text using impact with slashes on it.

half face

Font ideas.

To use axe marks to make the text:

https://i0.wp.com/www.barbarakrakowgallery.com/stuff/contentmgr/files/1/137fda5caabe5d246e707fd4d88e9eca/img_two/porter_forcedlabor_manwithblackhat__800__22454.jpg

Sketch done on paper with pencil:

Scan_20151115

Hand drawn text applied to illustrations to make a poster:

half face2

An option with just Jack upper head with the other characters he’s out to kill on his mind.

the shining15

The word ‘The’ in black disappears in the background.

White Text for ‘The’ stands out more.

the shining152

More characters added on Jack’s face.

theshining15.11

Another option to place illustrations of all the cast in a frame.

theshining15

With red background to symbolize blood: Feedback from Lecturer, not scary enough!

theshining152

Based on feedback, Hopefully, the final poster using illustrations, hand drawn text and Impact font for clearer info with black border. Different options and placements of text:

Print

Final2

Image/illustrations stretched to appear menacing, distorted. PrintNot scary enough!

Samples of horror film posters:

d-30-dtumblr_nkfscr8gm01qg8i80o2_1280all-the-boys-love-mandy-lane-poster-pichatchet_2006_poster_01

Few more options:

poster2poster3poster1POSTERAXE

jackaxe2

Option 1:

Axe that was used in the film, main cast on axe head, hand drawn text:

POSTERAXE

Outline linocut style illustration of Jack looking crazy, with red eyes and hand drawn text

Print

Flipped the background, light to dark with black outlines of Jack’s face.

sidepro2

I’ve decided to go with this layout with the catchphrase Cabin Fever, Jack?

Outline of Jack’s grimacing face, done on Illustrator like Linocut style.

Gradient background, lighter bottom half to make the text clearer.

sidepro

Feedback from lecturer, to make Jack smaller, emphasize on text.

FINALred