Showing posts with label Design Process. Show all posts
Showing posts with label Design Process. Show all posts

Saturday, 2 February 2013

OUGD405: Design Process - Workshop - InDesign

As part of this module, we have had various workshops, showing us how to develop our skills in essential software which we need to be able to use as part of the Graphic Design industry. The three main programs which we need to learn Photoshop, Illustrator and InDesign.

InDesign is able to work with multi-page documents, being the mains strength.


You can see above, the product of the two sessions, although, I'm fairly confident with Adobe InDesign, as I was taught it at College, I really learnt some useful tips and methods with will definitely benefit me in the future, when I need to use InDesign to create something.


  • InDesign is very similar to illustrator and photoshop, they contain the same tools and pallets.
  • Letter, Legal and Tabloid are American size papers, dis-regard them.
  • Set your paper size to the finished, trimmed, paper size.
  • Use a Bleed, with a standard bleed size of 3mm. 
  • You can change the layout of the page, as in margins and columns, and other document settings.

Monday, 21 January 2013

OUGD405: Design Process: STUDIO BRIEF - RESEARCH, COLLECT, COMMUNICATE: PRODUCT


As part of this brief we had to use out research themes and explore information graphics through one of the following outcomes:

  • Product and Publication
  • Product and Packaging
  • Product and Distribution
I've decided to take the Product and Distribution path with this brief, so I made the following spider diagram to explore some ideas. 


I find the idea of using a stamp, which would come with a booklet, similar to what you would receive in a welcome package, if you were to join a stamp collecting club. I went onto research some creative ways I can create the stamp rather than using one of Wright's sketches, renderings or a photograph of a complete building, in the present day.


Based on some of the stamp collecting booklets in my design context post, I decided to replicate the design for my stamps. Above you can see some mock-up sketches of booklets, some being a double spread and some being a triple, I also sketched a quadruple spread. (Separate Research Post

I felt that the double spread was too small to house the appropriate amount of information which I would like to convey, and that the quadruple would be too excessive. So i've decided to settle for the triple page booklet.


I drew up another quick design sheet on how I could lay the stamps out, with the text. I've designed it to accomodate 6 stamps, however, this may be subject to change. I designed it to be neat and readable, whilst being aesthetically pleasing. 

I then began works on the stamps, you can see on the product research page, I've decided to imitate the style of DeviantART user shoelesspeakcock who is a geometric vector artist, based in the United Kingdom. I've used lines and shapes, tracing over an image of Wright's drawings or a photograph, from one of his schematics books. 


You can see how it was done in the image above. I tried to seperate the colours based on different materials, natural vs fabricated, textures and their angle in relation to the sun (how shaded they were) I continued the process for 5 other of Wright's works: Sea Cliff, Trinity Chapel, The New Theater, Lake Thahoe Summer Colony and Play Resort and Sports Club.

Once I had completed all 6 of the geometric-vector tracings, I begun work on the stamp. To create the perforated edges,  i had to use a set of advanced processes, which I've never done before.


First I added a new layer, and created a shape which filled the page. It's worth noting that the page is A3 size, in height, but had the dimensions of the stamp. I then added a stroke around the shape and styled it like you can see above. 


I want to subtract them from the shape, so I had to transform the stroke into an outline. I opened the 'Flatten Transparency Window, and made sure the 'Convert All Strokes to Outlines' box was ticked, and I then pressed Ok. This now means the strokes are treated a shape objects. 


I then wanted to cut stroke-shape from the shape below, to do this, I found the Pathfinder window, and switched the shape mode from normal to subtract. This subtracted the stroke from the edges, and created the perforated edge look, as you can see below.


I then changed the inside colour to a charcoal grey, this contrasts nicely with the colours used on the stamp designs, and the edges, bringing them out, using the contrast of hue, saturation and tone. 


Similar to the style of Shoelesspeakcock, I added the Queen Elizibeth silhouette-like image in the top right hand corner of the stamp. In the top right hand corner, I've added the name of the building and the date it was constructed. I used the colour picker to draw out colours from the image, and use them in the text, for the sake of continuity. I also added the 1st in the bottom right, I noticed that in most stamps used, regular stamps with a numeral, rather than a digit. I used white for the Queen's head and the '1st', as it's using the limited 3-colour-scheme. Below you can see all six finished stamps, click to enlarge. 


Friday, the 18th of January, I was involved in a crit, where I was recommended to use some of Wright's schematics in the layouts, for the booklet as guides for the text and images. This seemed like a great idea which I really wanted to explore, but looking at some of the schematics, they're extremely complex, which hundreds of lines, unfortunately, this would not be practical for this project. However, I will keep this idea in mind for future projects.


Above, are two more designs I've sketched up for the booklet, these ones are evolved versions of the sheet featured at the top of the post, using the three-page-layout system. I've also added a page in, on which I plan to incude information about Frank Lloyd Wright. On which I've included a silhouette, the outline of Frank Lloyd Wright. With this, it almost relates to the Queen's head on the stamp, and rather than adding an image or drawing of Wright, I think using, essentially a geometrical vector shape, links to the illustrations on the stamps.

Also, in the lower layouts, you can see I've added bars running across the top and bottom of the page, this breaks up the page, the design above it, without the bars looks very full, so adding them, and not overlaying them with text makes the page look much more minimal, with a more modernist appeal to it. And after all Frank Lloyd Wright was a modernist Architect! 

I've decided to produce six booklets, the reason being that the centre page, in booklets, contains information on one of the stamps, and the building it represents. So, to accomodate all the images, there must be six booklets. I then went to create the booklet on Adobe InDesign.


You can see that I stuck closely to the lower layout on my design sheet. I used the blue, from the stamps, for the bars, and I've used the orange on the F.L.W Silhouette. I happy with how the design turned out to look. I think using the design with the bars was the best way to go with the booklet, it doesn't overwhelm you with text, I think it looks appealing and manageable. 


Above you can see the printed versions of the designs. You can definitely tell that I'm working with a limited colour set, and i think it's effective. I think there is a good balance between visuals and copy, you're not overwhelmed with images, or with copy. 


Here you can see all the products which will be distributed. Six booklets, with their accompanying stamp. I also noticed that the Orange works quite well with the blue, they're contrasting, but because they're both fairly neutral colours in terms of saturation and brightness, they don't contrast too much.


A close up of the stamps, sadly these weren't done in digital print, unlike the booklets, but they still look okay. To create the perforated texture you get when you hold stamps I used a scalpel, stabbing it into the circles created by the edges, this teamed with the printer paper gave the effect of perforated stamps. 


I'm extremely happy with the quality these printed out, in the digital print room. I managed to print the double-sided, using the PDF export techniques which I learnt in a Photoshop, being able to combine the files in Adobe Acrobat Pro, reducing the file size, whilst maintaining the quality for print. 







Wednesday, 12 December 2012

OUGD405: Design Process - Photoshop - Postcard Task


Based on my research post, I've been experimenting into apature shapes, to manipulate lights which are out of focus, creating my chosen shape, the triangle. You can see below that I've created a lens cap, with a triangle cut out in it, much like the one which you can see on my design context blog. 


Above you can see the lens a cap and a text image, which I created by turning the back light up on my keyboard, on my MacBook Pro, and turning out all the other lights in the room to make them more prominent. I hope to apply this in some images which I will take around LCA before the semester is over, on the 14th.


Above is an example of one of the few photos I've taken today, prior to my camera dying on me, as you can see i've applied the bokeh technique, and created some wonderful images with the light manipulation. However, without anything in focus, in the foreground, the images look rather unprofessional  in my opinion - like I'm unable to focus a camera properly. So, I intend to find something which I can put in the foreground of my images, to give a subject, which would be the main focus of the postcard. However, these would be in the background, or foreground, of the image to keep the theme of 'the triangle'.

Prior to this, I also had taken some photographs around college, which will also be used in this task, you can see them below in the contact sheet provided.




Using this, and my research on some very simplistic, minimalistic postcard designs, I began to make the postcards, for print. I used the method seen in the bottom of another Photoshop Workshop post.


This is the back side of all my postcards, I found this works better, and keeps the postcards as a set, rather than random images collected together. I also think that the bokeh works very well in a low opacity, and adds a nice warming touch to the back of the postcard. To the left of the image, there is a black grey space for the person whom would be sending the postcard to write, or draw, whatever pleases them. Overlaying the bokeh image are 5 lines for the address and a 20x25mm box, for a stamp.

Above, in contact-sheet form, you can see the five images I've selected for the front of the postcard. I used the same grey for the back of the card as a boarder for the front of the card, which i created using a  grey overlay, and then vector masking the part of the image which I wished to be transparent, allowing the photograph to show through. 


Tuesday, 4 December 2012

OUGD405: Design Process - Study Task 2

How to get more people to donate to charities.

Following the crit, we quickly mapped out a spider diagram, devising ways which we can get more people to donate to charities, this would then form a basis for us to create an idea to get people to donate more, we will present our work on 07/12/12 in the form of a presentation.


We established that the best way to demonstrate how we could become more effective was to advertise the following aspects. So we organised a free-hugs event which would promote and advertise the charity, almost like giving something back to those who would donate, something simple as a hug. 

We then decided to use the Honey Monster as our mascot, who is a recognisable figure. We decided to incorporate him into our design work, so we could associate him with our work, we sampled the yellow in the honey monster's fur and used this as one of our limited colours. We then went with purple, as it's the colour for the charity, Scope. With a few alterations to the colour, we were able to make them work together, and they had a nice contrast too them, not too extreme. 

However, we will unable to accept any donations, as you need to attend an interview with the charity, so they can trust you. So we decided to use our Graphic Design skills to raise awareness for Scope, so people would donate directly. 

Unfortunately, because I was working of film-prep for the majority of the week, I didn't have time for much design work, however, I did mock up and sketch design sheets for flyers, which were used. 


The bottom left thumbnail sketch was used, I didn't make the flyers themselves, but I designed them, and below you can see the finished product, which was distributed when we did our free hugs event. 



When it came to the actual event, I documented all the hugs, our promotional tactic. Which demonstrates the effectiveness of our campaign, with the hug, we distributed our flyers and asked if the hug-recipient would donate, the majority said they would. 




I shot and edited the video above, which was shown during the presentation. 

Thursday, 29 November 2012

OUGD405: Studio Brief 1 - Research into Charities

For this part of the module, we were asked to research into a specific field. To do this, we were split into groups, and we were given a topic into which we would research. We were given Charities. In the groups we were put into, we each decided on a specific theme to research within our topics. The theme I've chosen to research is the finical distribution, i.e. what percentage of the donations go to the cause, what percentage goes on business expenses, and other costs.

I e-mail out the question to several charities, such as Oxfam, Cancer research UK, NSPCC, Unicef and the RSPCA. After being bombarded with a series of confirmation messages, that they have indeed received my e-mails. I finally received a real response from Oxfam.






As this is, currently, the only response I've received, I'm going to have to base most of the research from this, as an average. In the e-mail, Oxfam uses a £1 as an example, 84p of which goes directly to emergencies, by this I assume they mean that 84p of the £1 goes to the cause, in this case, third world countries, who's population are in poverty. 9p of the £1 goes to business expenses, I imagine this would be establishment costs, wages and other general business related expenses. 7p of which goes to future investments, this would mean advertisements and campaigns to generate future income.

Following this, I went out into Leeds and took some photos of things which could be considered as 'the 7%', as seen in my primary research sheets.


I then took to the internet and found images, which I couldn't find in my location, that represented the three sections of the pie chart, as you can see in my secondary research, below.
I then decided on my direction, where I was going to take my research.