Designing the webpage

Designing the webpage from my wireframe I used boxes of colour to seperate my Text and images. I decided to use the homes from the back of the cards next to the title as families and homes link together in my theme. In the text I have three main sections that is essential information to know they are separated by headings in the same blue used for headings on the other pages showing consistency along with the font Lato used in different ways.

 

I created another webpage that the user would be sent to if they added the card game to their basket. It offer them the opportunity to add a donation and tells them thank you. They page also shows a collage pattern of the cards which is fun and different to the other pages.

Within feedback of the webpage everyone felt like the main page fit well within the Dogs Trust existing design however the extra page wasn't as consistent and harder to read.

In my second layout I added the bar to the bottom of the picture centralising the donation section so it draws the eyes and this layout is a lot easier to understand and use.

To show what the website would look like active I created it in Adobe Xd and created a clip.

Ideas on a webpage

Once creating the cards I understand that they can not work alone especially if the cards would be found one at a time therefore I need to create a page that would go on the Dogs Trust website that coincide with the cards.

It is important for my webpage to fit with the style and layouts that are already there so it fits well and does not look put of place for the brand. Therefore I looked at the layouts which include the colour banners with the title and the main font used on the website is Lato so that is what I will be using in my designs.

What is the importance of this webpage?

• To tell people about the campaign 
• To tell people how to play the game
• To Encourage people to buy the game and donate money
• Overall it will get people onto the page which will make people look at other pages of the site.

Creating some ideas of layout I looked at making a page that didn’t have too much information for younger people but still said everything they needed to know while having engaging pictures of the product.

I decided to create some wireframes so I could establish the best layout for my images and information. I began by using my images to separate the text but I felt it seemed to broke up. I decided on create a article feel amount of text on the right hand side of the page and the images to go with the text on the left separated with gradient boxes which are used on some of their other pages along with adding the top and bottom boxes of text that are already on the website which help people navigate. I also created a page that people are lead to when they choose to add the card game to their basket which tells them thank you and asks them if they with to donate any additional money to the Dogs Trust.

Printing the cards with Feedback

When I was happy with my final designs and had received positive feedback on the design I printed them double sided on satin 350gsm stock. This stock gives the cards durability which is important to something which is going to be handled a lot and by children who are less likely to look after objects. After I printed my designs I asked people with a range of ages what they thought of the card designs and wether they would play the game. I feel that the designs work well because they are readable and work as a fun little game that brings awareness of real dogs that need homes.

Feedback Summary

• The colours are fun and draw my attention to the cards initially then when I look at the information it is easy to read and I understood how to play the game.
• The pictures and descriptions of the dogs are so sweet it makes me want to go on the website and read about more dogs that need homes
• I think the game will be fun and I would play with my family and friends
• I do not use the internet so could not go on the website myself but the cards have the big dogs trust logo therefore I know I could always visit a centre to find out more.
• I would pay to have the set of cards if I knew the money would go towards helping the dogs 

Something that was brought up as a potential flaw was, 

• What happens if I want one of the dogs on the card then I went online and it was sold?

This is a small issue however the point of the cards is not to promote that set of 30 dogs but the Dogs Trust and other dogs that work there so by getting that person on the website it is a success as they are able to look at the other dogs on offer with not much further effort and find another dog they will fall in love with.

The feedback was overall positive for the designs so now I will need to work on a page that can be added to the dogs trust website to go along with this campaign.

Experimenting with Layouts

After my previous feedback saying my designs looked a little flat I decided to look at layout and adding some extra features. I added the photograph in the centre to break up the text and added symbols to represent the categories in the game. However me and others felt that the symbols weren't needed on such a small card and actually the most important part of the card was the photograph therefore I needed it on the card.

I then created a layout I liked that I curved the edges of the image and made them overlap the layers, this made the design look less flat and made the photograph fit with the card more. I also added a little house which shows what number card this is out of a pack of 30 so it is immediately clear there are more. I tried different shapes to add this information to but felt the house worked well as the cards are for families and the whole point of the game/brief is to make the dogs more desirable the take home.