Monday, 26 November 2012

Brief 1 / Product Packaging

I now need to package the products I have created, explaining their purpose and selling them to the target audience, while keeping the theme matching to the actual cards.

I need to package: the cards, the postcards, the gift tags, the badges, the gift wrap set.

Copy ideas:

Show your best friend how much you love them!
Premium quality 220gsm cards with a glitter and foil finish to celebrate International Friendship Day on August 4th 2013.
Message on insert reads: 'Happy Friendship Day. Thank you for being the best friend ever!'
Card comes with a badge to give your best friend and stickers to decorate and personalise the card.
Also available in the Friendship range are sheets of wrapping paper, postcards, gift bags and gift tags.


CARD PACKAGING

Has to include both my logo and UK greetings logo, a product description and title. I'm sticking with this shape as it will fit with the cellophane bags I have bought to package the cards in.

back:



front:




Final design. It contains all the needed information, but none of the pattern symbols as I just think they make it look too crowded, and don't think this would work well against the cards as they are so detailed.


Similar packaging for postcard, just changed the text on the back.


TAGS

... I am stupid and didn't flip the back over so they would work double sided...

The price tags will hang from products which aren't packaged. I'll use a nice ribbon in a colour that works with the products to hang the tags.


 For some reason the G is a bit dodgy and doesn't look like a g so avoiding using this. (Font - The Only Exception)


Final design... keeping it simple


Final tags for the different products:


Packaging is to be printed on to thick white card.

Brief 1 / Other Products

Symbols


I started off creating the other products by drawing out some symbols, based on the doodles around the existing typography, and then I edited these on photoshop. I've then arranged them in different ways, sometimes with the text, to suit the product they are for.

Products

Sticker Sheet


To be printed on to glossy sticker paper then I will cut out each sticker to be included in the packs.


Badges (badge it maker)


The badges for the badge it maker are 3cm each and will feature these patterns, with glitter and foil added.

Postcards




There are six different postcard designs featuring the messages and the symbol, with the use of a symbol on the back as a divider.


Wrapping Paper


 


Here I've been playing about with different layouts for the wrapping paper. I think the repeat pattern style of the middle sheet works the best.

Gift Bags

These are some experiments to how the elements can be arranged on to the gift bags to still work as a set with the other products.

I think this one is a bit too much..

Works well with the message but the back should be simpler...


Again, think this is a bit too much going on, and makes the bags look a bit cheap...


Simplistic design of the gift bag I have decided on: 


The backs of the gift bags feature different combinations of the pattern symbols.





Inside the bag I could keep it plain, include a patterned inside, or maybe add tissue paper or wrapping paper to make it look more realistic.

Gift Tags

This is an idea for how the gift tags could look. I want them to be this size (this sheet is A4) because I think that is a realistic gift tag size, and I don't want them to over power the actual greetings cards. I think this design with pattern on the front and back might be a bit too much.


The final gift tag designs. As you can see here I've gone back and added the UK Greetings card and my own logo to every product to make sure everything is linked and works as a set.


Friday, 23 November 2012

Design for Web - Workshop 3


Image gallery

- Download lightbox, copy the JS and CSS in to root folder (but don't replace images folder, put files in existing ones - also can combine css sheets with existing one)


- Activate lightbox on template page, before the closed head tag


- Open up your image in photoshop, need to create two images
- Image -> Image size -> 72 ppi -> Re-size image as smaller file size so the page is quick to load -> Save for web
- Now need to create the thumb nail lightbox will use to show the images (100x100px)
- Use the marquee tool and change style to fixed size and choose area of the image to have as a thumbnail

 


- Then crop and save as thumbnail for web
- Back to dreamweaver, open the html document you want this lightbox to be on, go the editable region
- Paste the link code in to this region
- Title is for caption under large image
- Click on link :


- Can customise aspects of how lightbox works rather than sticking with default - e.g. change the close and left and right buttons
- Place the thumbnail in the link



- To get them all to work as a set, give all the images a group name in this tag, and you will see you can use the arrows to get through.



- Variations of lightbox (for example if you want to use video in this context) include: slimbox. fancybox.

- Lightbox css stylesheet can be edited to change the settings of how it looks, e.g. changing overlay colour, delete borders, change opacity etc...


- Starting to look a bit more like a website ...


***************

Image slideshow

Thursday, 22 November 2012

Brief 1 / Card Compositions

Here I've been putting the messages on to the cards, considering the other elements that have to be included too, such as the logo and copy.

The insert reads: Happy Best Friends Day. Thank you for being the best friend ever!
I have left the envelope plain so the people who buy the cards can choose to add the included stickers.


220gsm card, 90gsm insert sheets

card size = width 13.4cm height 13.4cm
envelope = width 13.8cm height 14cm
insert = width 13.2cm height 13.2cm

__

I tried live tracing the messages on illustrator, but live trace is rubbish, and it made them too thick.


Decided to work with photoshop for this brief. I have neatened up each message, which actually took ages, as you can see the hundreds of layers I've added in the screenshot below. This is because there were some gaps and mistakes in some of the messages. I probably didn't need to do this but I'm a bit of a perfectionist.



Here are the final, corrected messages, positioned how I want them to appear on the cards.









__

These are ideas for the back of the card. I've looked at what existing cards look like on the back, and want my cards to look as realistic as possible.

With each step I've made the back of the card a bit simpler as I realise this works best.



I've not included the price on the back of the card, as they will be packaged and the price will appear on the packaging.

__

The insert is just really simply so it can be customised with the included stickers and so there is space for a message.