COMMUNITY WEBSITES

As the 'Our Happy Place' website will be for a community rather than a village itself, I researched whether there is a difference between the two in terms of web design. I found a directory of London-based community websites, which may provide some answers.

ANGEL ISLINGTON (angelislington.net)

 I really like this page for the Angel Islington area of North London, as it is simple, modern, easy-to-use and aesthetically pleasing. Although they have mixed yellow and green which can look ugly, the shades sit together quite nicely. However, I think it is the layout more than the colour scheme which gives the website an attractive look. It is immediately clear which website you are viewing, with interesting images and a video to watch, as well as a visible link for a business directory. Social media links are also very noticeable, with Facebook, Twitter, Google and Pinterest buttons, and it is the use of space that I really admire, which means that the first appearance of the website is very spacious and clutter-free.

When you scroll down, the page becomes more compact, with links to useful sites and pages down the left of the screen. Next to this is a live Twitter feed which I would definitely look to include within my site, and provides a fantastic up-to-date service for the user.

BALHAM (http://balham.com/)

The Balham website is also very spacious and clean and I particularly admire the use of typography within this example. The photography included is quite grainy, but the simple white colour scheme with occasional highlights of colour makes this a well designed website in my eyes. There is a simple search bar right at the top, and the navigational links are also simply designed and usable. There is a map to explore the area, like I have seen on a few others, and near the bottom of the page are some external links for Facebook, Twitter and Youtube involvement.

I would take forward the simplicity of this design to my own work, and I love the large typography for the title. The 'What's On' section is similar to calendar sections that I have seen, and I like the way it is separated into news for today, tomorrow and days in the future.

BEXLEY WEB (http://www.bexleyweb.co.uk/)

This Bexley Web site is also very simply done but the effect is not the same, and just feels like a Microsoft document. The homepage just features links to sites within the area of Bexley, as well as advertisements which isn't inspiring, although one of the links takes you to their blog which does have social media plug-ins.

ANNUAL REPORT ANALYSIS

Today I was also presented with a printed and bound copy of the annual report.

Overall, I really happy with my designs and it is a great feeling to be able to finally hold my work, and am proud of my achievements with the project. The colours have come out very vibrantly, and although I initially wanted more of a pastel theme to the work they put the 'happy' in Our Happy Place! This also marked the first time that I worked directly and exclusively with a client on a live brief and so it is an important milestone for me. As it was my first time with this sort of work, as well as my first experience of litho printing, there are a number of things that I would edit if I had my time again. There were some issues that were sorted when the proofs came back from the printer, such as a full stop that had jumped, but some slipped through.

One issue that has been raised is the fact that the text is justified left. This was a suggestion by the client, and although we didn't run with her suggestion of centrally justified text, I compromised with left justified. I like the effect that the the lines all start and end evenly, but it has meant that a lot of words are split over two lines and hyphenated. This image shows two lines running where this has happened, which does not look good. If I was able to redo the report I think I would go back to using left aligned lines, although this style above gives the columns a newspaper quality.

All the photographs were sent by the council, and were from many different sources. For this reason, all of the headshots for people involved in the project are in different locations with different lighting. At the time I considered removing the background for each, but some such as Helen Scarrett were photographed in attractive locations so I left them alone. However, in print, the photograph of Neal Murphy from the Two Pennies money advice charity looks very gloomy and I should have edited the contrast on that particular photograph. On the whole it doesn't matter too much but it would have been worth correcting such a basic error.

This page features a snippet from an advertisement for a Who's Who? night where local businesses meet and network. When I cropped the image to fit on the page I found that there wasn't a good place to cut off the poster as any way that I tried you could always see the start of the line below. This has been raised a few times but myself, my tutor and the printer all decided that it was best to run with the report as it was.

I designed 'Volunteer's Hours' badges to display along with the text to show community involvement, and deliberately set them at slight angles to the page as I wanted them to resemble badges that you'd pin on to your coat. However, one student disliked this style when she viewed the work during the peer assessment, but I am happy with the effect myself.

PEER ASSESSMENT

Today was the peer assessment stage of the semester, where students get a chance to view each others' work and suggest improvements. The other students were positive about my work, and especially with the cover designs but they noticed features of the report which could have been improved at the design stage or didn't print as well as could have been hoped. Their main points of improvement were for the web design section of this semester's work which I agree needs to be furthered, and that I should analyse where I felt the printed report went well and where I could have done better.

VILLAGE WEBSITES

I was advised to look into researching village and community websites when preparing to design for the Our Happy Place site, and see how they manage a similar product.

TITCHMARSH VILLAGE (titchmarsh.info)

This website seems to have been constructed using WordPress, as the navigation bar right at the top of the screen seems familiar from the website building software. Below this is the branding for the village website and possibly also for the village itself, which features a hand-drawn/naive style that befits a small organisation or community. It gives the village a quaint and friendly style and is an attractive part of the page, drawing the eye straight in. By the side is a slideshow of images from Titchmarsh, and further down are articles and adverts about local events and news. There is also a ticker below the slideshow which scrolls through some of the latest news, as well as links to social media on the page.

The feel of this website is very cheerful and rural, and I would like to recreate some of the atmosphere generated by the colours, design and typography. The points that I would look to transfer onto a website for Our Happy Place are the slideshow, which can be a powerful tool to bring viewers into the page, and the ticker for latest news which is very useful for events such as road and school closures, but I may design something wherein it is incorporated into a Twitter feed.

LONG MELFORD VILLAGE (longmelford.co.uk)

This website for Long Melford is not as successful as that for Titchmarsh, and seems dated by today's standards, and possibly has remained largely unchanged for over a decade. The background is green, which fills the whole screen with plain colour, with the main body of the website set in white over the top. The first thing that catches the eye is a panorama of the village, but the image is not as inspiring as those shown by Titchmarsh, showing a boring scene on an overcast day. Below this is the main body of the website which is very wordy, but the links on the right hand side of the screen are visible and ensure that the site is easy to navigate. There is an option to like the website on Facebook, with a small button below the photograph, bringing in social media but it is perhaps not used as effectively as possible.

I'm not sure if there are any positives to this website to take forward into designing for Our Happy Place, but it seems functional. It is the sort of website that you would only view for a specific reason, and not one that you would spend any time on. However, it shows that even simple and small websites value social media plug-ins.

PEMBURY (pembury.org)

The website for Pembury is very similar to that of Long Melford, but is a little more dynamic. The background isn't a plain colour but is instead a collage of images with the opacity lowered so as not to distract from the information provided on the site. As well as this, the panoramic header is a slideshow and so more of the village can be shown to the viewer, and the whole page seems a little more modern and you'd want to spend more time on this than the last. Again, social media has been included, but this time it suggests that you follow the organisation on Twitter, and at the bottom of the page there are options to share it via Twitter, Facebook, Google+ and email.

Again, very functional but not an inspiring example of web design.

KINGTON ST MICHAEL (kingtonstmichael.com)

This is a very nineties looking offering, and is an assault on the senses with its confusion of colours, shapes and layouts. I wouldn't want to spend any considerable time on the website, and doesn't seem to add much for the village. This is one example that isn't up-to-date with social media, and has no mention of Facebook or Twitter, which could reflect the age demographic within the village or perhaps that of the designer. I feel that if I were to make a website for Our Happy Place with this style, it wouldn't add anything to the community and so I will avoid any of the trappings here. 

WIGGINTON VILLAGE (http://wiggintonvillage.co.uk/)

I decided to look up my village's website, for Wigginton in Hertfordshire. It is another poor website, although the top navigational banner is like that used by Titchmarsh village, and there is a photographic background to the page. Again, the main bulk of the site is on a white background where the latest main stories can be posted, which on this day is quite a strange cartoon. On the right hand side is a good feature, with calendar entries for the week ahead for all the village's organisations.

I know that Francesca was keen for a calendar page on the Our Happy Place website, and this sort of style could be useful as a simple and obvious way of displaying upcoming events.

WORCESTER.GOV

This is the website for Worcester City Council, that the Our Happy Place site could possibly be incorporated into, worcester.gov.uk

The banner image at the top features some attractive photography, with boxes to allow the user to enter their postcode to find relevant local information and also a search bar. Below that is the header, in the council's colour of bright green which I feel is very overpowering, along with the council's insignia. A lot of white space is used as well, with just touches of bright green which allows the majority of the site to be easy on the eye. In terms of the content, there is a main menu of quick links that are commonly used by council residents such as benefits advice and housing. There are also features, latest news, online links and a map. On the right hand side under the news links there are social media plug ins and links, for Facebook, Twitter, Youtube and an RSS link.

At the bottom of the page there are more external links, including the main Gov.UK parliament site. I find this site quite ugly, as the green is far too bright. The site is also very uninspiring and you don't feel the urge to stay on the website for long, although I imagine it is quite functional, especially with the quick links right at the top of the page. One link directs the user to the Worcestershire Hub (whub.org.uk):

This site brings together sites from the City Council and six local district councils to provide an information point for the whole area. This is also something that the Our Happy Place site could tap into. This follows a similar design scheme to the city website, with the photography and search bars very similar, however the colours are much more muted, with pale purple instead of bright green.

Here, I have designed a banner for an Our Happy Place section on the website, as one of the possibilities of the web element is becoming a subsidiary part of the main Worcester City Council site. For this reason it would have to adhere to certain guidelines, and as the Worcester City Council and Worcestershire Hub sites use the same style header so I developed one for OHP.

I used the house design instead of the floral photography and changed the header background to the pale blue from the report's colour scheme. I superimposed the Our Happy Place logo in place of the previous logos, but the yellow-green clashes against the blue. All in all it is not too bad, and so it could be a viable design.

WEB ICONS

When transferring the style of the printed report to the website, I feel that the main connective part of the design is the coloured house pattern. I also feel that the house icon would make a good home screen button, in the style of that used by Twitter, and set about designing a few more icons that could possibly be used.

These icons could be used for home, calendar, contacts, directory, education, health, services, partners and projects. I rendered them all in the two-tone blue scheme from the report. I am not sure that all of these would be recognisable without typography and so that may need to be added as well.

SOCIAL MEDIA MOCK-UPS

To begin with designing for the internet I decided to mock-up potential pages for social media for Our Happy Place, namely Facebook and Twitter applications.

Facebook

This is a design for a Facebook page for Our Happy Place. Facebook pages are limited in terms of design, with just a cover image and display photo to change. I opted to continue the coloured house design as the cover image as it fits well into the space and provides a cheerful accompaniment to the site, contrasting with the understated standard Facebook design. I used the Our Happy Place logo as the profile picture for obvious reasons, though I wasn't sure how well it would fit into the square available, but I like the effect of the final design due to the negative space.

Twitter

Twitter features a little more editable content than Facebook, with a background image as well as a header and profile picture. I tried to maintain the same theme as the Facebook version and merely tweak it but I found I had to make a few changes. The coloured house design again takes precedent and in this case is used as the background, but I found that the Our Happy Place logo didn't suit the small size needed for the profile picture due to its shape. For this reason, I moved it into part of the background and used the identifiable houses as the user icon image. I used blue for the header colour as that is the main part of the colour scheme in the printed report.