Showing posts with label web design. Show all posts
Showing posts with label web design. Show all posts
0

Simulated Client:Website Layouts

Here are some layout designs for my Anti-Piracy website. These first two images show a slightly different compositions of the elements. I'm not sure why the blue text is so fuzzy but the second image is my preferred design.

The way the Piano keys are positioned almost acts as an arrow attracting your eye to the word "Pirates", which is a more logical way of reading.

The way I have positioned the magpie on the microphone suggests that we want to hear the pirates views, which is the direction i am taking this sight in.
Personally I think the imagery and word 'Pirates' is enough to explain the site's purpose. However I will find out through user testing to see if this is the case. If not I will add a short statement explaining its purpose on this page.

This 'Take Part' section will be my interative element. The user will be able to post their comments concerning piracy and previous comments. You won't have to become a member to take part as it is an uneccessary procedure and could deter people from posting if the have to fill in a form before hand.

The posts will display in time order and I might include a 'name' field.

The section at the side containing the navigation menu and strap-line will be fixed, so when you scroll down to view other peoples comments they are always at hand.


At the moment the information pages will follow a similar format. I will try and keep this information concise and unbiased. I do not want this site to make the user feel like they are being nagged but rather informed. In the same way, if this site was to go live I would only remove comments if they are offensive. By giving people free rein to say what they feel and perhaps suggest methods of addressing piracy, a lot could be learned.

Although I think the strap line it is ok, could be improved and will try to work on this. I am either going to try a pirate-linked pun or try to work with song lyrics...

0

Mary Slessor Foundation

I contacted The Mary Slessor Foundation offering my services as I thought their current website was in need of updating. Gary (their contact in Dundee) agreed and gave me a rough understanding of the charity's work. He liked the slightly quirky navigation I have used on my portfolio site and apart from the Mary Slessor logo they had no current branding.

I did some research of charity websites and took inspiration from the World Wildlife Foundation. Also with my own website in mind, I took images that reflected the website's pages e.g. History and Our Work. The idea is to have a sentence or two appear when the user hovers over each image. This will allow a first time visitor to have an understanding of the charity straight away.






WelcomePage_Design 1










WelcomePage_Design 2






The main site would follow a similar layout to the following images.






I chose horizontal navigation as the vertical created too much wasted space and looks cluttered. I have aligned the navigation to create a balance with the logo, Charity name and strap line on the left-hand-side. The client also had the idea of changing the images on the header to according the the page's content, so I will be taking that idea on board.



The client wanted to incorporate green, as this is the main colour of the Nigerian flag. Although the flag is a 'grassy' green colour, I went for this rather more 'sagey' colour as is suits the design and creates a more serious feel.

The interaction will be followed through using javascript to alternate between pictures.

0

Charity website analysis


Christian Aid[view site]
This site immediately grabbed my attention due to its clever use of music and simple flash animation that interactes the viewer straight away.


World Wide-animal charity[view site]

0

Golfactory: Nearly there!

We have decided to go along the sketch book style for our Web page. This is influenced by Paul's work and also Shaun encoraging us to break away from the standard formal layouts we are so used to. This is an exhibition website and so we need to reflect the subject matter in the design.

On our last meeting with Paul, we showed him our designs and he was very keen on Vikesh's design so since we have been developing this. One problem that we have encountered has been the fonts. We would've liked a handwriting style, however we are aware not may people will have this font available to their browsers so we have had to replace this with a typewriter font 'Courier' with is much more widely used. This is a shame because I think the previous font did suit the design much better how ever it is a sacrifice we must take.

Homepage: I think this looks a lot more rigid than the other pages but i was trying to combat issues such as introduing the method of navigation. It looked a lot better with the the notepad on the bottom right and the exhibition poster at top left however, I think this way the user will notice the navigation tabs a lot quicker as we read left to right. I am also starting to worry a little about how we are going to code this as divs only allow you to be at right angles. This design would be much easier to convert into Flash. I also think it need something extra; this age doesn't look ery dynamic especially for a homepage...


Artists landing page:
The polaroids would act as links to artists that have had the most recent activity and the rest having text links on the notepad. The notepad might have to end up being more square on the page dueto the limitations of HTML and CSS.

Artists Profile Page: This would have a polaroid picture of the artist or an example of their work along side a short bio of the artist. Their work would be view using lightbox. The current site already uses this and it will allow for short captions under each image.
Exhibitions Landing Page: I have started to make things a bit more square on the page. I think this is a shame but maybe we could make a flash version at a later date?? I am also aware of the posters disappearing into the background. This needs to be combatted so they stand out more either using white paper behind or by encorporating the polaroids because i think they work really well.

Tomorrow we are going to have a meeting and finalise a design the send the mock ups to Paul for conformation. In the coming weeks we will focus on the HTML and CSS. Not sure yet how we will section these pages off but we will also discuss this so we can get cracking!

0

Goldfactory Designs







0

A Good Days Work...





I was reading a article in this months .net magazine about portfolio websites and how important they are in getting you out in the web design world. I have been meaning to sort one out for ages but never really got round to it so today i decided to do something about it and churned this out. It is a bit formal for my liking at the moment but i ca always alter tht as time goes on. Other than that though i am really quite pleased with it.

I have taken major influences from websites i have seen recently including erskine design and also the page layouts of .net magazine.

1

Client Brief-G O L D F A C T O R Y

Gold Factory is an online hub for local creatives. Similar to a blog, it allows users to display their work, and leave comments. The current website has a lot of scope for improvement which is great from our perspective. The design follows the corporate style of many other exhibition websites. It is very simplistic with bands of gold and grey and simplistic fonts which provides a blank canvas so the main focus is the artwork. From a usability perspective though, the site is appalling. There is very little to suggest the purpose of the site and the homepage consists of streams text which are too easily to ignore. The whole site seems a bit unorganised which leaves the user confused.

Artists profile pages follow a more logical layout with images to break up the text making the information much easier an interesting to read.

Navigation is the key aspect we need to focus on. I think we need to also distinguish what the client wants from the site as currently this is not clear. Is the main focus the exhibitions? or the artists?

Research needs to be done into exhibition websites. From visiting sites for Tate Gallery, Baltic Gallery, New Art Exchange, V&A etc I have found they follow a similar trend: quite formal, simplistic and to the point but at the same modern. So once we distinguish what is needed from the site, we need to decide on what avenue to go down, modern and formal, or more artistic and expressive? Audience?

0

Other Pages


1

Products pages




I have added a second bar with drop down lists. These lists will be links to individual products but wasn't quite sure how to categorise the accessores...
Obviously you won't have sizes for shoes laces either

0

zone 3




0

Zone3 update

0

This is the original design for the homepage the three blocks of colour would have images in their place. When i asked my sister she thought it was for a racing car website which backed up my thoughts that it wasn't conveying the brand. obviously with some images it would help but i still think it is very plain...

Here i have taken more influence from you original design. We have the black background with rounded white box and still have the 3 key images that will show there true colours when scrolled over(once i get the images). To make the purpose of the site instantly recognisable i have added the goggles and swim hat with the flag that emphasizes the british brand. I though i could have a piece of lined paper under the pin to add to the scrap book style....
The third image
shows a simplified version. There will be an 'about us' page anyway and the imagery will explain the sites purpose enough so i thought the Who? section wasn't needed. I've also brought the links down a touch. I don't know if you have a preference?

0

Triathlon imagery



0

Web design Company


I came across this site promoting and showcasing New Media Design's work. They are a New Zealand based company and have some really interesting/quirky element in their design...

0

HBO Voyeur Website-Nosey Neighbours!



Made by American agency Big Spaceship, HBO Voyeur is a theatrical multimedia experience and marketing campaign launched in 2007. As far as i can work out HBO are an American television channel provider similar to Sky. Once loaded this website takes you to a high-rise flat window. By clicking you are then given the choice of zooming into several apartment blocks.Within these apartment blocks you ca instigate the stories of the people living there.


This website is not only clever with the use of technology but also the concept too. It works on the idea of people watching and limitations. Its a human characteristic to be curious about what others get up to and this site allows you to do just that without getting caught! The way only a couple of rooms can be view at one time(unless you choose otherwise) offers a limited view evoking curiosity and keeps you coming back to view the other stories.