Assignments

DMA-145 Weekly Assignments

Assignment Grading Rubric:

CRITERIA

RATINGS

TOTAL POINTS

Complete

Yes

2 pts

No

1 pts

On Time

Yes

2 pts

No

1 pts

1. STYLETILE

Create a style tile using Google Drive. You must use one of the color palettes identified in the lecture. You should look for images that have textures or patterns that you will be able to use in the design of the website.

The colors and images should work together to convey the messages you chose to describe your historical figure.

2. Basic Html

Create a basic HTML page for your historical figure. You can copy and paste information from their wikipedia page.

Content Requirements: (minimum)

  • 1 headline
  • 1 sidebar (DIV container)
  • 3 paragraphs
  • All names of people linked to their wikipedia pages

 

Technical Requirements (code from demonstrations)

3. HTML WITH CSS AND LAYOUT

Add layout elements and style rules to your historical figure wikipedia page.

Content Requirements: (minimum)

  • 1 headline
  • 1 sidebar
  • 3 paragraphs
  • all names of people linked to their wikipedia pages

Technical Requirements: (code from demonstrations)

4. HTML/CSS

Create a CSS and HTML page for your shoe store. Use all of the text in the wireframe, then style it using google fonts, lists and classes AND DIV’s. When you are finished upload the project2_website folder to the viking server and send me the url for your index page. (If you do not know how to upload it–zip it and attach it, you will lose one point for zipping it.)

Content Requirements: (minimum)

  • all text from the wireframe

Technical Requirements

  • Demonstration: Adding custom fonts and lists to CSS (all the code from the code box)

5. POSITIONED PAGE WITH IMAGES

Modify the HTML/CSS page you made last week by adding divs and positioning them. Add both content images (shoes and logo) as well as background images for your boxes. Please upload your files to the server and include the link in the space below.

Content Requirements: (minimum)

  • all of the information on the wireframe
  • customized information in the yellow sections of the wireframes (from the creative brief ect.)

Technical Requirements

  • (all the code from the code box)
  • images

6. STYLETILE AND WIREFRAME

Create a photoshop styletile and a wireframe for the home page of your Thyme website.

Content Requirements(styletile): (minimum)

  • 1280 pixels width x 720 pixels height at 72ppi
  • MUST include the fonts you will use
  • MUST include the images you will use
  • Must have one photograph
  • Must have logo
  • All images must be in the pubic domain

Content Requirements(wireframe): (minimum)

  • MUST include all of the information for the home page
  • MUST include all of the photographs for the home page

7. HOMEPAGE WITH ANIMATION

Create a HTML/CSS for the homepage of your restaurant website.

Content Requirements: (minimum)

  • all of the information on the wireframe for the home page
  • any additional information that will help users with their goals

Technical Requirements

  • use ids and classes
  • use divs
  • use relative positioning
  • use animation
  • use fonts from google or font squirrel
  • use public domain images

8. SECONDARY PAGE

Create a secondary page for your restaurant website.

Content Requirements: (minimum)

  • all of the information on the wireframe for a secondary page
  • any additional information that will help users with their goals

Technical Requirements

  • use links (a:link, a:visited, a:hover)
  • use css animations
  • use fonts from google or font squirrel
  • use public domain images

9. BOOK WEBSITE – MESSAGES & TITLE

Pick your book and two messages that you will communicate.

Content Requirements: (minimum)

  • Title of your book (example –  Little Red Riding Hood)
  • 2 messages (example – spooky and fun)

10. BOOK WEBSITE – WIREFRAMES, SITEMAP, AND COMP

Create a sitemap and wireframes for each page of the website for your book. All of the words that will be on your website MUST be in your wireframes. Pick one page and create a Photoshop comp or a HTML/CSS page. Your page must show examples of the title, imagery, navigation and color palette.

Content Requirements: (minimum)

  • 4-6 wireframes, one for each page of your website, 1 sitemap (will all pages)
  • 1 comp in Photoshop or 1 HTML/CSS page

11. BOOK WEBSITE – GAME PAGE

Create an interactive “game” page for your book website. Make sure that your game relates to your book and brings the user deeper into the world of the story. The game page should be named something other than “game”, it should describe what you are doing–like finding a head for the headless horseman or creating a monster or dressing a wolf like a grandmother.

Content Requirements: (minimum)

  • name of the book
  • interactive game
  • links to the rest of the pages
  • all text and images must be part of the public domain

Technical Requirements

  • JQuery draggable or JQuery hide and show

12. BOOK WEBSITE – ORDER PAGE

Create the order page for your book website. Think about the information that you should be collecting and create an ordering experience that is unique and easy.

Content Requirements: (minimum)

  • name of the book
  • title of the page
  • order information like quantity, shipping method, book type ect.
  • links to the rest of the pages
  • all text and images must be part of the public domain

Technical Requirements: (minimum)

  • form elements including radio, menu, checkbox, textbox and button