Web Design Process Casestudy

Case-study

Case-study Pochard Fishing Lake Lake

Pochard Fishing Lake Lake

Case-study Pochard Fishing Lake Background - Buckinghamshire/Bedfordshire 1 De ne the role of the Client and Designer 2 De ne Website Goals 3 Target Audience & Site Personas 4 Mood Board: design inspiration 5 Wireframes, sketches, navigation and checklists 6 Photoshop Time !! 7 CSS and HTML Code

Case-study Pochard Fishing Lake Lake Background - Buckinghamshire/Bedfordshire 1 De ne the role of the Client and Designer 2 De ne Website Goals 3 Target Audience & Site Personas 4 Mood Board: design inspiration 5 Wireframes, sketches, navigation and checklists 6 Photoshop Time !! 7 CSS and HTML Code

Deﬁne the role of the Client and designer Your job is to focus on the needs of their users and business. Client (you) should concentrate on the broad issues, while the designer worries about the details of layout, typography and colour scheme. This helps client, you help them to provide the right kind of input throughout the process.

Remember the Man From DelMonte?

Site & Business Objectives Before your designer opens up Photoshop or put pen to paper, they should take the time to make sure they properly understand not only the brief but the organisation behind the site. By understanding your business objectives, organisational structure and marketing strategy their design decisions will be better informed.

BUSINESS OBJECTIVES

Run a Private Members BUSINESS OBJECTIVES Fishing Lake (Subscription based)

BUSINESS OBJECTIVES

BUSINESS OBJECTIVES SITE OBJECTIVES

BUSINESS OBJECTIVES Inform Collect contact info SITE OBJECTIVES Arrange a Viewing

BUSINESS OBJECTIVES SITE OBJECTIVES

BUSINESS OBJECTIVES SITE OBJECTIVES SUCCESS CRITERIA (be speci c)

BUSINESS OBJECTIVES SITE OBJECTIVES SUCCESS CRITERIA (be speci c) 9 New Members - Year One (£450 per member)

BUSINESS OBJECTIVES SITE OBJECTIVES SUCCESS CRITERIA (be speci c)

Target Audience & Site Personas

Target Audience & Site Personas Who will use your site ? What will your site be like? Persona = a ctional individual who represents your site. Name, Age, Look but most important is Character. Is your sites persona enthusiastic and charismatic or considered and reliable? Is it professional or trendy? These character traits can de ne the whole direction of your site.

Target Audience & Site Personas Design and Copy Writing Design and copy should be closely integrated. The Problem - Often design is produced in isolation and the designer nd himself developing templates that will have copy dropped into them later. This is far from ideal. Many designers encourage clients to provide copy upfront, this is not always possible. Solution - have a site persona that in uences the nature of both copy and design.

Target Audience & Site Personas Target audience - Conservative , who are not likely to be technologically adept Site persona - straightforward, uncluttered, conservative and re ect the selling point of the lake which is that it is a tranquil rural retreat.

Usability and Accessibility massive range of people: blind users, elderly users, underage users, users with slow Internet connections or older, unreliable machines users with little knowledge of the way web sites work technology enthusiasts who expect cutting edge … the whole spectrum.

Usability and Accessibility

All Types of People

World Wide Web Consortium (W3C) Setting standards

The Moodboard De ne the role of the Client and Designer De ne Website Goals Target Audience & Site Personas Mood Board: design inspiration

Client Feeback Colours used should be natural ones, greens/browns etc to complement the photos this mood. Any additional images in addition to the photos should be few in number and quite modest probably restricted to something forming part of the name 'Pochard Lake Fishing Club' or bullet point markers. An image for example of a sherman hooking a large sh with mountain backdrop I don't feel sends the appropriate message. The name 'Pochard Lake Fishing Club' should be in a clear sensible conservative sort of typeface and not any sort of modern all lower case eﬀect. Any colour background or coloured writing should de nitely not be at the expense of clarity and ease of reading.

Are Moodboards the only way ?

Are Moodboards the only way ? no!

Inspiration Sites... Patrick Haney’s Flickr Feed - http://www. ickr.com/photos/splat/sets/981332/ Design Meltdown - http://www.designmeltdown.com Un Matched Style - http://www.unmatchedstyle.com/ <See Hand Out>

The Navigation

The Navigation Information architecture; in terms of the Web, is the science of organizing information in a useful and logical manner.

The Wireframe 1 De ne the role of the Client and Designer 2 De ne Website Goals 3 Target Audience & Site Personas 4 Mood Board: design inspiration 5 Wireframes, sketches, navigation and checklists 6 Photoshop Time !!

The Wireframe

Client Feeback As regards the wire frame, it seems basically ne to me. Two points: I do think somehow the name 'Pochard Lake Fishing Club' needs to head the home page and if possible it would be nice to have all the relatively limited home page copy showing without having to 'read more'.

Proof

Proof Sign Off

Proof Sign Off Build

Proof Sign Off Build CSS HTML

Build Build

Valid or Die Trying!

Case-study Pochard Fishing Lake Lake Background - Buckinghamshire/Bedfordshire 1 De ne the role of the Client and Designer 2 De ne Website Goals 3 Target Audience & Site Personas 4 Mood Board: design inspiration 5 Wireframes, sketches, navigation and checklists 6 Photoshop Time !! st Test 7 CSS and HTML Code 8 Test Te

Sign Off + Launch

Sign Off + Launch oﬀ + Launch 9 Sign

Web Design Process Casestudy

0 comments

Notes on slide 1

3 Favorites