CS 216 - Spring 2016: Assignments

Midterm Project: "My Portfolio"

Assigned: February 21, 2017
Design and Plan Due: February 28, 2017 (in class)
Due: March 17, 2017 (11:59pm)

Develop a website that serves as a portfolio for a set of your projects. The projects can be the labs in this class, your own creative work, or made-up work. You will learn ways to make a site like this more flexible later in the semester, but for now we will keep it relatively simple.

Content Requirements:

  1. At least 4 projects need to be featured in the site.
  2. Images of each project must be included on the home page, with links to relevant sub-pages.

Code Requirements [65 points]

  1. At least 2 components of the date should be displayed (e.g., day of the week, time, month, day, year). You will need to separate these components out from the full date and style them accordingly.

  2. The four projects should be displayed as follows:
    • An image related to the project should be displayed at all times in a set place.
    • The image should be a link to a page/site that gives more information about the project.
    • When the user hovers over the image, a short description box should appear on the page. The box should disappear when the cursor moves off the image.
  3. One project must be shown as the "featured project".
    • It should be displayed in a special way on the page, in addition to its regular spot on the page.
    • The featured project should be determined based on the day of the week.
    • There should also be a button that, when clicked, randomly choses a new featured projects to be displayed in 5 seconds.
    • Include a "count-down" message for the 5 seconds
  4. The JavaScript code must be well-structured and make appropriate use of functions and arrays.

  5. All event-handlers must be defined in the JavaScript code, not in the HTML code

Style Requirements [30 points]

  1. The site should make effective use of div's and must not use a Table for the layout.
  2. The site should be styled to look professional, be coordinated among the pages, and use a variety of style features.
  3. The site should incorporate at least three creative features.

Design and Plan Requirements [5 points]

  1. Your design should include a wireframe sketch of your home page layout.
  2. Your plan should include a timeline for completing your project.

General Requirements

  1. The website folder should be organized appropriately, with the main page in index.html and the images in a separate "images" folder.
  2. HTML and CSS pages must validate. JS pages must be free of syntax errors.
  3. All javascript and css code must be in files separate from the html code.