Friday, March 8, 2013

Project 3: Comics, Candy, or Animals

Select one of the following topics to plan, develop, and design a 15 page site: Comics, Candy, or Animals. Comics can printed, animated, or newspaper. Candy can be manufactured, homemade, you name it. Animals can be in the wild or at a zoo; the animals must be real and alive today, but could be endangered.

Process:
  1. Recognize a need, and then fill it. You may find that you don’t need a site, but dig deeper to find a purpose and reason.
  2. Identify a problem or problems. Deliver a web experience about something that doesn't exist, or about something that is already out there, but not fully realized.
  3. Hunt and gather. You will need to collect text-based information, images, and perhaps video.
  4. Analyze. What do you want to display on the web, and what ideas come from the content you have gathered?
  5. Synthesize. How should the site be organized for people to experience? Make a plan.
  6. Design. Mock up some frameworks you will use as wireframes and color layouts during this early prototyping phase.
  7. Test. Get feedback. Run through scenarios that demonstrate its use, and prove its usefulness.
  8. Finalize and Refine.
  9. Evaluate. Do or did your assumptions, and those of others, improve the site?
  10. Reevaluate. Be critical, once again, and as much as possible, before the final release. Make edits. Clean up the code. Polish the look and feel. Be detail oriented.
  11. Launch.
Personas, Topology, and a Description of the site are also required for this Project, see Key Project Milestones below.

Split the material or interest you have into functioning parts. Determine the differences between these individual sections. Develop a concept that uses appropriate elements to describe the topic you have selected. Use this to develop your navigation and/or content sections of the website. This site should reflect a commitment to your endeavor to direct users to the site and demonstrate your ability as a designer/developer.

Text and images can be taken from other web sources, or any analogue material you find, or create imagery/graphics that are applicable to the subject. Cite the places where you find any referenced images by captioning the images, the same way that news sites do to credit the photographers.

15-page site structure:

  • (5 pages) Text dominant pages: article entry, stories, conversations, about page, poetry, etc.
  • (3 pages) Image dominant pages: such as portfolio, promotion, photo contest, etc.
  • (5 pages) Text & Image balanced pages: home page, article features, people highlight, link reviews
  • (1 page) Form specific page
  • (1 page) 'Goody' page that must be approved by the instructor
Key Project Milestones (consult calendar for deadlines):
  • research paper describing project's content and creative direction
  • persona collage that visualizes the "ideal user" of your site
  • topology of site architecture, outline of content
  • rough wireframe design
  • front end concept due, full color, PDF with imagery
  • half of site done as 15 pages wired, with functioning links, layout translated, and "blocking" for imagery
  • last visual review of all work
  • final turn in
Worth 200 Points; Rubric:
  • 15% research, site map, text content/research, and mood board
  • 35% operational HTML5 site with 1 "Goody" component; passing "validation"; using an approved JavaScript or jQuery element; use of HTML5 elements (nav, header, aside, footer, article, section) as elements, neither IDs or Classes
  • 20% navigation
  • 30% design appropriateness, look and feel
To be handed in: uploaded 15 page web-site, to each student's design.birdnest.org server space, and also copied to the Turnstile2 class VCOM 262-002 server folder