OUGD504 Design Production: Design For Print Creative Suite Induction

OUGD504
DESIGN PRODUCTION
DESIGN FOR PRINT CREATIVE SUITE


When designing for print we always work with CMYK. They are referred to as the process colours.

With CMY you should theoretically be able to make every colour, however the K is used to strengthen the shadows and create 100% black. the key consolidates the conditions of CMY

swatch pallet is the best way to use colour as you can save the colour swatches, using it consistently throughout the design.

Whenever you create a new illustrator document you have the same default CMYK swatches as seen above.

Select colour swatch and click on the bin in the bottom right hand colour.

Registration swatch is used for printing marks and and crop marks. It is used for things that aren't actually a part of your design or layout. 

These swatches are specific to this document

SPOT COLOUR

A Colour that is printed not using a combination of CMYK. Using spot colour can make a print job significantly cheaper. You only have to use one prni

plate. Using spot colours also aides consistency for example the Sainsburys logo uses a spot colour, therefore the colour is alway e same and there is no chance of error as with CMYK

OUGD504 Design Production: Design For Web Task One

OUGD504
DESIGN PRODUCTION
WEB TASK ONE

What is your subject mater?
Anthony Burrill

What are you trying to communicate?
life and works of Anthony Burrill

Who will be the target audience?
People interested in typography and design

What is the most appropriate form of content?

What is the function and purpose?
Inform

Sector-Biographical

[INSERT IMAGE]

When reviewing my work for this task i decided that my concept wasn't strong enough. I felt as though i would be recreating a website that already existed and in a way coping the information and applying it to a new design. I started to brain storm further referring back to the work of Anthony Burrill. 

[INSERT IMAGE]

I was particularly interested on the work that Burrill did on the oil spill of the gulf of mexico.

I began to research in to the oil spill and decided that it was a much more interesting topic and gave me more scope to be creative. 

OUGD504 Design Production: Design For Web

OUGD504
DESIGN PRODUCTION
DESIGN FOR WEB

• Web Standards and limitations
• Layout 
• Setup 
• Basic coding

Web standards are governed by acronyms & abbreviations.

• HTML-HYPER TEXT MARK UP LANGUAGE
• XHTML- EXTENDED HYPER TEXT MARK UP LANGUAGE
• CSS-CASCADING STYLE SHEETS
• SEO-SEARCH ENGINE OPTIMIZER
• FTP-FILE TRANSFER PROTOCOL
• URL- UNIFORM RESEARCH LOCATOR
• WYSIWYG- WHAT YOU SEE IS WHAT YOU GET
• UI-USER INTERFACE
• UX-USER EXPERIENCE

Dreamweaver is a WYSIWYG application.

Term web designer is dated, UI is the new term as user interface designers design apps as well.

LIMITATIONS FOR DESIGN FOR WEB

• Size of screen/display
• Size of file
• Colour- 216 web safe colours

When colour first arrived on the web computers could only support a mximum of 256 colours on their 8-bit monitors. A list of 216 'Web Safe Colours' were identified

These colours are reproduced consistantly across the web using HTML, specifically a six or where possible a three digit hexadecimal code.

RED

#FF0000

#FF0

BLACK

#000000

#000

WHITE

#FFFFFF

#FFF

WEB SAFE FONTS

For a chosen font to display consistently across different computers a standard font must be used

Further to this a font-family is chosen giving several 'fallback' options to insure maximum compatibility between browser and systems. For example if the browser/system does not support the first font it tries the next one instead.

Some common font families:

SERIF FONTS

Georgia, serif

"palatino linotype", "book antiqua", Serif

SAN SERIF FONTS

Arial, Helvetica, Sans-serif

MONO SPACE FONTS

Courier 

CSS FONT FACE

The CSS compatible @font-face allows you to install fonts to a website meaning the font choice remains consistent regardless of the browser or system.

However using font face breaches the licensing and copyright laws related to specific font foundries 

There are many free font websites which include free licence usage for @font-face kits including Font Squirrel.

SIZE DIMENSION PIXEL RESOLUTION

640x480- First computers

800x600- By 1995

1024x768- Early 2000's

1920x1080- 5 years ago

2880x1800 (200 ppi)- New retina display computers

FILE FORMAT

Lossy file format-Compressed- Design for web

PNG

GIF

PDF

JPEG

Lossless file format- Design for print

3 potential designs for my website

DREAMWEAVER

We don't use the recent files option as uni computers are network.

Next I created a new HTML file.

We are working with coding as there are some flaws with the design mode.

This is the coding to a completely blank web page, as you can see there is a lot of coding for a web page with nothing on it.

Anything with in <> is an HTML tag. <html> all this tag means is open HTML. </html> means close HTML. For a website to work you must have an open and close tag.

<head> </head>This is where you put anything that increases the functionality of the website, it isn't something that is visible.

<meta> Search engine optimisation, these are not needed for a website to work.

<title> Not noticeable in the physical design but shows up in the search engine, also helps search engine optimisation.

<body> </body> anything that you want to be visible on the webpage must be between the open and close body tag.

FAVICON is a logo in the search engine.

You have to create the containing folder before you begin. It is called the root folder, if things aren't saved to the root folder it will show up as a broken link on the webpage.

Never use upper case letters or spaces for file name e.g Toy Story would be called 'toystory'

Next we created a sub folder with in 'root' called 'images'

We then selected site>new site...

We gave the website a name and linked it to the root folder by going to the local site folder and locating it on the hard drive.

Next we selected save and this appeared in the bottom right hand corner. We are now ready to create our webpage.

you must never delete the file extension.

Homepage must always be called 'index'

OUGD504 Design Production: Print Workshop, Embossing

OUGD504

DESIGN FOR PRINT

EMBOSSING WORKSHOP

As part of my primary research i went to an embossing workshop at vernon street.

We first looked at some examples of embossing on to this thick card like stock.

 We also looked at a large plate that was created to emboss.

Notes:

• Negative Emboss

• Positive Emboss

• Limitations with tiny text

• Dont use smaller than 10PT

• Depth & Clarity is needed have bold type (Helvetica)

• The ore copper exposed longer it will take

• Frosted paper holds ink really well

Step by Step

Get your copper plate and choose the side with the least scratches , Using the sander sand it down. 

The next Step is to degrease it using some washing up liquid and a sponge over it. 

Blot the Copper plate with some newsprint - 

We next coat it with a thin layer of varnish you then put the blue film on your plate & place acetate on top.

We then roll the machine right to the end then back over it again

You then cut off the access up to your copper plate .

We next put the image side down stick to the copper plate with magic tape. Only needing 9 light units to expose.

The next step of the process was to get some solution in a container to put our copper plate into the solution consisted of sodium carbonate 10G & litre of water 18 degrees

 once the image has exposed peel of the layer , sponge every 30 seconds till copper is revealed.

 Blot the copper quickly.

 Once you have done that and your ready to put it into the etching tank , you need to hook it on with a white hook and scotch tape and it has to be left for 6-7 hours you need to change positions and turn it round half way through.

 When etched, can use the Hydraulic Nipping Press you need to

•  Place tissue on top of the paper 
•  Tighten screw towards you 
•  Pump handle till wont go further press back button in and pump
• the needle on the dial has to be mid day pointing to the top-  and lift it up

This work shop was really beneficial, learning the ins and outs of embossing has really helped my research for my book, It has also left me wanting to try the process more.

OUGD504 Design for web: Studio task

OUGD504
DESIGN FOR WEB
STUDIO BRIEF


Following our web seminar we were assigned a task to look at some websites, and completely clear out minds when thinking of words to describe them. We then had to analyse weather the words we associated with them were what the designer intended.

Apple

Expensive
Slick
Modern
Professional
Technological

What is the point: Apple is a company that specialises in computers and new technology, from the adjectives from my list I think that the company aimed to portray these themes through the use of high resolution photography and layout. Also the terminology like 'forward thinking' to connote that they are innovative and 'champagne' to connote that they are expensive.

What is the purpose: The purpose is to promote and advertise these products to it's audience.

Who is the audience: The target audience is for business or aspiring professionals 


LCA



Busy 
Inconsistent
Clinical
Childish
Boring

What is the point: The Leeds college of art website, is something that provides information about the university and the courses that they provide. From my list of adjectives and my initial first look, I wouldn't think it was a art school due to the aesthetics of the website being over crowded and old fashion with the big coloured category buttons.

What is the purpose: The purpose of the website is to again is to promote the art school and it's courses

Who is the audience: The website is targeted at potential students, who specialise in art and creativity


Pretty Green




Sleek
Sophisticated
Monochrome
Indie
Independent 

What is the point: This is a independent clothing label by Liam Gallagher, which focuses on mod style clothing in the 21st century. The website uses monochromatic colours which connotes and sense of sophistication and is sleek through the type of images used.

What is the purpose: The purpose of the website is to sell and advertise the pretty green clothing label

Who is the audience: The target audience is targeted at a male audience, which is connoted through its photography and styling. 



The Afterlife



Tacky
Confusing
Glittext
Vile
No Clarity

What is the point: This is a website called afterlife, which is an interactive website that shows the journey to heaven. 

What is the purpose: The website on first glance is not clear on what it's trying to depict due to no description, and the use of gifs and glittext make the website look dated and tacky. 

Who is the audience: The audience for this website is possibly targeted at people with a christian faith, due to the link in the title about 'the afterlife' and the gifs of cloud and the gate way to heaven.



Pinterest



Simplistic
Photographic
Modern
High Resolution
Colourful

What is the point: Pinterest is a interactive, photo collaging website. 

What is the purpose: The website allows users to share and upload interesting photo's that relate to art, pop culture, fashion and so much more. It uses wide frames for the photo's to be positioned in an look like a board of collaged images which depicts what the website is about. Also the simplicity of the website makes the design look professional and easy for an audience to interact with.

Who is the audience: The audience for this website is targetted at people in creative field or profession or study e.g photographers, fashion, graphic designers.


POINT . PURPOSE . AUDIENCE .

I found the this task really beneficial in me creating my own website for the brief. It's important for when I think of a concept that the point, purpose and audience are all clear in a matter of seconds. It has to be engaging, interactive and aesthetically pleasing because, like in the task above I judged it and what it stands for in a matter of seconds.