Projects

Professional

Costco

While working at Costco, I held a temporary position as an intranet developer for the Safety Department. In this position my duty was to redesign the Fiscal Year Safety Training pages to allow for different location types (warehouse, depot, etc.) to have different training calendars, and for each location to show different training tools. My first draft of this was to simply add tabs to the top of the already existing page which linked to other hard-coded pages for the different locations. After discussion with my supervisor and manager though, it became clear that both the calendar and training pages would be in constant flux in the upcoming months, so I decided to rewrite the pages to be constructed based almost entirely on a JavaScript object like this. My goal here was to make the pages simple to edit and organize without requiring any HTML or CSS knowledge, since I was the only person in the department with these skills and was only a temporary employee.

A major hurdle for this project was that the pages had to be compatible with browsers as old as IE7. This meant that I was unable to use a massive amount of JavaScript, and that I had to essentially style the pages twice. I was excited, then, when I discovered that jQuery 1.x is entirely compatible with browsers as old as IE6. I had never used it before, but was confident I could learn the library as I built the pages. In the end, I was very happy with the result.
View the training calendar.
View a sample training page.

After completing these I had some freedom to choose my next project, so I decided to create a UI for putting together the tool documents that the pages are made from. Since this would only be used by Safety Department employees with access to the latest Chrome browser, I was able to use scripts and styles I didn’t have access to for my other work. I chose to use jQuery UI for the page, since it built off of what I had recently learned and seemed to provide the exact functionality I needed. Using the toolbuilder, you could create, edit, and arrange tools on a page, then preview them to make sure everything looks right before exporting the tools document to be uploaded to the server.
View the toolbuilder.

School

In my time at the University of Washington, many of my classes, in the Human Centered Design and Engineering department and otherwise, used projects both to teach concepts and to gauge understanding of them.  Here I have collected some of those projects for you to peruse.

VirtuaSpace

VirtuaSpace was done as my capstone project at UW, sponsored by HTC.  It is a virtual-reality music visualizer for use using a smartphone and Google Cardboard, or another similar mobile VR holder.  For the project, our main goal was to test and demonstrate different interaction methods that could be used in mobile VR, which often presents unique challenges in that area compared to computer-based VR systems.

My primary role in this project was as a developer.  In the early stages I assisted in ideation (often bringing a developer’s point of view to the discussion), but while the rest of the group was performing literature reviews and preparing deliverables, I was researching and preparing the development environment in Unity.  For a full breakdown of the project, check out our process book here or in the title.  If you’d like to download and try the app for yourself, click here.  Please note that you will have to allow 3rd party apps to install on your phone, usually a setting found under ‘security,’ in order to install the app.

Social Stream

Social Stream is a media streaming platform designed to let people enjoy their shows and movies together, no matter the distance between them.  It would make use of people’s existing accounts for services like Netflix, Hulu, or Youtube to provide content and would ensure that the participants’ video would stay in sync while also providing both voice and text chat options.

This was a quarter-spanning project created for my User Experience Design class.  For the project, we performed research, created personas, scenarios, sketches, and storyboards, worked with a paper prototype, and made wireframes and a high-fidelity mockup.  No product was actually being created for the project, so we were encouraged to focus entirely on the design while ignoring any real-world issues that might prevent it from being feasible (such as the nightmare that would be developing a framework that plays nice with multiple competing brands of streaming service).