European Academy

Design Folder

Student Name: Neal Zupancic

Subject: MYP Technology

Grade: 8/9/10

Duration: 7 weeks

Project Title: HTML5/CSS Design Folder

Tbilisi

2013

Design folder

The design folder is a compulsory component of MYP technology!

As students progress through the different stages of the design cycle, they are constantly experimenting with ideas, researching topics, compiling sources, brainstorming issues, sketching possible solutions, making changes, rejecting proposals and critically evaluating their work. All relevant activities and outcomes should be recorded, and dated, in the design folder.

The design folder is a compilation of evidence that accompanies the final product/solution for a unit of work.

Students formally record the results of their research, their various plans and designs and the evaluation of their finished products/solutions in the design folder.

The design folder must be clearly divided into: investigate, design, plan, create, evaluate. It must begin with the student’s investigation and end with the evaluation.

Criterion A

Problem: Briefly explain in your own words what your task is.

Learn HTML. And CSS. Make a website to show this.

How is this task relevant to real issues? (Life, society and the environment)

- see email -

How is the task related to the Area of Interaction?

Area of Interaction: ATL (approaches to learning) - this task will help us learn. We will learn about how we learn HTML/CSS. We will learn by doing.

What I need to investigate to complete the task:

Information about HTML! Elements of HTML. HTML and CSS online tutorials and references. How HTML5 documents are produced. Other modern webpages that use HTML.

Information collected:

How to do stuff in HTML (HW 1, 2). How to use semantic HTML (HW 3,4). (put in links, screenshots, code excerpts, etc. to show the information we have collected)

Here is Homework 1, which shows how to use basic HTML elements like headings and links.

Here is Homework 2, which shows more complex HTML elements, like lists, tables, and embedded images.

Evaluate the sources of information:

(HW 4)

Design Brief: Briefly explain how you intend to complete the task.

Make an online design folder that shows our understanding of HTML5 and CSS. Use modern HTML methods, including semantic elements, to structure our document. Use CSS to make our design folder beautiful.

List the sources you will use

  1. w3schools
  2. w3.org
  3. HTML5doctor.com

Design specification (List of requirements that must be met by the product or solution):

  • written in HTML and CSS
  • written ourselves, not with an HTML WYSIWYG editor or code generator
  • must use HTML5 specification
  • must contain each element of the design folder
  • good design - attracts attention - beautiful
  • readible/informative
  • usable/easy to use/intuitive
  • should work on a variety of browsers/platforms

Design tests to evaluate your product/solution against the design criteria:

  • Check to make sure that we are using HTML5 semantic tags properly (http://validator.w3.org/)
  • offer evidence of doing our own work: files at various stage of creation, etc.
  • compare the product to our Word design folder and make sure each element is present
  • show to others to get their opinion about our design, readability, ease of use
  • open the product using different browsers: safari, opera, IE, firefox, chrome, mobile devices

Works Cited:

Please wait to fill this section out