Day 25

For Next Time

Project narrative

You have been developing the story of your final project all along (i.e. through the proposal, architecture reviews, README exercise). Today is about refining that narrative and planning/generating media content to help you tell it.

In addition to your code, documentation, and README, there are three main deliverables that tell the story of your project:

Website

Today, we’re going to go through a set of activities to help you create your website MVP. Before starting, refresh your memory on the main purpose of the final project website.

Beyond helping you plan your website, these activities will also help focus your work on the project by reminding you of what is most important about what your team is doing.

Due dates:

Poster

The final session for this course (Wednesday, December 11 at 12:00pm) will be an open house where the broader community is invited to celebrate your work. Each team will be given a place by a whiteboard to hang a project poster, plus a table to set up a demo. The poster should serve as description and advertisement of your work, so visitors can aquaint themselves with what you’ve done while you’re busy talking to someone else.

We’ll take care of printing the posters for you. All you need to do is write a title and explanatory paragraph (as you practiced in Reading Journal 21) and create a compelling representative image.

Due date: Content submitted via Canvas by Friday, Dec 6 at 5:00pm

Demo Video

Each team will create a ~2 minute video presentation introducing your final project to an external audience. We will start off the final session by watching these demo videos, and you should also embed your video in your project website. Your video will explain your goal (what the project is all about) and show your work in action. It might also introduce the problem domain to help explain why your project is interesting or explain some crucial implementation details, but remember that 2 minutes is pretty short.

There are two main routes you can take to create this presentation:

There are recipes to help you accomplish this technically on the resources page, but for either path your first step is the same: Create a script and storyboard for your presentation and show it to course staff. Your storyboard will likely draw upon the website MVP you create today. Once this outline is finished, you should start generating content for the video/animation.

Due dates:

Creating your Website MVP

While you may not yet have all of the content to populate your site (e.g., you may still be working on your results), you should be able to map out the main structure of your website, fill out some of the content, and include placeholders for content that you still need to generate.

Make an outline

The guidelines in the final project assignment provide a great starting point for the content of your site. They do not, however, mandate its exact structure and content. Using the ideas on the assignment page as a jumping off point, make an outline of the content you’d like on your site. You should interpret the word content broadly (e.g., content can encompass images, videos, sounds, etc.). If you plan on using multiple pages, make an outline of each page.

At a whiteboard, create an outline for your team’s website. Make sure to document your work (e.g., by taking a picture) as it will likely come in handy later.

Design your media

Part of what you wrote in your outline likely involves some sort of media content (e.g., video, audio, images). Choose one or two key media and sketch out their basic elements (e.g., using a rough sketch or a storyboard). Again, document your work in some electronic format.

If you’re ready to generate images or animations from your actual project code, we’ve written some screen capture instructions to get you started.

Put together a skeleton

Now that you have some idea of your content, you should a) get some feedback from the instructors, and b) put an alpha version of your site up on the web. The intent of the website MVP is to get a draft up quickly to capture your story and receive feedback. There will be time for refining your layout later.

We will walk through the steps for creating a GitHub Pages website using Markdown together in class. In order to put together a simple page like this, you should follow the Github tutorial on Github Pages. We are creating a “Project” site, starting from scratch, in the /docs directory in the master branch1. Your project website can be all on a single page, but you can add multiple pages to a Github Pages site relatively simply.

If you are interested in drawing inspiration from past projects, check out our catalog of SoftDes Final Projects (bearing in mind that some of them had different assignment prompts than you do).

Here are some guidelines to consider when creating your MVP.

  1. If you are comfortable working with branches, you can also follow this nice tutorial for getting started with Github Pages and Jekyll, which uses a separate gh_pages branch to hold the website content instead of a /docs folder. ↩