Since 2012, I have been hard at work earning my MS in the Human Centered Design and Engineering (HCDE) program at the University of Washington. In that time, I have gotten many opportunities to do real research for real clients, such as Microsoft, Cheezburger, and the City of Sammamish. I have done everything from intensive contextual inquiries to comprehensive usability tests. I have studied various topics like the Theoretical Foundations of HCDE, Experimental Methods, and Empirical Traditions in HCDE to help me prepare for any situation.
Professionally, I have done a fair share of user research as well, helping clients better understand their customers by, for example, creating personas. I believe in a mixed methods approach, and that applies to my background as well. My BA is in mass communication, education and experience which I draw from any time I need to interview users or find research material for a literature review. It also helps whenever a client is looking for succinct written content.
For over a decade now I have been a designer. I still remember being a kid, tweaking the Windows XP GUI to make it more user-friendly and designing basic websites where I could talk about how much I love video games and giant robots. To be honest, I haven't really changed - I still really want to talk about giant robots. But I have gone on to develop corporate and personal webpages, designed logos, and even helped put together an iOS app or two.
My studies at the University of Washington have been critical in helping me develop visual skills. I have taken classes on Information Design and Visualization, Interaction Design, and Visual Media to get a better understanding of how to design. I am always mindful of users as well, which is why I also took classes like User-Centered Design and User-Centered Web Design. All of that has given me a lot of experience putting together prototypes and designs for the usual, like an app that helps people shop, and the unusual, like a motion-controlled kiosk for buying movie tickets.
I am someone who cares a lot about his entertainment and the idea of "turn your brain off" media bums me out. Art is made by passionate people and it should inspire a similar passion in anyone who consumes it. I started a blog, Mildly Pleased, as a place to write about the movies and TV shows I watch, the music I obsess over, the video games that suck away my free time, and anything else that strikes my fancy. That is also the home of the podcast I host, Top 10 Thursdays, in which a panel of experts and myself construct a top 10 list of something culturally-relevant every week.
There was a time when I thought I might be a filmmaker. I have been making movies since I was a kid, and I genuinely believe having the ability to put a video together competently is critical in the modern world. That is why I ran Linfield College's video club, Wildcat Productions, for three years and why I am still involved in independent film production today. I am someone who is comfortable on either side of the camera, as well as sitting at an editing bay.
Here's a downloadable version of my resume for your reference.
Especially in recent years, the cinema has become defined by cutting-edge technology. You might have a big TV and surround sound at home, but the theater has digital 3D IMAX screens and sound systems powerful enough to knock a jet out of the sky. However, there is one aspect of moviegoing that has not really changed: the ticket purchasing process. Despite the introduction of ticket-buying apps, websites, and kiosks, our user research revealed most people still buy tickets from the box office, which is the reason for long lines and why going to the movies can be a source of anxiety. There has to be a better way.
For a detailed look at the Bixcreen design process, please check out the process blog. We reached out to moviegoers by conducting informal interviews and a contextual inquiry, as well as sending out surveys to users of a prominent moviegoing app. Using that data, we established the aspects of the ticket-buying process with the most room for improvement. People generally consider exisiting ticketing kiosks unreliable, buy from the box office out of habit more than anything else, and wanted something that reinforced the idea that going to the movies was a special event.
Using that as a base, we ideated on potential designs for a new, modern kiosk. We tested those designs with users at several stages; first we had them do a cognitive walkthrough of early wireframes. Later, we created an interactive prototype that ran on an iPad and had users test it in the field. Finally, we designed a prototype that ran off a laptop plugged into a big screen TV and a Kinect sensor.
Our final design was a new kind of kiosk driven by gestures and poses. It allows users to quickly browse through movies playing at the theater, select showtimes, and buy tickets. It also allows users to customize their tickets, giving them a nice souvenir of the experience. For our efforts, we won the People's Choice: Best in Show award at the HCDE Capstone showcase. We believe this interaction model not only would be great for movie theaters, but other public kiosks as well.
Bixcreen was the capstone project for me and three other HCDE Master's students, as well as one Bachelor's student. Everybody participated in each part of the process, although we did focus on our individual strengths. I served as one of the co-leads during the initial planning and user research stages, and was heavily involved in managing the project, gathering user data, creating personas, and establishing design requirements.
As we moved into the design stage, we all helped brainstorm and draw up the intial task flow. With increases in fidelity, I became the de facto interaction designer, working with our interface designer to put together the interactive prototypes. It was up to me to create the first prototype that users could interact with, which I built to run on an iPad. I also created the test protocol for the prototype so that our usability test moderators would know how to guide the subjects.
I was also extremely involved in the documentation aspect of the project. Almost every word on the process blog was written by me, and the blog itself was designed by me, including the logo. I was also in charge of putting together the videos which show the prototypes in action.
In an interaction design class, we were tasked with creating a video sketch - a sort of live action storyboard that illustrates a design proposal. In this case, we were told to come up with a design for a smart product that is in some way related to health. We were also told to ignore any technical limitations, except that the product had to seem feasible in roughly the next decade.
My group of four began with a lengthy brainstorming session, where we discussed every possible health idea we could come up with. Eventually we decided we all had some interest in design for people with partial or complete deafness. With that in mind, we each storyboarded as many scenarios as we could think of, a total of 50 different sketches between the group.
We brought those storyboard to class, where we let our classmates and professors critique them. Using their feedback, we picked 10 sketches to further refine. We used those 10 storyboards in a speed dating session with several inidividuals with partial hearing loss. Each participant was shown a storyboard and asked what they thought about it, if they could relate to the problem illustrated, and how they felt about our proposed solutions.
The speed dating sessions helped us identify the key design requirements for our smart hearing device. Once we had those, we were ready to produce our video sketch. So we wrote a script, scouted locations, shot the photos we needed, and edited the video. The final deliverable is embedded above.
I was heavily involved in every part of this process. I participated in every brainstorming session, drew storyboards, used Illustrator to create several of the refined storyboards, and conducted one of the speed dating sessions. Since I had experience as a filmmaker, I took the lead of the production part of the video sketch, writing most of the script, directing the shoot and voice over recording sessions, and editing the entire video by myself.
In an interaction design class, we were tasked with creating an interactive Axure prototype of a desktop website that is personalized to its users. The website had to in some way be related to health and clearly demonstate the benefits of personalization.
My group of four began by doing brick-and-mortar observation of drug stores and grocery stores, as well as competitive analysis of health-related websites. We learned a lot about the current state of shopping for health products, and narrowed in on a problem statement: People who are interested in altering their diet need an easy way to find healthy and balanced alternatives to their favorite meals while improving their overall nutrition. Using our research, we created a persona of our primary user.
Using our persona, we decided to focus on the idea of changing her diet. One of the hardest parts of a big dietary change, like becoming a vegetarian, is giving up favorite dishes. We decided our website would help in this process by letting users create their own taste profiles. They could select their dietary goals and rate their favorite and most hated meals, and our website, dubbed Food Flipper, would recommend menus for them. So we created a task flow to demonstrate that process.
With the task flow ready, we moved into Axure and built out all the pages in our process. The final prototype lets users sign up, select their dietary goals, begin their taste profile, create a menu, and export that menu as either a shopping list or a direct order to the nearest grocery store. You can access the prototype here.
This was a team effort all the way through. We each went to different stores for our observation and spent a long time debating what direction to take our prototype in, as well as how to design it. In the tight timeframe of a class, we had to debate choices, like whether to use a star rating system or just a simple binary thumbs up/down rating, for hours instead of being able to test that with users. Still, this was a great chance for me to work as a part of a design team, and to get more experience creating pages in Axure. I helped on the whole site, but the shopping list and grocery purchasing pages were particularly my responsibility.
In an interaction design class, we were tasked with creating an interactive paper prototype of a mobile application. We were asked to create a prototype which users could use navigate information and complete tasks. We were told our key stakeholder group would be hospital clinic staff (such as medical assistants, RNs, LVNs, or front desk staff).
As usual, we began with user research. Since this was a short project for a design class, we did not have much time for actual research, and much of what we had to go on was online research into clinic staff demographics, duties, and anything else we could find online. We did manage to arrange two interviews with nurses, where we had to chance to clarify some of the issues we found online and get real insight into their wants and needs. We created a primary persona based on all our research, and since we interviewed nurses, we decided to make here a registered nurse.
Using our persona, we were able to come up with a problem statement: Registered Nurses who spend their day moving from room to room need a way to manage their schedule, patient information, and supplies because documenting timeframes and tracking vitals and treatments is critical to providing responsible care. That gave us enough information to start sketching the screens of our app, which we each did. Then we got together and compared our sketches, finding what worked with each of them, and putting all that together into one task flow.
With the task flow ready, we moved into POP, a paper sketching tool that let us program interaction in and present the prototype in the correct form factor. The final paper prototype is available here.
I conducted one of the two interviews by myself, although I was using a page of questions on which the whole team collaborated. Aside from that, I worked with the rest of the team every step of the way, and acted as one of the co-leads of the sketching process, helping to hone our look and feel.
This is my portfolio from the visual communication class in the HCDE departement at the University of Washington. In this class, I reviewed the principles of visual communication and design used in HCDE so that I gained a systematic and critical understanding of how to create print and interactive media. During the course I developed that understanding through hands-on exercises, design critiques, discussions, lectures, and readings in a studio environment.
Download PPTThe majority of the Masters-level class HCDE 537 User-Centered Web Design is spent working with a team to redesign a website for an organization. My team decided to work on the official homepage of the City of Sammamish. That gave us just a few weeks to follow a user-centered design approach as we identifed problems with the current site and created solutions.
It was fairly obvious that the existing Sammamish website was outdated just by looking at it, and talking with our contacts at city hall supported our initial assessment. They told us they wanted the website to feel more modern and especially wanted to help engage with the community. Their vision was of a user-friendly website that acted as a hub for the people Sammamish to get involved in the community.
To figure out how to do that, we did a competitive analysis of other city websites and started reaching out to potential users. We were able to post a survey on the website and the Sammamish Facebook page, and we also went out to city council meetings to talk to the people there. We found out that most of the users are just people who live in Sammamish who want to get involved in their city. They told us the biggest problems with the website were that it was hard to find the information they were looking for and that it looked boring and generic instead of celebrating Sammamish's uniqueness.
We were also given access to the analytics of the current webpage, which was extremely helpful in further understanding the website's audience. We found that the website had a consistent amount of traffic, with big spikes around certain events. The most common search queries that led people to the site were event names too, so we knew current events had to be prominently displayed. Using the analytics, along with the wishes of our stakeholders and the data from our survey and interviews, we created three personas and started on the design process.
We knew that information architecture (IA) was the most important issue to address in our redesign, so that is where we started. We began by bringing users in for a closed card sort, in which they sorted various page titles into five categories: City Services, Doing Business, Government, Residents, and Visitors. Users immediately expressed concern about the sheer number of different pages contained in the site, some of which they said they did not even understand by title alone. We followed our closed card sort with an open one, letting users sort the same pages any way they wanted. We took the groupings and categories those users created, combined that data with the data from the closed sort, and put together a new IA for the whole site.
We finally had enough information to start designing the webpage. Everyone on the team sketched their vision of the website based on the data we had. Those gave us enough of a direction to work out the main structure of the site, which we further refined by creating wireframes. We turned those wireframes into an Axure prototype, which allowed us to write up a basic task list and bring users in for a usability test. This gave us a chance to see how successful our new IA was for unbiased users, as well as assess the functionality we had designed into the pages.
After testing the Axure prototype, we finally moved on to the visual design, as we coded a working HTML prototype of the website. We built a responsive website that lets users explore the homepage as well as several pages within the parks and recreation section. This was a template to show our intentions for the full redesign, and was the final deliverable we showed to the city. You can access the protosite here, or check out an alternate version.
Like many of the HCDE classes at UW, this whole project was an opportunity for me to get to work with other professionals on user-centered research and design. We all worked together on writing up competitive analyises, the survey and interview questions, analyzing analytics, creating personas, creating the new IA, as well as sketching, wireframing, and prototyping the redesign. I was in charge of developing the final visual prototype, which I built with using Twitter Bootstrap as a base. The rest of the team could would communicate their design ideas with me using Photoshop or other graphic tools, and I would hand code in everything else. In the end, we had a prototype we were all proud to show our contacts at the City of Sammamish.
The first class I took at the UW was Information Design, a course that examined the principles and procedures underlying the creation of print and electronic information design. Over that quarter, my fellow students and I worked in a studio environment learning the principles of good information design. Early on, we were tasked with picking one topic that was rich with data. We had to gather all that data and present it as an inforgraphic - a large, printable poster that tells a story using mostly charts, graphs, and numbers.
Picking a topic was easy; I wanted to do something with video games and since the class ran from January-March, I knew I had the opportunity to work with both game of the year lists and Q4 sales data while it was still fresh. So I started coming up with questions that I hoped data could answer: What was the relationship between sales and review scores? How did new IPs compare to long-standing franchises? How does the video game industry compare to other media, such as the film, music, and television industries?
It quickly became apparent that a lot of the data I wanted was hard to get my hands on. Publishers tend not to share their game's budget or marketing information, and I eventually determined that really the only data I had to work with was average review score and number of units sold. So I made my first chart.
There it was, sticking out like a sore thumb: Call of Duty. It was far from the best-reviewed game of 2011 but sold more than twice as many units as any other game on my list. Why is that? I decided my infographic would try to answer that question, so I designed it to tell that story. I charted out where and when games sold, who made the most popular games, and just how big the Call of Duty franchise has gotten.
Once I had my data, it was time to find a way to present everything. I opted to go with a clean, simple look, while still trying to make the infographic feel like video games. The final infographic is the one posted above, you can click on it to view an even larger version.
This was a graphic design project that I worked on by myself. I gathered all the data, chose how to present it, and executed on that plan. However, I would not have been able to do it all without helpful feedback from the professor and classmates during studio critique sessions.