Challenge Statement

1. Overview

Your challenge is to build a publicly available interactive web application that displays dynamic content relating to one or more of this year's topic categories: Food, Health, and Sports. To receive course credit and be eligible for prizes, your site must fulfill the requirements outlined in this document, and your team must demonstrate satisfactory progress at each of the scheduled milestones.

Your site is due at 7 pm on Wednesday, January 27th. No late submissions will be accepted. More specific instructions about how to submit your site will be available later in January.

2. Requirements

2.1 Store Data in a Database

Your web application must have access to a database containing records about one (or more) of three topic categories: Food, Health, or Sports. These are meant to be flexible categories; each can be interpreted several ways to create a wide range of useful sites. For instance, a "Health" site could involve counting calories or tracking the spread of diseases, sharing workout plans or comparison-shopping for medicine.

How Much Data?

You don't have to have millions of rows, but the size should warrant using a database. In previous years most teams have had tens of thousands or hundreds of thousands of rows in their databases; database performance has rarely been a limiting factor. If you think you'll have less than 1000 rows (across all your tables), please talk to a staff member first.

Note that for the scope of this challenge, large datasets are often no harder to build or access than small ones.

Getting the Data

You won't be provided with an official dataset. You will instead be free to download data from anywhere you like. We'll have a lecture to discuss how to do this and where to look in detail (on Tuesday 1/5).

One common resource is Freebase (freebase.com), an open, online database with an API that is built from user contributions and seeded with other open sources of online data such as Wikipedia. Freebase has an interface for browsing data that can help you get familiar with the information that is available.

For instance, at http://www.freebase.com/view/food, you can find lists of entries for Restaurants (103,771), nutrition facts (49,692), and so on.

If you have too large a dataset, feel free to focus on a specific subset that would make an interesting website. For instance, foods that are kosher, athletes who have changed sports, or diseases that are genetic.

If you're not sure if you're allowed to use a dataset or if it satisfies the requirements of this course, ask a staff member.

2.2 Display Data from a Database

Your web application must incorporate food, health and/or sports data stored in a database. You may tailor your site around a particular subset of the data if you prefer.

The pages you display must be created dynamically. You cannot have a static HTML file for every food or athlete; instead, you must use a database to house all the data, and design your web site to query the database and display the information dynamically.

An example solution to this requirement would be to implement a simple search feature and link results to dynamically generated details page for each {vegetable, disease, rugby player}. This type of solution satisfies the requirement, but there are many other designs you might try. (Don't underestimate the difficulty of producing even a simple solution, however.)

2.3 Integrate Third Party Data OR A Data Visualization.

Your web application must do at least one of the following:

Third Party Data

Integrate data from a third party into your site. This must be done dynamically, that is, your site should fetch information on the fly, as users need it.

If you're familiar with the concept of a mash-up (displaying the combination of two sources of data on the web), then think of this as a mash-up with your static food, health or sports data. A mash-up can display data in many different ways: as text, on a graph, on a chart, on a map, on a timeline, as embedded media and much more. Be creative! There are numerous mash-up sources available; each one will probably require you to learn an API. Lectures won't cover any particular APIs, but if you're having trouble with a particular API, feel free to ask a staff member.

Note that this is a different kind of data than the sort that you will store in your database. Information that changes rarely because it is factual or historic (calorie information, disease outbreak statistics) should probably be gathered once, formatted and "warehoused" in a database. "Live" data that changes hour to hour (traffic data, weather, sports paraphernalia auctions on eBay) is more valuable when it is fresh.

We'd prefer you get this information through a documented API or RSS feed; if you plan to use other means (like scraping web pages) please talk with a staff member first.

Data Visualization

Create a compelling visualization of data that is created dynamically. Your visualization should illuminate some feature of the data that isn't obvious or trivial. Ways to visualize data include graphs and plots, tag clouds, timelines, a web describing relationships between objects, and heatmaps.

The user should be able to specify some inputs to the visualization, such as a zip code or athlete name.

We recommend that you make it easy to see some visualization by showing a default visualization, suggesting default input values, or showing recent visualizations.

We encourage you to use existing tools to display data; we will discuss some possibilities in class.

2.4 Technologies

There are no limits on the technologies you may use in your site. In lecture, we will work through examples using:

1. HTML and CSS for layout and content
2. JavaScript for client-side scripting
3. JQuery as a JavaScript toolkit for AJAX and widgets
4. PHP for server-side serving
5. MySQL for database queries
6. JSON for data transfer

Instruction will also be provided for a couple more advanced technologies from two of our sponsors: Adobe Flex and Microsoft Silverlight. Both technologies can do much more than an HTML/JavaScript/PHP web site could and are part of mainstream best practice web programming as well as being highly marketable skills. We recommend going to both the Flex and Silverlight training.

There are many ways to get a web site up for the public. We will support hosting the site on your scripts.mit.edu account using their phpMyAdmin database interface.

Although you are welcome to use any web technologies, staff will not necessarily be able to support them all. All 6.470 staff can answer questions regarding 1-6. Our staff will do its best to support Silverlight and Flex as well.

What can't you do?

• You can't use images, code, or other intellectual property that you don't have permission to use.
• You can't just configure an existing system to satisfy the contest requirements. You can use existing tools or systems as a component of your website, but if you do, substantial programming of your own needs to be involved in your solution. If you're not sure if something satisfies this requirement, please ask us!

3. Milestones

We don't want you to underestimate the difficulty of any step in this competition. To help you avoid procrastination, we have set three mandatory milestones. In each, you will meet with a member of the course staff to demonstrate that your site can competently fulfill certain goals. If you have scheduling conflicts with any of the milestones please let the staff know at least 3 days ahead of time.

You are not necessarily committed to any of the decisions you make while completing the milestones -- for example your main site idea, database schema, API usage, or user interface. However, if you decide to make changes after a milestone, your final site needs to fulfill the milestone requirements.

Milestone 1. Sunday, January 10th 12-6pm
Pitch the idea for your site and have your database ready.

Show the staff that you have a live database populated with the data that you will be using. The staff should be able to see your tables and make SQL queries on your database. Your database must have at least 1000 rows of data, and you must be able to execute a query that demonstrates this.

You will have to have the idea for your site already (because your database design will have to support your idea). The staff will keep your idea secret from other teams. It would be beneficial (though not required) for the staff to see preliminary sketches of what your site will look like.

Milestone 2. Sunday, January 17th, 12-6pm
Generate one page dynamically.

Show us that you can generate a page from data in your database. The more this page looks like your finished product the better. If you want to integrate data from an API you may do this, but you must use data from your database.

Milestone 3. Friday, January 22rd, 12-6pm
Demonstrate a dynamic data visualization of data OR dynamic use of a 3rd party data source.

For a dynamic data visualization: The staff should be able to modify parameters and display a new visualization. This interaction should be done through the site (ie, no changing SQL parameters or a config file on the backend).

For a 3rd party data source: Show the staff a successful query to the API that retrieves a set of records. The staff should be should be able to modify this query to retrieve different records. If your queries take more than a second to execute or if the site you are using is "flaky", be prepared to discuss how your site will be resilient to these problems.

Your site should be nearing completion by this milestone.

Final Submission. Wednesday, January 27th, 7pm.

This is when your site is due. There will be no check-in with the staff for this deadline. No late submissions will be accepted. More specific instructions about how to submit your site will be available later in January.

4. Evaluation

4.1 Course completion

To pass the class and thus receive the 6 units and 6 EDPs, you must demonstrate a functioning site open to the public that fulfills the requirements, even if it is in a straightforward manner. Your site will be tested for functionality in Firefox 3 with the latest version of Flash and Silverlight installed.

Attendance at lecture is strongly recommended if you are not an experienced web programmer. In lab hours, staff will give priority to students who have been to lecture. However, lecture attendance will not affect your grade for the class.

4.2 Competition criteria

Sites will be judged by four criteria:

• Usability: how well it is designed for users;
• Functionality: does it achieve its stated goals;
• Originality: does the site do something interesting and new;
• Aesthetics: how attractive is its look and feel.

More details about each category are below.
Judges will weight the four criteria roughly equally when assigning an overall score to a site.

Usability

Factors to consider in judging usability:

• Ease of learning: can a user encountering this web site for the first time easily discover what the web site does and how to make it work? Is its design consistent, both internally (among different web pages of the site) and externally (with other web sites)? Common failures of learnability include: buttons that aren't recognizable as buttons; navigation controls that appear in different places on different pages; menus that are hard to find; using technical jargon instead of common words.
• Visibility: is important information and system state readily visible on the site? Failures of visibility include: not showing when the user is logged in; not displaying the number of results of a search; omitting crucial fields from a search
• Error handling: is it hard to make errors and easy to recover from them? Failures of error handling include: not supporting Back or Undo; not allowing user to edit data they entered; inscrutable error messages.
• Efficiency: is the site efficient to operate? This generally does not refer to response time, but to speed of user input. Failures of efficiency include: tiny buttons that are hard to hit; use of cascading menus that create "steering tasks", which are much slower than pointing tasks.

Functionality

Factors to consider in judging functionality:

• Broken links or buttons: important features that are not implemented or that generate error messages.
• Wrong answers: if a search produces the wrong results, or sorting doesn't sort right, or posting a message to a database doesn't seem to store it.
• Missing features: functions that seem essential to the site that weren't included in the design at all. For example, if a comparison-shopping site doesn't offer any way to sort by price, that's a pretty serious deficiency in functionality.

Originality

Factors to consider in judging originality:

• Novelty to 6.470: is the idea of this site rare or unique among the 6.470 contestants? Or is it yet another site that does X?
• Novelty in the Web: is the idea of this site rare or unique on the Web at large?
• Interest: is it a cool idea? Would you or people you know want to use it? Is the problem it is addressing important?

Aesthetics

Aesthetics largely concerns the graphic design of the site:

• Simplicity: does the site have a minimalist design that nevertheless packs a lot of information or functionality? Common failures of simplicity include dense, cluttered layouts with unnecessary information; unnecessary labels on data fields that would otherwise label themselves (e.g. "Date: January 30"); using too many colors, fonts, or alignment positions.
• Color design: does the site have an attractive color scheme, or does it clash? Does it use only a small number of colors, and exploit color to draw attention where needed?
• Balance, symmetry, and whitespace: are the pages unbalanced, heavy with ink on one side but not the other? Is the content lost in a sea of whitespace, or is there an appropriate relationship between figure and ground?

4.3 Judging Process

Students will submit the URLs for their web sites by 7 pm, Wednesday, January 27th.

6.470 staff will review all the submissions and filter out sites which will not be competitive. The result of this first round of review will be a list of semifinalists. The list will be made available before midnight on Thursday night.

In the morning on Thursday, January 28th, semifinalist teams will make short presentations about their websites to the judges, and judges will ask questions. Semifinalists must sign up for presentation slots on the 6.470 web site.

Thursday evening will be the final awards show. The finalist websites selected by the judges will be demonstrated, and prizes will be awarded.

5. Changes to this document since Jan 5th

• Changed the milestone 2 date from January 15th to January 17th (landa)

Comments and questions to 6.470-staff@mit.edu