Thursday, 5 May 2011

What Is Graphic Design For? (Subject/Content)

Subjects/Content that interests me:
- Photography
- Music
- Fashion
- Type as image
- Health

PHOTOGRAPHY:




The photography of this really makes the campaign, and the digital manipulation used too. The grimey, dirty and dark setting that the baby is in is enough to pull anyone's heart strings, its no place for a baby, but with the cord around his arm, pulled tightly with his teeth brings sheer shock and disgust. Really powerful, and for me it works. It must work to others too as it caused controversy and finally get banned.

MUSIC:


The iPod adverts have always interested me, a cross between the cool colour contrasts, usually, a black silhouette and a bright and vivid background. With the main focus on the simple vector of the iPod.


FASHION:




This is the logo for Lily Allen's clothing range, Lucy in Disguise, I love this!! It's very feminine and communicates vintage and boutique really well. The type on its own would communicate a typical vintage shop, but with the intricacy of the illustration it shows exclusivity.

TYPE AS IMAGE:





Both of these examples are taken from a site called Tooft Design. The first is really simple, but still cool, and is very similar to something fro my own practice I have done for my Optional Image Module where I used type as image, and it was just as simple as this.

The second example is quite humorous, again, I love the simplicity. Two colours plus stock, a simple black vector illustration, some type 'vomit' and a line of copy. The use or red for the word vomit, and the vomit being in red works really well.

HEALTH:




Taken from a cool site I use called Trendland...
Health campaigns have always interested me, especially the more sinister ones, the power of the message really makes you think. I love the way the smoke has been used to carry across the message of death, and the very simple line of copy at the bottom, 'Kill a Cigarette and Save a Life. Yours'. It also ties in with my interest in the subject of photography, especially black and white, that alone can be a powerful and provoking tool.


Wednesday, 4 May 2011

How To Launch a TV Channel...


Some of these tips will be helpful to me in making sure I have a strong concept, the most important ones to me are numbers 1,2 and 12.

I found these tips on the internet which may help me when creating the idea behind the new TV channel.


Design For Web... Workshop 2

Great start to the lesson, I forgot to copy my work from the User Work folder to my Desktop so I had no files to work with!! Luckily Simon copied his files from last week...

Creating more webpages:

- Make a .dwt - Dream Weaver template
- Cuts out hours of editing time, any changes to template changes the webpages.

- Buttons and background will remain the same, select the area that will be edited, then Insert> Template Object> Editable Region.





File > Save as template



This template folder goes into the root folder automatically.

This next step is for inserting the pages from the template.




Change the content so you know which page is which.



Then File > Save As... then save the file as the button name e.g. about, contact...



The pages should appear along the top tab bar.

To link the pages, click the button:



Then click link:


Click the icon next to it, and point to the page in the file window:



Using text:

- www.ipsum.com - Good to use for fill text.

'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis hendrerit ipsum a quam accumsan pharetra vehicula urna sollicitudin. Donec non nunc nibh. Suspendisse tristique, justo id euismod porttitor, justo sapien commodo urna, at bibendum nunc sem vel enim. Nulla mattis semper libero, eget commodo lorem congue quis. Sed nisl lacus, sodales eget dignissim nec, porta in lectus. Duis ullamcorper ullamcorper euismod. Fusce lectus magna, sollicitudin in iaculis eget, imperdiet laoreet lorem. Donec placerat felis nec nulla ultricies iaculis. Nulla eu odio in mi suscipit sodales non id lacus. Integer nisi sem, pretium vitae aliquet eu, condimentum eget nisl. Donec cursus turpis dolor, in placerat massa. Mauris metus ante, pretium eleifend faucibus vel, varius eu lorem. Duis facilisis dolor sit amet eros sodales ullamcorper. Nulla eget massa vel eros laoreet imperdiet. Sed urna lacus, vestibulum ac dignissim non, consequat et nulla. Morbi nunc odio, gravida lacinia ultrices eget, sagittis eu lacus. Morbi vel risus quis massa ullamcorper varius vel sed neque. Integer suscipit tristique dapibus. Ut eleifend interdum luctus.

Fusce porta mi vel erat ultricies non vulputate ligula hendrerit. Integer auctor, metus quis egestas pretium, leo tortor condimentum nunc, id fringilla justo ante nec felis. Nunc ac pulvinar risus. Donec vel molestie nisi. Quisque ullamcorper metus non risus vulputate ullamcorper at in lectus. Suspendisse varius dapibus blandit. Sed porttitor augue blandit risus faucibus sed condimentum metus luctus. Vivamus in tellus sapien, ac viverra turpis. Proin venenatis, urna a sodales tristique, lorem nisi porta metus, eget tincidunt lorem lectus at nisl. Sed lorem mauris, vestibulum non scelerisque faucibus, tincidunt in lorem. Etiam et ipsum vitae turpis aliquet semper. Morbi adipiscing urna eget eros viverra ullamcorper. Phasellus ipsum sem, porta nec pulvinar nec, gravida sed enim.'


Copy and paste into the Design View to keep the formatting.




This does not use a specific font, to change the font click Page Properties at the bottom of the window:



Then select the font family:




Select the font size - pixels not points!

- Inserting images

- Make sure they are the correct size and formatted for web.
- Give the image alternate text for screen reader.
- Insert > Image
- Or use Lightbox... http://www.yoxigen.com/yoxview/

- Inserting videos

- On Youtube, click share then embed, then paste the code.
- Or get the Vimeo code.
- Then paste into the code.

- Inserting music


- Purchasing domain name

- Make sure it's a UK company.
- 24/7 help.
- www.123-reg.co.uk

- Purchasing webspace

- www.one.com
- Free for a year, 90p a month after.

Tuesday, 3 May 2011

What is Branding?

Taken from:
The Fundamentals of Branding by Melissa Davis


'The terms brand and branding are now commonly used in everyday vocabulary; yet, they are often misinterpreted. In recent years, branding has become a fundamental part of companies, organisations and even individuals...

But what exactly is a brand? It is much more than a logo or a name. A brand represents the full personality of the company and is the interface between a company and its audience. A brand may come into contact with its audience in various ways: from what, we see and hear, through to our physical experiences with the brand and general feelings or perceptions we have about a company. A brand encapsulates both the tangible and the intangible and can be applied to almost anything - a person (like David Beckham), a business (Apple, Coca Cola or Microsoft), a country, or even a nebulous idea (George Bush's War on Terror in the 1990s). The products, services and people of an organisation or entity are all part of the brand and affect the way that audiences both perceive and interact with a given brand.

To do:
- First think about the brands you like: what stands out? Why do you like those brands? Is there anything you dislike? What is distinct about the brand's personality?
- Develop a marketing proposition: what does the market look like? Who are the competitors? Where do you want your brand to sit? What are the aspirations for the brand? What kind of market research will you need? Who is the audience?
- What will be the brands key values?
- Develop the creative for the brand: what will it look like? What will it be called? How will it be packaged?
- Can you describe the brand in four or five words?
- Think about the business side of the product: how will the product be distributed? How can it stand out on the supermarket shelf?

Successful Logos...BBC

The BBC logo is an incredibly successful and recognisable logo and has been used across a variety of platforms over the years. It has undergone many changes (for the better, may I say!) since the first brand image in the 50's by Abram Games:




I am really not a fan of this at all, compared to the current, contemporary logo. Games' logo has been described as 'an elegant and rather ethereal image which captured the spirit of the times'.

The Current BBC logo:



This is the standard BBC logo used across a variety of platforms, the radio stations, TV stations and the website. It is clear and concise, while still retaining some of the past from the previous logo from 1988:



With the revamp of the BBC TV logos came the rebranding of the radio stations by London based design agency Fallon.



Although they are quite similar, each has it's own personality to represent the station. For example BBC Radio 3 logo has incorporated the bass clef into the number 3 to represent it's speciality in classical, jazz, world music, arts and drama.


Existing Channel Logos

A look into existing logos:

BT Vision Channels: (I think this may be a little outdated, judging by the BBC three logo)



Sky:


There are a lot of strong, bold logos out there, some more so than others, for example, in my opinion I am not fond of the Ideal World logo, I think the elements are too close in proximity to make it clear and readable, whereas the MTV logo is a brilliant and incredibly famous logo, making appearances all over the world, but I shall do an analysis on the MTV logo later.

Something I have noticed is the similarity with the ITV and BBC logos, white bold sans serif type, on a brightly coloured rectangle, obviously there are clear differences between the two, but I thought the similarities stuck out to me. The BBC logos look quite corporate and official, which is why I love the BBC 3 logo (Below: Second row, 4th logo in), it keeps the BBC brand but has three in lowercase pink type, which is representative of the channel itself, as it is quite a fun channel showing a lot of comedy shows e.g. Russell Howard's Good News, Family Guy, Gavin and Stacey... the list goes on.

From the TV Catchup website:


Even more logos...


On the whole the styles are quite simple. They need to be as they are often displayed at quite a small size so need to be legible.

'Television channels have distinct logo designs but are similar in a lot of ways. For instance, they all have to reflect back on the network’s purpose and mission even though, the above channels offer completely different programs. Moreover, the use of color and shapes all follow the basic logo designing rules. Television channels logo designs are not only about channel that you watch. But rather they reiterate your personality and how it has been perceived and ultimately, marketed back to you as a viewer.'

Taken from: http://blog.companylogos.ws/tv-channel-logos/

Wednesday, 27 April 2011

Design For Web... Workshop 1



- HTML - Hyper Text Markup Language
- PHP- Hyper Text Preprocessor
e.g. Not all webpages are physically there on a website for example, Amazon, when searching for a wheelbarrow, all information tagged 'wheelbarrow' is pulled in and applied to the website template, if all pages existed websites would be very slow.
- CSS - Cascading Style Sheets




Split view of the New HTML document. (Code on left, design on right)



Design view


Code view

- Metatag - makes a website searchable.

Original code at the start of new document:



Edited code, deleting unnecessary lines:




Web management:

- Create a folder called root, no capitals or spaces.
- Inside that folder create images, again no capitals or spaces.




Once this is made go to Dreamweaver and go Site > New Site.



Rename site and point the local site folder to your root folder.


This will feature the information for uploading to the internet.






- FTP - File Transfer Protocol - used to transfer files like email.

As we have named our root folder, every time you save it saves to the root.
- When saving the homepage, save as index.html

- Setting up the table:

Height is not an option to change in this box so it must be done using the code.

tr in brackets = table row
td in brackets = table data
= nothing/no data


Pressing space after the width brings up this menu, the height needs specifying so press h:

When height is selected, click it, it brings the height code up:


Here the pixel value can be inputted:


- Preview of the webpage so far...



Using the table and cell buttons, create the desired layout:




Creating roll over buttons:

The website has 5 so 10 need to be made, using Photoshop.
File > New > Web (specify pixel size!)

1 button needs to be created that is visible all the time, and a second button for when the user rolls over the button.

Save For Web > PNG 24 >
Save to image folder within root. 1st = home1.png

Back to Dreamweaver, choose cell to place image.
Insert > Image Objects > Rollover image

- Image name: home button
- Original image: select 1st image (home 1.png)
- Rollover image: select home2.png

- Check preload rollover image box. - to avoid lagging in loading.

- Alternate text: (for partially sighted) home button

- When clicked, go to URL : type in url

My site in Design View:



Original button:


Rollover button: