Course Project

This project is your opportunity to design and implement a fun, interesting project in Elm. Your project should employ aspects of web programming and data structures in some way, but there are few hard constraints. You will brainstorm project ideas in the first several weeks of the quarter, and we will give you feedback so that you settle on projects that are of appropriate interest and scale.

You will work in groups of either one or two students. Groups of two will be expected to propose and implement projects that befit the effort of two people rather than one.

If you wish, you may choose to develop parts of your application directly in HTML and JavaScript. See the Interop section of the Elm Guide for information on how to integrate Elm with HTML and JavaScript.

To help with brainstorming, here are some suggestions:

Data Structure Animations

  • Animations of figures in the Okasaki textbook
  • Visual demonstrations of advanced data structures, either ones from the textbook or elsewhere


  • Card games (Blackjack, Poker, Uno)
  • Board games (Checkers, Chess, Backgammon)
  • Number puzzles (Sudoku, Colorku, KenKen)
  • Word puzzles (Scrabble, Bananagrams)


  • A simple raster graphics (“Paint”) application
  • A simple vector graphics application
  • A library to parse, transform, and unparse Elm code (Talk to me/Brian if you’re intrigued…)
  • A fancy visual, structural, code editor (Talk to me/Brian if you’re intrigued…)
  • A library that wraps a full-featured JavaScript code editor like Ace (Talk to me/Brian if you’re intrigued…)

Language Infrastructure

In some cases, we may allow projects that involving tweaking the Elm language infrastructure itself (written in Haskell). If you’re interested in this, you should have some concrete ideas of what features you’d like to tinker with, have already poken around in the source to get a sense of how difficult it will be, and also think about some source-level Elm examples that take advantage of the proposed changes.

If you are pondering a project like this, it’s better to talk to us sooner rather than later; have some application-level Elm project ideas in mind, too.

Part 1: Planning (10%)

The first milestone consists of choosing who you will work with, if anyone, and identifying at least two different project proposals. For each proposal, you should write a few paragraphs that describe:

  • the goals of the project;
  • aspects of the project that will build on Elm experience already developed throughout class and programming assignments;
  • aspects of the project that will require additional tools and techniques to implement; and
  • a plan of attack for the project that contains a progression of steps that can be expanded or reduced depending on how your progress goes.

Submit a file called planning.txt (in your USER-cs223-spr-17/project/part1/ directory, as described in Submission Instructions below) that identifies your partner, if any, as well as your project proposals. Each member of a group should submit this file to identify the other as a partner, but only one group member is required to include the project proposals.

We will give you feedback on your proposals in order to help finalize your project plan.

Part 2: Status Update (20%)

The second milestone consists of demonstrating significant progress towards achieving the goals set out in your proposal. You should submit (in your USER-cs223-spr-17/project/part2/ directory) all of the code and documentation you have developed so far, as well as a file called update.txt that contains a page or two describing your progress. This update should speak to the goals and milestones laid out in your project proposal, and should identify any plans to adjust, scale up, or scale down the proposal.

The code you submit for this status update should compile and be portable so that we can build and observe your progress. Your update.txt file should contain any necessary instructions for building and using your code.

Part 3: Demo-Ready (70%)

This is the “camera-ready” milestone. You will submit (in your USER-cs223-spr-17/project/part3/ directory) all of your code and documentation, along with a file called report.txt that contains a page or two summarizing what you accomplished. You may also want to reflect on your experiences using the Elm language and accompanying tools.

We will set up several meeting times for project demos. Hopefully we will have time for everyone that wants to participate.

UPDATE: 5/23

If you would like to share your project in a “showcase” on the course webpage, create and submit an additional directory called project/part3/release/ that contains:

  • A file called index.html that is the entry point to your application.

  • Everything your application needs (but nothing else) should be included in this release/ directory, so that index.html can be run without any additional configuration or fuss.

  • A 200-by-200 pixel thumbnail image of your project called Thumb.EXT, where EXT is a standard image format such as png, jpg, or gif. This thumbnail will be used to help generate a gallery on the forthcoming course project showcase page, where each thumbnail will link to the corresponding project. So, you will want to choose an accurate and compelling preview of your project to entice people to view it.

  • A blank file called show_name.txt if you would like your name to be included in the showcase, or a blank file called hide_name.txt if you would like to remain anonymous. (If neither file is present, we will default to anonymity.)

If you do not want your project to be included on the course webpage, then don’t submit this extra release/ directory.

Submission Instructions

See the general instructions about SVN and PhoenixForge in Homework 0. Navigate to the directory where you have checked out your SVN repo.

% cd USER-cs223-spr-17

Next, create a subfolder for the project and subfolders for each part:

% svn mkdir project
% svn mkdir project/part1
% svn mkdir project/part2
% svn mkdir project/part3

For each milestone, add and commit the files described earlier. Remember that you cannot use late days for any of the project milestones.