Studio brief 3 - Web proposal designing

DESIGNING MY WEB PROPOSAL:

I first began by making 5 art boards for the pages on my website. I really wanted to create a landing page because i felt i had a strong logo.

I used a my logo and centred it and had an enter button underneath the logo.

It felt a little bear so i added in a large line underneath the logo and my green triangles i have used throughout my branding.

I created a navigation bar across the top with the page names.. Food , drinks , loyalty rewards & where will you find us?

I then made a big square to put my content in an another nav bar down the right hand side.

I moved it because i didn't feel it look appropriate underneath the logo.

I created the content by using my already written menus and had all food in one section with the different categories down the left hand side.

Tapas , starters , sides & dips , big grub , sharing & snacks.

I still included my skulls for the hotness of the food. This is to keep the consistency with the restaurant.

I did the same for the drinks menu

I decided to get rid of the loyalty card section as it wasn't very relevant for the website and replaced it with an about page. About page is much more informative and tells people about the company and who they are.

The other side of the text i will have an image of my proposed interior.

On the where will you find us page i included a screen shot of the map for granary warf so you can view where the restaurant is on the map.

I included the dress , telephone number and opening times.

Finals:

IPAD PROPOSAL :

I wanted to design a user friendly iPad/IPod app with the same aesthetics as my website.

I began by putting the navigation names under one and other on to my iPad mockup. highlighting in green which page you are on.

 Next i added the picture of the restaurant interior onto there.

 I copied onto my iPad mock up a scrolling bar just like the one on my website. i wasn't sure how people would pull down the small white bar so i decided to add something to it.

 To keep the consistency of the website and app the same i decided to add in the small skull i had designed and some text saying drag the skull as you drag it the page will automatically scroll like your average iPod app or shopping page.

I repeated the same style for the second page i mocked up using the large logo in the middle at the top. I then added the tabs of the names for the individual pages highlighting the page you are on in green.

 This page doesn't need a scroll as it only has a map on it so you can get direct directions with our navigation to your iPhone i simply added a photo in of the map and put a black box around it.

Im really happy with my website mockups and my iPad i think they follow a consistency and i will now apply my designs to mockup screens and iPads.

Design for print&web - Accessorises

DESIGN FOR STUDIO BRIEF 3 - ACCESSORIES

To add to my brief i decided to add my mexican theme by adding some props. These are items i would have in the restaurant have designed i designed  printed out vinyl stickers so i could put them onto my accessories.

Baby cactus

 Tapas bowls

 Glass jar

 Tabasco bottle

Testing my Flags

TEST

For my design for print concept i decided i would have some small flags representing the heat of the food on my menus by using skulls keeping the day of the dead theme.

I wasn't entirely sure what size i should print so i printed a few variations this helped me to mock up a prototype so i could tell if they were appropriate. 

I first cut them out as a block and then individually i had a feeling the smallest ones would work best so i started with them.

I cut them out individually and i used double sided sticky tape to attach them around a cocktail stick and then stick the tabs together this created a small flag.

I am so pleased with them i will be using antique white stock to print them because the stock will be thicker and more sturdy but i just used white paper to mockup a prototype I'm really glad i did so i knew what size i would be printing downstairs and how they would look at the end.

Loyalty Card Stamp- Laser cut

LOYALTY CARDS

For my loyalty cards i designed them with my restaurant branding in the bottom corner as my business cards feature the logo in the centre although i wanted to keep a consistency i wanted to have a difference tween the two types of cards.

On the reverse of my loyalty cards  i had 8 squares this is so the customer can receive a skull stamp when they come and gain rewards when the loyalty card is complete.

I had alredy printed a mockup of my loyalty card the size it would be so i measured the square which was 13 x13mm and made another square in illustrator of 10x10 then drop my skull into so i knew it was the appropriate size for the stamp.

I wanted to laser cut my stamp and make it in a little block shape so i could use it with black ink and then print my skull shape onto my loyalty card.

I got some wood cut offs and ran a few practices before having a completed stamp. I tried it smaller and a little larger but some of them were really thin.

Making the stroke off the skull slightly thicker really helped.

I managed to get it pretty detailed after i few attempts. 

I then got some help cutting it down and sanding it so i could use it as a stamp.

TESTING :

To test the stamp  i decided to use black ink. The tools i needed were the metal spatular , ink and a roller.

 Here are my two loyalty cards and a test trip off my stock to use as a practice run.

 I spreaded the ink evenly over the table i had to use some oil because the ink was really sticky.

At first it was a bit smudgy so i redid it then after a few more goes it became smudgy again i do think its because i laser cut onto wood instead of lino or another stock.

 I began making a few stamps onto my final loyalty cards i was really happy with them.

Although i should of tried a different stock i really liked the look of the wooden stamp and stamps at restaurants aren't always neat . It does the job on my loyalty cards so I'm glad i experimented to achieve this.

Design for Web - Evaluation

DESIGN FOR WEB EVALUATION

For design for web my concept was to create an album artwork website that featured different genres of album art such as geometric , photo manipulation , packaging and typographic album artwork. Based on my summer project one of my research categories was album art and i found this the most interesting so decided to go with that. My main focus for my summer brief was Leif Podjasky an Australian graphic designer , i was advised to perhaps have a featured page on my website including a artist every month i decided for my website to use Leif Podjasky as i already had all the relevant content and information.

I am really pleased with how my website turned out i found it very difficult to code at the beginning but once i had some practice and made sure i typed code into the relevant places it came together. I was worried at first i didn't have enough content as on each page only has 12 images in total but because I'm doing an album artwork website i was advised in crits that i didn't need anything else. I chose most of my images for my website off designspiration there was a good variety on there. I found especially difficult to find the artists who designed the artwork so it was a little harder getting the content than i thought.

I found coding a website the hardest brief out of all 3 It was more the fact that if i placed something in the wrong container it simply wasn't working. Before i made wireframes and was playing about on dreamweaver i found it difficult to actually make anything and style it. But once i had produced a wireframe/scamps with exact measurements everything was a lot easier. Although i only have a website with a lot of images it took a lot longer than anticipated to design my website. I think a strength of mine throughout this brief would be coming up wireframes and being exact with my design also preparing images/content typefaces and colours before beginning so everything was ready. A weakness of mine would be being impatient and getting annoyed when something didn't work i find coding really tedious and i much rather the design side rather than coding.

I looked at youtube videos and websites to help me throughout this brief I'm impressed with my self that i used a css sprite to upload images the reason i did this was because i had 36 images to upload and to have them all roll over images would of took me a long time so using a sprite helped me cut my photo upload in half this did save me a lot of time.Although i didn't thoroughly enjoy coding it has been and experience and I'm glad i got the chance to learn how to use dreamweaver I'm very pleased with my outcome. I would like the chance to design a different style website in the future i also think its important for me to keep using this programme so i learn more about it and get more comfortable with styling.

WEB : Final work