Design for Digital Media Environments – Website Page Designs

As I stated in a previous post I was going to produce sketches of some potential webpages that our website will have. To start with I created some very simple designs. Designs on the left hand side are inspired from websites such as Apple.


Keeping all boxes centralised and in block form helps created an organised, easy to read and professional style. The only problem being that it’s not the most user-friendly design. For instance, if you wish to access the categories you have to scroll to the bottom of the page.

Designs on the left hand side come from more generic and user-friendly styled websites. Everything the user needs to see is directly in front of them, meaning finding their way around the website becomes far easier. An aspect such as the nav bar will include drop down boxes to further enhance the user’s experience.

IMG_0035One idea that I became fond of during the sketches was the idea of having a live feed in the contacts page. A normally boring page will become far more interesting and also create a continuity throughout the website as other pages will also have live feeds. It is also useful for the user as they will always be in touch with what the website is meant to offer them.

IMG_0034In my final sketch I decided to go a little more in detail. I’ve add certain aspect such as a form in the banner and also adding access to social media. This sketch is also trying to merge the two designs I’ve done earlier. As you can see it keeps its block form but also has the categories in an easy to access position, meaning you keep the style and functionality.




Design for Digital Media Environments – Meet the Team Page – Design Plans 1

Today was a very productive day with my group, we were able to brainstorm some great ideas. A bunch of these ideas were for the design of the ‘Meet the Team Page’. As a first step we drew some ideas out on paper just to get a quick idea of what we were going for.

2015-02-19 10.50.56

Image A

A clear theme that ran through out all of our sketches was to have the three bios placed in the middle of the page side by side.

2015-02-19 10.51.22

Image C

One aspect I really liked about Adam sketch was the meet the team banner that ran across the whole width of the page. This technique can be seem among many professional websites designs.

2015-02-19 10.51.35

Image D

What I think works well in this sketch is the use alignment, making everything look more organised. I drew from my research on Apple’s website when doing most of my sketches.

2015-02-19 11.41.41

Image E

My final sketch comes from combining Adams use of the banner and my use of the alignment. Overall I think this might be the design we go ahead with. Adam has gone away and made digital versions of these sketches to help us visualise the end result better. I will post about this tomorrow.