INSTRUCTIONS
OBJECTIVE:
- Create a business related web site, or
- Create a website
on your favorite book or movie..
The basic requirements are the same for both types of web sites.
A business related web site is a site that generates revenue or significant
savings in some way. You have a choice of three types of business web
sites:
OPTIONS FOR BUSINESS WEB SITE DESIGN:
- Company: A comprehensive web site that describes the company's products
or services. The Site could include helpful features such as FAQs (Frequently
Asked Questions), job opportunities, online customer support, company
mission statement, department profiles, current events, et cetera.
- Online store: A web site that sells a line of products (at least five
products). The merchandise should be presented in an organized and attractive
way. Each product should be presented with a complete description and
price. A simple order form must also be included.
- Online Information Service: A web site that performs a service. Examples
include movie review site, horoscopes site, and specialty newsletter.
OPTIONS FOR WEBSITE ON YOUR FAVORITE BOOK OR MOVIE:
- Make a website with information about your favorite book or movie.
To Do:
- Do Thumbnails to brainstorm different ideas for your design. You do not have to turn them in, but feel free to post them in the discussion forum to get feedback.
- Do 3 comprehensives(comps) for the site. Do 1 for the home page and at least 2 other pages. (See Comps below and see Comp Samples Here). OR...
- Do a communication or creative brief for your website. See
a communication
brief worksheet and Go
to "Web Redesign" for Creative Brief ideas. Click
on Sample creative brief to see a sample. Another take on creative briefs can be seen here.
- Samples and instructions for the creative brief are also in the lessons folder.
- The comps OR written brief will be turned in for a grade.
- Thumbnails will not be turned in, but you should use them as a planning tool.
- Apply HTML features you have been learning through lectures and tutorials
- Combine the use
of HTML and Image Editing software
- Beta Test the site
Comps or Communication Brief(10
Points):
Develop 3 comps that shows your intentions for your design
- For Comps
- Look at examples from previous classes in the lessons folder.
- Give me digital files.(psd, jpeg, pdf, or powerpoint)
- Be sure that you will be able to get the images for all concepts in
your proposal and storyboard.
- Make sure to choose proper graphics, text and colours for the intended
audience.
- Comps should be in correct aspect ratio(shape) for the intended
layout.
- Comps should be of high enough quality to present to an actual
client.
- For Communication Brief see above under To Do
- You only have to turn in the Communication Brief OR the Comps
Specs (10 points):
The Minimum
Requirements Are
- At least 5 Pages
- 1 form
- CSS used for all
layout and positioning of content, except where tables are appropriate
- At Least 3 Images not acquired from the Internet (should be original or scanned).
You may also use images from the internet for the rest of the images.
Expectations:
- The web site must look professional, well organized, and stylistically
consistent.
- It is important that you use the time allotted for the assignment
wisely. Don't wait until the last week.
- Make sure that the design fits the content.
- Think about your target audience and their expectations.
Design & Finesse: (Refer to point totals at top of page)
- Communicate the message
- Design fits the content
- Proper optimization of images
- Good composition of pages
- Good colour harmony
- Good functionality/usability
- Intuitive and functional navigation
- Type should be legible, use appropriate fonts for the design
- Final Presentation to the class
User Testing
Update: No Beta Test scheduled Summer 13.
Important Notes:
It is a good idea, however, to show your work to other people throughout the design process to get a fresh perspective on what you are doing. You can't really tell how well your design is working for users because you made the site. You know how it works already. Explore whether other people 'get' your site, if they see what you want them to see, and how well they can use your site. You can do this all the way through the process from sketches to comps(image based mockups) to working versions.
Check out the book Rocket Surgery Made Easy: The Do-It-Yourself Guide to Finding and Fixing Usability Problems by Steve Krug for tips on usability and user testing. It's a short and simple book.
See a video of an example usability test from the book here:
Rocket Surgery Made Easy - Steve Krug book/video on usability testing
Beta Test:
You will conduct a test of your site to determine, among other things:
- How well it fulfills it's goals and communicates ideas.
- The quality of the design.
- The technical quality of the site.
Refer to the beta
test information and form in your HTML Handout, and/or download information
on the beta tests.
Get
Beta Test Help/Description. Get
Beta Test Form. |