CD Studio: JavaScript (PSAM3210)

Final Project

More and more, devices around us are clawing for our attention. Content creators around us are capitalizing on our attention, assigning a dollar value to our time. As designers, we must be mindful of how our designs can encourage, discourage, or run parallel to the established conventions of technology and the internet.

Laurel Schwulst writes, in My website is a shifting house next to a river of knowledge of the many shapes a website can take.

Design and develop a piece of software that lets you use the internet mindfully. In your project proposal, succinctly (in 200 words or less) describe the problem you are trying to solve, and your solution for it.

You may choose to complete this assignment individually or with a partner.

Following your proposal, you will explore 3 different directions for your design and then implement a singular refined direction of your software in code.

Your final project submission should be a link to the website and your project repository.

Part 1: Proposal

Either alone or with a partner, write a proposal (200 words or less) outlining a piece of software which lets you use the internet mindfully. Your proposal should include background context and the problem at hand, as well as what your software will do and how it will address (conceptually, practically, etc) the problem you outlined. As you develop your proposal, consider how the project will incorporate design and interactivity.

This will be due as a Google Doc, shared with me by the beginning of class on October 27 over Slack. This Google Doc will serve as a home base for your project, and will link to your Figma sketches, prototype, user research, and website.

Due October 27

Part 2: Sketches

Sketch on three different directions for your software. These should not only be visually distinct, but behaviorally distinct. Consider a “user journey” through your software, and design screens for each of the steps of these journeys. Think about how a user might be introduced to your software and what design affordances you will provide (or not). We will review your three directions in class.

Your submission should include 3 different sketches, with at least 4 different screens per sketch (a total of 12 artboards minimum). You should work in Figma, and link to your design file within your project Google Doc.

Due November 17

Part 2.1: User Testing

Based on feedback from class, refine one direction to turn into a usable prototype in Figma. Then, create a usability test plan. You should have separate documents for each usability test you conduct, focusing on whether your interfaces make sense and any roadblocks your users may come across. You should do two usability tests.

Submit a link to your prototype Figma and to your notes from your user tests to your project Google Doc.

Due December 1

Part 3: Code

Time to build your software! Using either HTML/CSS/JS, or a more robust library like Vue, turn your designs into code. You should create a project repository to keep track of your code on GitHub and, if working with a partner, both have commits in your repository. Your final project should be hosted as a website on GitHub pages or somewhere else.

You should begin this in parallel to Part 2.1. Submit a link to your GitHub repository and to your website URL in your project Google Doc.

Due December 15

Final presentation

Presenting your work is part of any design process. Put together a 10 minute presentation (you can use a deck if you want) which begins with the background of your project, includes your design sketches and user research, and finishes in a walk through of your live site.

In class, December 15