GD 65 Class 04A

Topics

Final Project Assignment
  • Competitive Analysis
FTP (File Transfer Protocol)

Final Project Assignment

Due: Classroom Presentations on Thursday, December 18 at 2:00pm

Pick one of the websites from the list below. Redesign this site for your final project but give it a new name – your final project will be inspired by this site but will not use the exact name from this site. (We want to avoid copyright issues surrounding the use of someone’s name, logo and content).

Lark Cake Shop
http://www.larkcakeshop.com/

Bike Improve 
http://www.bike-improve.com/

The Way We Wore
http://www.thewaywewore.com/

California Heritage Museum
http://www.californiaheritagemuseum.org

Write two or more paragraphs critiquing the effectiveness of the current site. Base your critique on the objectives from “The Basics of Web Design” reading and the critiques you did Week 03.

  1. The Grid
  2. Color Palette
  3. Navigation
  4. Design Principles
  5. Typography

Describe what works and does not work with the design. Who is the target audience? Post this critique to your Tumblr blog.

Redesign 5 pages of the website you’ve selected to redesign. Create a site map for your project and save it as a PDF to your “source_files” folder. Create a design comp (for all 5 pages) in Photoshop paying close attention to the layout and the balance and composition of the page. Using image slicing (we’ll cover this in later in the course), create the assets and compress the file sizes effectively. Pay particular attention to the consistency of the navigation.. Using either a one-column or two-column layout, build the pages in HTML using one external CSS file.

Specifications:

  • Optimize your design for a browser resolution size of 1024 x 768 (remember the dimension of your page should be 990 pixels wide and the height of the page will vary from page to page depending on the amount of content. Don’t make all your pages the same height!)
  • Your Photoshop file must be RGB and 72 dpi.
  • Set up your file structure correctly with a “lastname_firstname_final” folder containing 2 separate folders: “final_web” and “source_files.”
  • Complete 5 HTML pages with ONE external CSS file
  • Must use HTML text for the main content of your site, not images for your text.
  • Please use images you have created, or free or royalty-free images on your site. (See possible sources below).
  • Upload your final project to the class server via FTP.

Possible sources for images:


Competitive Analysis

What are the others doing? Analyzing the websites of major competitors is vital to the success of your design. It is better to know the competition’s strengths and weaknesses before you finalize your website strategy and design. Here are the basic steps for conducting a competitive review:

  1. Identify the competition—Ask the client who their major competitors are. If you don’t have this information from the client, you need to do research on your own and find a group of websites that are in the same market or industry. When possible, identify seven to ten main competitors to review. At the very least, review three competitors.
  2. Decide what to analyze—Reviewing the competition has many benefits, including increased understanding of this business sector, common vocabulary, best practices, as well as the obvious strengths and weakness of the competition. Types of information you might gather include in your analysis:
  • Media. Images, Audio clips, Video clips, etc.
  • Graphics, Animation, jQuery, ads, etc.
  • Content, Press releases, a description of products/services, a company description, bios, a client list.
  • Functionality. Slideshows, search, login, forms, social media, registration, online store, etc.
  • Aesthetics of the site: Good design? Poor design? Professional looking, or do-it-yourself?

 Write up a competitive analysis report. The report can be informal and include your findings, screenshots of the competitive websites, strengths and weaknesses, and a rating system indicating which websites are most successful and why. This will get posted to the Discussion section next week.


FTP (file transfer protocol)

Be sure you understand how to upload files to the class server. (We’ll cover this in our next classroom meeting). You will be required to upload your final project website to the class server so please let me know if you have any questions about this!


Next Page  >  Class 04B Notes

Leave a comment