This document describes the development of a Django-based web application called Courseapp to support studio-based design courses. It was created in 2 weeks to address needs like individual/group assignments, grading criteria, and multimedia embedding for a 160 student HCI course. Django provided a clean object-relational mapper and templating system to build the app rapidly. Lessons learned include prioritizing student wants and making it easy for TAs to provide feedback. Courseapp is now open source and available online.

1. stanford hci group / symbolic systems
Supporting studio-based
design courses with
Django-courseapp
Mike Krieger · 14 November 2008 http://hci.stanford.edu

2. 2

3. Background
 Me
 Stanford HCI & Open source
3

4. Need
 CS147 — Introduction to HCI
 ~160 students
 Weekly assignments (either team or
individual)
 Shared visibility of work after submission
 Multimedia embedding
4

5. Inspiration
5

6. by flickr user spo0ky
6

7. 7

8. 8

9. What was missing?
 Individual vs group assignments
 Studio attendance, within-studio grading &
sharing
 Grading on a variety of assignment-specific
criteria
 Multimedia embedding support
 Open source solution
9

10. How we did it in 2 weeks
 Django!
 Python rapid application development
framework
 Python Imaging Library for some of the
thumbnail code
 Offload the video hosting / sharing to Vimeo
& YouTube
 jQuery for front-end Javascript
10

11. Django Background
 Started in 2005 by a newspaper in Kansas
 Open source
 “The Framework for perfectionists with
deadlines”
 Key features
 Clean Object-relational mapper (your Python
classes become database tables)
 Easy templating system
 Nice, clean URLs
11

12. Object-relational mapping
12

13. Rapid templates & forms
13

14. Clean URL patterns
14

15. The app
 Demo
 Creating assignment
 Using markdown for formatting
 Embedding video from YouTube
 Grading a submission
 Viewing all submissions from a studio
15

16. Lessons Learned
 Planning ahead and doing the dev work over
summer was critical
 Students are opinionated and will have many
“wants”; trick is to prioritize them
 Your interface design does impact quality &
tone of submissions
 Likewise, if you make it easy for Teaching
Assistants to provide feedback, they will
16

17. Next Steps
 Courseapp is available at http://
hci.stanford.edu/research/courseapp/
 Open Source
 SVN repository & trac for bug management
 Will be used in future design classes at
Stanford, and hopefully other schools
 Deploying for a different class (CS294h) this
quarter took only 2 lines of changes
17

18. Thanks!
 Prof. Scott Klemmer for guidance
 Stanford CS dep’t for supporting the work
 Django project for letting us get this done
quickly
 Joel Brandt and Marcello Bastéa-Forte for
previous versions of course software that
were inspirational
18