LEGO RESPONSIVE// Bus Banner Advert

This is the new version of the bus banner with the new bi-plane design included. I have also used the new tag line here. The design for this banner works in a different way to the poster because arrows are used instead of the instruction manual layout. This has changed the way that the viewer will interact with the image although the basic principals are the same, for example the sequence is in the same order and the text is still linked to the illustrations numerically. This banner is designed so that a passer by could read it and understand the meaning if the bus was stationary, but also see all the lego bricks, tagline and Logo if the Bus was moving past at speed.

LEGO RESPONSIVE// Poster Changes

 After the crit some of the most important feedback I received was that the difference between section 1 and section 2 was too small. Both were just an illustration of the same brick. My aim here is to add a little construction into the poster. The object is a simplified bi-plane, I think that anything more complex would confuse the rest of the poster and look out of place. The bi-plane is also simplified because it suggests that the imagination of the player is also at work, the player can see the red baron and the adult can just see a collection of red bricks.

I have also changed the tagline to 'Start Building Fun'. It works in exactly the same way as the old one, where each word is associated with a part of the poster. Stage one is where you start off, stage two is the construction phase and stage three is the final stage where all the fun is at. I will apply this new layout to the other products as soon as possible.

LEGO RESPONSIVE// Bill Board

Using the same components from the poster I have creates a billboard idea. The numerical links between image and text are still there, its basically just the poster turned on its side with a few minor adjustments. The importance of the billboard is that it will we seen by far more people than the poster or perhaps even the bus advert.

LEGO RESPONSIVE// Building Poster

 I have applied the same principles from the Bus Ad to the poster, here however I have swapped out the maths sequence for the instruction manual idea I had planned.

 For the poster to look like a Lego instruction manual I had to divide each part of the sequence into its own individual area, I used this thick black line because this is the style that parents are most likely to remember from the 60's and 70's. The Danish Modernist design aesthetic has also carried over from the bus ad, here a good amount of white space can be used to balance out the colours and shapes.

Whilst on the subject of colour it is important to note that I have colour matched the design to Lego's own brand guidelines, which was sent out as part of a project pack:

Corporate Red: C0 M100 Y100 K0 Pantone: 486C
Corporate Yellow: C0 M15 Y100 K0 Pantone: 109C
Corporate Black: C0 M0 Y0 K100 Pantone: Black

On this poster I have chosen to add numbers so that the viewer can follow the progression from Lego -> happiness. 

 Here the maths based sequence has returned. I was criticised for this in a recent crit so below is my revised layout with the tag-line in a new and more clear format. Reducing the size of the numbers has also allowed for a more balanced design and and increase in the size of the bricks has allowed them to be more visible to passers by on foot or people driving past at speed. The colours are also typical Lego colours which should really bolster the brand Identity contained in the poster.

 Here is the revised design following the Crit. I have added numbers to the tagline, this means that each section of the poster has been assigned a word. Section 1 represents the Quality of Lego for example.I think the posters are starting to work well stylistic modern-retro designs. The solid colours and black lines add a lot of power to an overall, very simple design, however there is a lot of hidden meaning and symbolism here now.

LEGO RESPONSIVE// Building Bus Ad

 Following on from progress I have made with my idea I have put together these simple Bus Ads. They tell a very simple story, that by buying Lego the people who receive it will be happy. At the same time I hope that parents will recognise the simple maths and could even see it as Lego being an informative and intellectually superior toy for young children.

 The first thing I have changed here is the size of the + and = glyphs in the sequence. The illustrations really are a marked improvement over the photo version before.

Here I have squashed the size of the sequence down to fit in Lego's branding and a small idea for a tag-line. 'Quality, Creativity, Fun' are three words that I think sum up the Lego experience, even as a small child I remember knowing that Lego was a superior toy brand, the build quality is better than competitors, the fun you can have building and creating at that age is endless and I remember having fun for hours on hours. This is the sort of thing that I want parents to remember from there childhoods when they see these adverts.
Some things I changed on this final image include fixing the line width on the heads and changing the shading on the brick from my stylised version to something more like the real instruction manual Lego brick, with no shading on the sides and black shading on the notches.

I will leave this banner for now and return after I have explored a few more layouts of this idea, primarily the bus shelter poster. This will push the overall design forward and change it for the better.

LEGO RESPONSIVE// Illustrating the Bricks

I put together a quick mock up of my Bus ad which looked terrible with the photos I had taken, however It has given me and idea to produce a new type of poster and go in a bit of a different direction. By Illustrating the bricks I can eliminate any flaws in the images and create a standard Lego brick illustration. I can then use the illustration to make my own Lego instruction book. This should bring back memories of opening the instructions books and following all the high detail illustration and guidelines within them. I could make the posters an 'instruction book to being happy' where the creativity and simple brilliance of the Lego brand creates the little Lego smiling faces as the end product.

 

 To explain this idea I have put together this simple equation for happiness. The idea is that Lego plus more Lego equals a happy group of people. I would leave the faces as they are and try not to over stylise them because I think that misses the point of the Danish brand of modernism. This way the faces could represent any combination of people; it's unisex and doesn't bring up age. No group is singled out, this way the concept says: anyone can have fun with Lego. There is also a built in element of maths in this concept, where 1+2=3, hopefully this could gently persuade the parent that children can actually learn from playing with Lego.

 These are the illustrated versions of the photos, I have been able to sort out perspective and colour in addition to the much nicer, cleaner design aesthetic that the illustrations provide. Over on my design context blog I will post up some imagery that they illustrations are trying to illustrate, mostly Lego instruction manuals.  

WEB AND PRINT// ISTD/ Fakery and Evolution Progress Crit Feedback

Feedback from a progress crit of work completed so far for the ISTD Fakery brief.

Positive Feedback
-Great Name 'Type/Face'.
-Colour Scheme works.
-Comical idea of linking typefaces to people.
-Could look like periodic table. There is something in this!
-Really strong simple concept, tightened brief well.
-Simple colour usage works well.
-The layout of the typeface boxes looks simple, which goes well with overall aesthetic.

Areas For Improvement
-Consider making it very clear to the audience exactly what typeface is linked to which celeb.
-Where are the print elements.
-What is the original brief/ rewriten brief.
-How could you make the purpose more valid.
-Prefer the layout without the bar down the middle.

Considerations
-Who is the audience? Typographic/ design students or could it be broader?
-What are the uses of the website? Is is solely for humour?
-Consider layout. Consider colour limitations and usage to make sure different aspects stand out more.
-Consider choice of typeface for header, we have circled our favourites.
-Moving forward you need to start thinking about print more...
-We prefer the design without the bar in the middle. Like the gothic typeface.
-Consider distribution, creating other formats.
-Print would work well, reveal/conseal, playing cards would work well.

Having read my feedback the main point is 'who is your audience?'. This is something I really need to work on. At the moment the answer is basically 'our group'. I have designed the content of my website to be interesting fr design and typography students. Its also supost to be a bit of a laugh. As the brief is also for the ISTD I thought they might also appreciate it, as long as I dont make any glaring errors. I am happy that the general consensus is that it is a strong idea, as they people that are critiquing me are also my target audience, this sort of solves the first question about who the audience is exactly and if they will like the concept...
I do need to work on the header, this is an issue I am aware of. As it stands I have opted for pure text, either a blackletter or egyptian serif font. In the future I hope this will develop into a more stylised header, which still remains respectful to the subject.
Another main concern, or area I must focus on now, is what I wish to do for print. So far I want to focus on a game that could be played by design students. The aim is to have a funny line game where you link up fonts to characters and score yourself. This should also point the user to the website to increase traffic.

LEGO RESPONSIVE// Photography

While I was back home recently I found a huge box of Lego out of the attic and bought it back to Leeds, the aim was to start building some Lego and re-imagine the fun I had in my design. However in the end I have chosen a different approach due to the aims set out in the brief, mainly that the target audience is in fact the parents of children and not the children themselves. At this stage I am looking to design a low cost poster series for buses and bus stops as well as some merchandising or point of sale advertisement. The idea, as I've gathered from the brief, is to get middle class parents remembering what it was like to play with Lego as a child and remind them how much fun they had, but also how much they learnt. The learning aspect of the posters should be as clear as the nostalgia. So my challenge is to produce some modern-retro posters aimed at middle class parents of children from the ages of 8 - 14. These people need to be reminded of the process of Lego in some way, but I do want the poster design to remain basic and 'Danish' in its design style. This will require an aspect of modernism and minimalism, to hark back to the days of Lego from the 60's, and 70's. 

To start I have taken about 60 photos of what I deem to be the most iconic bricks Lego have ever made. This is the standard 2x4 Red brick and the Yellow smiling head. Luckily I had both these bricks in the box. I took the photos in RAW format and then again in SHQ, what I want is to get a high enough quality photo to use straight on a scalable poster.

 I took the photos with my own SLR in a makeshift studio build out of desk lamps and a light box. Unfortunately you can really tell this is how it was done. A combination of poor lighting and a lens which wasn't powerful enough means I had to crop and change angles in an awkward way to get the best image. What I may have to do is take the pieces into uni and take some photos with a bigger camera, however any of the good equipment is notoriously hard to get, especially without induction.

 I have taken these images and put them into photoshop. The aim here was to bring out the plastic colour and finer details of the bricks. I need them to work on large posters and billboards as well as bus ads.

Both of the images came out at about 60% of what I wanted in reality. I will start to mock up some ideas with these images however I will probably have to come up with a more refined image over Christmas if I want these posters to really work. The first problem I have with these photographs is that the quality is a bit to low for what I want, what I need to know from the photography studio is whether I can realistically take a photo of such a small object at a high enough quality to really get these designs working. The second problem comes from the conditions of the Lego bricks themselves, many of which are approaching 20 years old. For example the Lego logo detail has rubbed off the red brick and I have had to touch up the eyes and mouth on the head. They both also suffer from really minor scratches and colourations most of which I have removed in photoshop however It would still be preferable to get some brand new equivalents.
On the positive side I can use these images to start putting together some preliminary ideas and poster designs and really mess about with the layout. 

DESIGN FOR PRINT AND WEB// Website Styles

 Some mock-up ideas for how the website could look once I start building it. They all run on similar principles to the last post...

DESIGN FOR PRINT AND WEB// Fakery so far.

The Fakery brief has lead me to build a website concept where the history of various famous individuals is linked to the history of a typeface. This will involve a massive amount of research where I have to come up with around 20 connections. I have started this process by generating some visual content, mostly to mess around and see what sort of style I could go in for.

 This face split visual is something that I could work with, it allows the viewer to see immediately the young and old character or the different personalities that the people possess. I found out that Charlie Chaplin used to sleep rough (for a short time) and had a fairly turbulent past, with an outstanding career later in life. The idea here would be to find a typeface with a similar story and link it to him. 

 Bill Crosby was a class clown, turned professional comedian and now he speaks out against what he sees as an underachieving black teens.

 Obama has some radical ideas (for an American) but he never really went through with them, for this example I would like to use helvetica as a radical typeface which ended up selling out to big business (in a way).

 Here is a mock up of how the website could work. It would have the list of the younger versions down one side and the list of older down the other. If you roll over the images they will switch to the typeface version. Information on both famous and typeface will be displayed as text next to the images. A bar will separate the two sides so readers don't find the text too muddled.

 Another idea is to have the information pop up as a light-box script when you click on one of the images. This could work alongside the first idea or do away with all of the text on the page completely.

 I have also mocked up some poster ideas for the brief. These will incorporate aspects of the website but visualised in a different way. The Initial idea of having two faces of the same person back to back is staying, overlaying the faces I have added a letter in the font that is associated with the face. Here i have added Hugh Laurie with Baskerville and Bodoni. Baskerville as the younger version of Hugh, a classical typeface, and Bodoni for the older 'House' character, still classically trained but in a more modern role.

Michael Jackson is associated to early Batman Comics and Comic Sans. When Jackson was young he was cool, like batman comics. When he was older he was a creepy parody of himself, like comic sans.

Like I explained above, Obama, sold out just like Helvetica,

WEB AND PRINT// ISTD Workshop 2/ Fakery

Given out feedback from the crit earlier today (last post) we ran another workshop:

5 Things I don't know about...
-What other hidden images I could use.
-How the website will work technically.
-How I can publicise the website.
-Who is my real audience?
-A full list of typefaces and celebrity faces.

5 Ways Audience will Interact with Brief
-Find flyer around college/ in studio/ café's/ local area
-Visit website of the back of finding flyer.
-Play interactive game about typefaces and celebrity faces.
-Tell friends about awesome/ funny website!
-Shared through social networking.

5 Problems and How to Solve Them
-What typefaces should I use? - Get down to some reasearch and history of type books.
-What celebrities should I use? - Get onto the internet and learn about them.
-Should I ditch the science factor and go all out on the celebrity front? -Probably, it will cut down on confusion, make the concept more consice.
-How can I get my website out there? Flyers and online networking, eventually hope it will get shared to death with good design and appreciation of type.
-Will it be taken seriously? - Probably not. The concept of a celebrity can be fairly obtuse and tacky. However using more deserved celebrities instead of 'celebrities' should skirt some of this. I still worry that the idea could come across as shallow and offensive...

WEB AND PRINT// ISTD Concept Crit Feedback

Today we crited my re-written brief with the help of the images I documented in design context. First Tom took my brief and wrote some notes on it explaining how I could improve. He wrote that I could consider that its about exposing similarities and differences. He also thought that by aiming it at celebrity face lifts I could reach a larger audience and that the tone of voice could include 'bold and confident' as well as 'funny'. Tom also raised the question if I should design the website and print based response in the same style. The answer is yes, that is what I want to achieve, the poster and website will both be puzzle based and follow a brand-like identity...
We then did a quick presentation and received feedback:

- The images you have chosen are fun
- Who is your audience?
- There would need to be some info on the site because it could get confusing.
- Interesting idea
- Needs more exploration to make idea more clear.
- The website would be fun to play with.
- Well planned and researched, what is the exact purpose?
- Really interesting way to mix type and fakery.
- What would make people go to see this?
- What am I learning by going to this?
- Is it purely for entertainment?
- Be more focused with the message.
- Needs to be like a game (it will be like a game, I dont know where this came from)

Given the feedback it is clear that I need to focus down and work out some more direct way of expressing this. I think that for now I will just use the imagery of celebrities and typography, and call the website Type/ Faces of something. It will feature more respectable actors/ musicians who have matured well with age (Tom Hanks/ George Clooney) juxtaposed with typefaces which have matured well. On the other side actors/ musicians who have not come along so good (like MJ) juxtaposed onto typeface equivalents like comic sans. This should lock down the brief and give it more focus, It will appeal to more people and be more comical for the audience. 

WEB AND PRINT// ISTD Briefs Workshop

Choosing one from the three briefs that interest me we started a workshop aimed at helping us become more focused. I chose the 'Fakery Brief'. Its is very open to interpretation so needed cutting down to a solid idea that I can run with.

5 Problems I want to solve and Why?
1. How can I include a typographical element? Typography may not be central to my idea, but the brief demands a typographic focus.
2. The brief is way to open and needs to be locked down. Lots of things are fake, the brief could literally be about anything, what sort of fake interests me?
3.Who is the target market? This is not defined in the brief, so may slip into a secondary consideration for me, which would be bad.
4. How can I produce both a book and website? How will this effect the topic I choose? I will have to find an aspect of fakery which works across media.
5. How much time do I have to work on my proposals? Can it be done in time? What are my commitments? Can the product I want to create even be done.
6. How far can I go with my views? Will it be considered controversial? Is it worth voicing my opinions?

5 Facts about Fakery in context.
1. Fakery is found in the natural world.
2. Even an unnatural fake, like receiving botox, is the result of natural phycological factors.
3. Fakery in human life is a result of a lack of something; Expensive things, interesting life, good looks)
4. It is an incredibly borad subject.
5. In relation to copying, can anyone avoid fakery/ ever be original?

5 Facts about Audience
1. The ISTD has no idea who the audience is.
2. I want some of my audience to also be the people I attack in some strange way.
3. My audience will be interested in type and perplexed by the idea of celebrity.
4. Those who dislike popular culture.
5. I dont know who they are yet.

5 Ideas I want to Communicate
1. That fakery is interesting.
2. That fakery can save and destroy.
3. That fakery evolves over time.
4. That fakery can be exposed with knowledge.
5. That natural fakery and evolution can be celebrated.

5 Resolutions
1. Two page interactive game website where you roll over faces of people before and after plastic surgery revealing the after photo underneath. This is merged with typography and natural evolutionary examples of fakery in nature, like the chameleon.
2. Same idea as No.1 but the face is linked to a specific typeface and you link them up in pairs.
3. Same idea as No.2 but it is a print based puzzle game where you draw connecting lines or make a puzzle.
4. A timeline of typefaces as they evolved from previous ones. Does this make it a fake or evolution?
5. Is post modernism fakery or evolution of design?

5 Ways to get pople in interact
1. Distributed as protest piece outside plastic surgeries.
2. Link to site on meia sites and posters and flyers.
3. Poster will be interactive line game.
4. Website will also be game that will unlock facts and information as you play through.
5. In seeing the active change between before and after, both in human and typeface, the user should be more convinced of the differences.

LIFE'S A PITCH// OVER+OUT E-Flyer

 Today Over and Out sat down and worked together to produce our first real 'product', an e-flyer for distribution to the rest of our year. We had some vague ideas of how we wanted our flyer to look but no solid design down so we began with our final logo design and went from there.

This idea stems from a repeat pattern I was messing around with before, the information about out group would appear in the centre and a boarder would be made out of the logo. This flyer is really off balance, with very heavy boarder and tiny thin text.

After seeing the previous idea we went down a more stripped back route, here we take away all of the unnecessary content and include only the logo and our statement. I think a few of us considered this design to be too spartan and almost boring. It was argued that the flyer is not too important, but it will be the first thing that we release to the wider world so it is important to get this right.

Using the repeat from before with the orange colour from my initial designs we mocked up this. The pattern would cover the majority of the flyer and work as a piece of artwork in its own right, while the information about the group will be confined to the side with a simple header. I thought that this design was more like what I wanted to see, it has more content, less dull white space and contains lots of things to catch the viewers attention, and hold it. However we needed a compromise because we also collectively thought that it was too confusing, could be overpowering and over the top.

We used a simular layout here, replacing the pattern with one solid black logo. We aligned the text to the left to see how this would interact with the image. 

We also created a reverse version with the image and text box switched over. We still considered this to be fairly dull, and the logo is too heavy next to the much smaller body text. 

This is the genesis for our final idea, the one we ran with. Here the knocked out version of our logo is used with our folded paper templates labeling the content of each subject. We changed 'Designers' to 'Creatives' because we felt that it would be more fitting, and just different enough to stand out. 

Our next step was to experiment with some colour. My personal first choice was the Black/ Red/ Blue/ Green combination because I felt that it gave the flyer some separation and vitality. The multicoloured option stands forward more and, because of the contrasting colours it pops out of the screen. Our Logo also remained Black, giving it some separation from the content. 

After some discussion we opted for this e-flyer. We experimented with many shades of the background green, although I have a feeling it will different on every screen we use due to its pastel colour. I am happy that we kept some colour in the content and although it may have lost some of its vibrancy, this colour combination works on a more professional level. In addition, using a repeat of the logo as text boxes is something that we could continue for other screen and print based presentations in the future.  

LIFE'S A PITCH// OVER+OUT Logo Design 2

Having taken my idea for a logo away to refine, Eve cam back with this. She has changed the font that 'Over' is written in and repositioned the '+' and the text so that it fits the square more tightly. 

The logo design so far is strong, also that we have gone for two logos for different applications, one with the knockout 'Out' and one without. This should give us a bold and heavy logo to stand out on content heavy designs and a more subtle one if we need to use it. The folded paper idea is simple but speaks of some of our design processes and print methods and we have kept the colour simple and flexible so it can be screen-printed in any colour.

DESIGN FOR WEB// History Of Consoles Website Walkthrough

The website is really very simple, just a series of images with a small amount of Javascript and a very small amount of CSS.

HTML CODE:

HTML code is pretty self explanatory, most of it just handles imagery and ties in the jajvascript code to various buttons I have created. Quite a lot of research had to done on my part to work out how to implement this code here because at first I really did not understand, for example, where the various parts of the codes and handles should be placed.

This images shows where the smoothscroll command is executed when each button is pressed.


CSS CODE:

Thats it, all of the CSS code for the whole site, It really shows how simple the construction is. I could have made this part much more complex, however there would have been zero advantage, this keeps it simple and easy to edit, it also cuts down on errors in spacing and alignment on the actual website page.


JAVASCRIPT :

Javascript is mostly nonsense to me, this javascript runs the smoothscroll feature that allows the buttons to glide the user to a point on the timeline. I did have to edit a small amount of the code to get the scroll to run horizontally (x axis) rather than vertically (y axis), like on most websites.

So here I had to change axis:'y' to axis'x'.

I hade to also link some jquery into the code of the website. I think that this allows the javascript to run however once I placed it, it became un-editable and would freeze up dreamweaver if I tried to access the code.

I have talked about how the smoothscroll function increases the functionality, usability and aesthetic of the website before and there is not really a away I can show it in action, In a future post I may try to produce and animation for the blog, but that would be rather pretend. As an example here I have used screenshots, while clicking on the '60's' tab...

The website will glide horizontally to the first entry of the timeline which features a development from the 1960's. This is the same for every button on the Nav bar, which I have fixed to the top left of the screen meaning it will follow you throughout the timeline.