Web 1 - DES255 Midterm/Final Requirements

Requirements of Midterm

Your midterm will be a presentation of 3 pages of your website design (in desktop and mobile sizes) and a style guide, made in Figma. (No code is required yet , just a Figma file showing your visual design - fonts, images, layout, etc. We will spend the rest of the semester translating this design to code)

Here is an example Figma file

For more information on style guides, read Creating A Style Guide

• A style guide for your website design. Style guide should have:
  • Typography
    • Headings
    • Paragraph
    • Links - Show both the "default" link style and the state of this style when the link is hovered over via a mouse.
    • Any additional typography styles used like functional text or quotes
  • Colors
  • Component Styles - Any elements that are reused throughout your design, for example:
    • Buttons - also show what it looks like to be hovered on
    • "Cards" - self-contained groups of content like an article with an image and a title
  • Icons used throughout your design
  • Form styles
• At least 3 pages of website design in desktop and mobile sizes, built in Figma
• On the day of the midterm, students will present their style guides and website design
• Your presentation should include the following. Please also submit a written version of the following with your Canvas submission.
  • Explain your design decisions as they relate back to your project brief and principles of good design.
  • Explain the feedback you are received so far and how you incorporated or considered it in your design.
  • Let the audience know what areas you are most looking for feedback on. Provide feedback to other presenters
• See slides and additional reading from class 2 for more tips on sitemaps and style guides

Requirements of Final

Finals will be presented in class during our scheduled Final Exam slot. Please keep your presentation to 5 minutes or less. Giving feedback to others is part of your grade.

Submit to Canvas a link to your website and code on Github and a written version of your presentation

Your final will be graded as follows for a total of 30 points. The final represents 30% of your grade

• A website with at least 4 pages built with HTML and CSS (bonus points for more) One of these pages will be the homepage, one will be the blog example we build in class, and the other two are up to you. - Make them linked to each other in some way. - 2 points per page
• Should be on Github and accessible via GitHub pages - See Understanding Git and Github - 2 points
• Should include at least 1 feature with Javascript functionality - See Class 11 , Class 12, and Class 13. This can be as simple as text that appears on click, or an alert box, I just want to see that you know how to connect a JS file - 2 points
• Should be responsive to different screen sizes - Use @media queries at least once - See Class 9. 2 points
• Be able to explain how website is built with principles of accessibility -See class 10 - 2 Points
• Be able to explain how you used your code to achieve different styles - 2 points
• Be able to connect the design back to the project brief in terms of goals, audience, etc. - 2 points
• Identify areas you would like to improve, get feedback on, and keep working on - 2 points
• Provide feedback to others. 2 points
• Proper syntax and formatting of code - 4 points
• Resemblance to midterm design (if you decided to make a stylistic change that differs from your design, point this out and explain) - 2 points
• Written Presentation - 2 points for submission of written presentation