Project Five: Developing a Website for a Client

The Brief

For this assignment you will be given a client to produce a web site for.  These clients are working with a company called First Steps, who have negotiated the individual briefs with the clients, so they will be briefing us on the nature of the clients’ requirements on the first day of this project (Monday 5^th March).  During the project you will be liaising with the client and with First Steps by a set of agreed deadlines for research, ideas, mock-ups and a prototype.  A record of your correspondence with the client, including any feedback they have given you, must be presented in your blog. 

Three websites have been commissioned so you do not have a client each.  There will be groups of up to 4 students working on each project, but you are working competitively rather than collaboratively. Your tutors will allocate you your group and client. You will each be working individually to answer the brief and produce a website suitable to the client’s needs, though you may need to generate content for the website collaboratively. The client will ultimately choose one site they intend to use professionally (as long as there is one which is suitable to their needs and produced to a high enough standard). 

You will build your web site using html and css in a text editor, such as Textwrangler, and the graphics will be made in a Photoshop and/or Illustrator, then compressed for the web.  You will build and develop skills to provide a sophisticated interactive user experience in this website.  This will mean you can introduce interactive image display features such as remote rollovers and lightboxes, as well as enhancing the interactivity with features such as animated transitions using jQuery and CSS3 techniques.

For the typographic elements of your design you will use webfonts using either @fontface or Google Web Fonts.

You will have to use the First Steps initial briefing on the client and their requirements as the terms of reference for your visual research and the development of your designs.  It is important that you gather a strong set of visual references for the subject area with which you are dealing and that you can make clear and cohesive decisions about the appropriate visual language you use. 

You will need to demonstrate your approach to the creative process using methods that are standard to the digital media industries.  As well as your visual research, your sketchbook and blog should show sketches, ideas and experiments for the designs in development so the processes you used to reach decisions on such issues as wireframe layout, colour, typography and navigation are transparent.  Navigation must be planned using flow diagrams. 

Just as you will have to constrain your design decisions to the expressed wishes of the client, so too will you have to remember that you are making a web site and allow for the limitations of the technology. Your design should pay clear consideration to what you have learned so far about the realities of web design.  For example, you should think about the target audience identified by the client and consider what kind of computer they will have, what kind of internet connection they have, what kind of screen resolution they’re likely to be using and how that will affect the images and the design you make.  Your sketchbook and/or blog must include a section of research into these kinds of issues, including recent statistics on browser type and version use, proportions of different screen resolutions, platform, and internet connection speeds.  You should also comment on why this is useful information to you as a web designer. 

In the pitch you need to show the research process in order to justify how you reached your design decisions. The pitch must include navigation flows, wireframes and full mock-ups based on grids. 

You must produce a ‘Branding Guideline’ for your proposed design. This should include Logo design, typographical choices for headings and body text, colour palette, examples of interface elements, at least 2 page mockups and a sitemap of your navigation. You will also include a price for the project.

This Branding Guideline must be included in your pitch and must also be uploaded to the server as a pdf document and a full colour printed version supplied at the time of the pitch.

You need to show and justify where you are intending to include your enhanced interactivity.  You need to make any changes to the mock-up based on pitch feedback and send .jpgs of them to your client for feedback following the pitch.  Further changes may be necessary following feedback from the client, and on-going liaison with the client may guide your ongoing design development.
(please treat this as if you were competing for a paying job and prepare your presentation accordingly).  

The site you create must be optimized for search engines and accessible to people with disabilities. Your sketchbook and/or blog must also show research into these areas and your site must demonstrate the application of techniques helpful to SEO and accessibility.

Sites will display differently in different browsers, so the testing process is important. You will put your site online on the courses server and test on a range of browsers and platforms at a range of screen resolutions. You will record the testing process in your sketchbook and/or blog.