CS 3041 Portfolio

About Me

My name is John Amaral, and I am currently a sophomore at Worcester Polytechnic Institute. I am a Computer Science and Interactive Media and Game Development (Technical) double major. I enjoy playing games, watching movies, listening to music, and hanging out with my friends. For these projects, some of the areas I specialized in included aesthetic design, JavaScript and HTML coding, and creating unique demo videos. My favorite project is Design for Wellbeing, but the one I am most proud of is Design for Others. My favorite part of the design process is user testing: watching reactions of different people, whether glee or disgust, is such an intriguing and valuable experience.


Good Design

Our very first assignment was to find one example of good design and one example of bad design on WPI's campus. For my good design, I chose to review the key card scanners outside of most of the campus buildings, which have an NFC chip inside that allows only qualified users to enter the buildings. I chose this design because it maintains safety for tenants of apartment buildings or for students on campus. Click here to view the corresponding Medium post.


Bad Design

For our very first assignment, we were tasked with searching WPI's campus for one example of good design and one example of bad design. For my bad design, I chose to look at an electrical outlet in my apartment that was located beneath the heating unit right above the floor. Not only did this prove to be a potential fire hazard, but the electrical outlet is impossible to see unless someone gets down on their knees and looks under the heater, which is why I chose it as a horrible example of design. Click here to view the Medium post I created for this assignment.


Design for Others

The first group assignment we received challenged us to research a website and redesign it for mobile devices within an assigned age group. We were told to recreate the webpage for adults in their 20s, and we chose to re-work the Technocopia website. We used Proto.io to make each page of the mobile site, and we used InVision to make our website interactive. Click here for more details on the design process of our mobile application.


Design for Understanding

Our goal for this assignment was to create displays for a data set in two different ways: persuasive communication and clear communication. I specifically worked on the persuasive communication portion with my partner, and the data set we chose was about drug abuse. We focused on aesthetic design first and foremost to create an impact on the viewer. We also highlighted specific data, such as drug abuse among 12-year-olds, because the data was so surprising that it would definitely leave an impact on those who viewed the graphs. Click here to view the associated Medium post that describes the design process we went through for both sets of displays.


Design for Tension

The objective for this assignment was to design an interactive chatbot that discussed a controversial or tense topic with the user. Our group decided to create a chatbot that discussed financial purchases with the user, as managing money can be an extremely difficult thing to do. The chatbot was desgined using the program Flow XO, and it told the user whether to buy the product for themselves or for someone else based on budget, frequency of use, and overall benefits. Click here to read the Medium post and learn how we went about making our chatbot.


Design for Wellbeing

This assignment challenged our team to use the Affectiva JavaScript library to promote well-being among users. The Affectiva library utilizes the webcam on a computer to read in the emotions of users based on attributes such as how high eyebrows are raised and how many dimples are present on the user's face. Our group decided to incorporate a Tim Allen-themed Flappy Bird clone into our website, and based on the emotion read in by the camera, different text would show up and the background color would change. Click here to take a look at our Medium post that goes over the design process for this project.


Design for Another Word

This final group assignment was a fun one: we were tasked with creating a virtual reality experience that transported players to another world. We used the AFrame HTML library to build our virtual world. Our group decided to make a carnival game where you have to pick the correct duck out of a group of ducks floating in a pool. Click here to view the Medium post we created for this assignment that goes more into detail about the steps we took to complete the project.


Design Manifesto

The Design Manifesto was a culmination of all the material we learned in the class. It was not a summary of the projects we completed, but rather it was a reflection on the knowledge we gained by going through the design process multiple times. If you want to learn some important things about the design process and what you can gain from taking the time to go through it, click here.