Week 7

Session 1: Today will be spent primarily of wrapping up the World Project before in class presentations on session 2 of week 7. Secondly, we will discuss the components required for the Final Web Application project. These include:

1. A project proposal (title, summary, and feature list)
2. Three design mockups of a single page
3. The complete and fully-functional web application

Session 2: Please be prepared to present your World project in class. If time permits we will also discuss the requirements for the Final Web Application component of the final project as shown below.

Assignment 5: Final Web Application (Component 3 – Webapp)
Due: Session 1, Week 15 (35 points)

Description:
Using the HTML5 web standards we have learned so far and other techniques that will be demonstrated throughout the semester, design and build an interactive web application with a minimum of five pages in primary navigation and four pages in secondary navigation. The content for the project may be of three possible categories:

1. Build the project for a real organization that is need of a webapp or webapp redesign.
2. Build the project for a real business that is need of a webapp or webapp redesign.
3. Create an informational webapp on a topic of your choice that you are passionate about.

Important: If your project is a business or organization ensure that it is one with which you are closely associated. Consult with me about your concept no later session 1 of week 9 so that I can approve your ideas. All content must be either generated by you, the organization/business, or cited to credit the original source.

Requirements:
1. Create a minimum of nine content areas for the webapp.
2. Primary and secondary navigation will allow visitors to get to all content areas.
3. Include a minimum of four of the following types of media: graphics, photos, video, sound, motion.
4. Images and text content must be your original artwork, unless cited correctly and the licenses allow for use.
5. The webapp must be fully interactive – navigate to any page from any page
6. Upload your environment to the student webspace before class on session 1 of week 15

Points Breakdown:
6 points will be awarded for designing an effective layout for the content and interface items
5 points will be awarded for a consistent and distinct primary/secondary navigation system
4 points will be awarded for placement, optimization, preparation, and choice of images
5 points will be awarded for the use of media (graphics, photos, video, sound, motion)
5 points will be awarded for developing meaningful and accessible content for the user experience
5 points will be awarded for carefully selected typefaces and type treatment
5 points will be awarded for the clarity of your presentation

5 thoughts on “Week 7”

  1. This first article is a brief description of minimum and maximum width/height properties and how to apply them in CSS.
    http://www.impressivewebs.com/min-max-width-height-css/

    This article explains media queries and how they can help make a web application responsive to different device types. https://developers.google.com/web/fundamentals/layouts/rwd-fundamentals/use-media-queries?hl=en

    This article shows how to make an off-screen navigation menu using only CSS.
    http://www.sitepoint.com/pure-css-off-screen-navigation-menu/

  2. For this weeks google assignment I searched for sites that gave tips for building a site for a non-profit organization for our final project. I found suggestions that strongly emphasized simplicity, and easy accessibility. I found it’s really important to have a branding of the organization with a logo, and color scheme, and to uses these with much intention.

    http://www.smashingmagazine.com/2009/05/14/non-profit-website-design-examples-and-best-practices/

    http://www.techsoup.org/support/articles-and-how-tos/5-tips-for-visually-enticing-nonprofit-websites

    http://www.accrinet.com/blog/10-more-of-the-best-nonprofit-websites/

  3. The first website I found gives us tips on how to make our final web applications more interactive.
    http://www.creativebloq.com/infographic/8-pro-tips-creating-interactive-infographics-11133560
    The second website I found shows us how to customize an embedded YouTube video a little bit more then we discussed in class.
    http://www.reelseo.com/youtube-embed-hacks/
    The third and final website I found discusses how to animate and add motion to our web applications.
    http://blog.teamtreehouse.com/adding-motion-into-web-design-with-animate-css

  4. This article just goes back to the basics of coding that we have first learned in class. It gives you explanations along with the examples of what each thing they are talking about.

    http://code.tutsplus.com/tutorials/28-html5-features-tips-and-techniques-you-must-know–net-13520

    This website helps with more specific categories that you can click on and then there are notes and videos within what you are trying to do.

    http://www.codecademy.com/en/tracks/web

    This site also has specific categories to help you and what you are looking for, yet another helpful site when your a beginner.

    http://www.htmlcodetutorial.com

Comments are closed.