Wednesday, 13 January 2016

Designing a Webpage

We had to find a product, that we owned, to design a webpage about to sell. I chose a mug from home, which is self-stirring, just because it's a pretty unique product and I can get lots of pictures/videos from it.

For inspiration of the actual webpage, I looked at some other websites on a desktop and on my phone also. Firstly, I looked at merchandise websites, as they usually sell a lot of things like printed mugs. The Dan and Phil Shop was where I took the screenshot. It's a pretty simple website, focusing all of your attention on the products displayed rather than having lots of popups and adverts everywhere. The colour scheme is simple with whites, blacks and greys being used.

Next, I found a website that sells lots of different product, including a wider range of mugs. This website is more colourful, with a bright red banner with sale items, and this is probably because this website has a lot more to sell. There's also more images of the product you're buying, including packaging. There is a colour scheme, besides the banner, of light, pastel-like colours: blue and white. This is a soft look on the website, and there's a lack of adverts.

Finally, I found a website that specialises in selling mugs. It's full of images of the products, that play like a slideshow. Again, the style is minimalistic with colours like white, black and some hints of blue and pink, adding splashes of colour to the page.

On my mobile, there was always a search bar at the top, and the drop down menu was easy to access. Apart from the third website, which was only desktop version, and not mobile.

After some work, I came up with three mobile and desktop wireframes to work from. On all of the desktop designs, I had the idea of having a small video on loop of the self stirring mug in action. I thought this may add interest to the website. I also used a lot of pictures as I personally love pictures and things that are visually pleasing to the eye.

I also worked on the colour scheme, using Adobe Kuler. I used a range of dark colours to pastel-like colours. The colour scheme I like best is probably the one with pastel pinks and blues, because it's soft but still really colourful. This colour harmony is an analogous scheme, and the colours are fairly similar so it's not too bright but not too dull.

Overall, I have narrowed my choice to the three on the left. Next, I need to decide on my designs and then add details like the context of my webpages.  

No comments:

Post a Comment