Portfolio

Close Project

Mint.com design pattern library

Download

Your manager believes that the creation of a design pattern library (DPL) will go a long way to relieve the conflicts among the design and development team. The creation of a successful DPL will take some time, yet investing in it will improve the intuitiveness of the software by providing a consistent standard as well as the best solution to a given design problem.

Your first step is to identify, categorize, sketch and explain at least 15 interaction design patterns from the mint.com site; this DPL will form the basis for the design pattern library used on the insurance company’s site.

Close Project

Rdio collection design critique

Abstract

In this paper I will be analyzing and critiquing a very small feature of the social music experience of Rdio.com. I specifically chose a very small object because I wanted to challenge my ability in critiquing and creating a compelling argument for why the object has certain implications on multiple   avenues,   most   importantly   identity.   The   first section of this paper will argue why the object in question has soul, and is an aesthetic object. The second part of the paper  will  illustrate  the  implications   that  this  aesthetic object has on the way users perceive themselves and each other. The third part of this paper will create and support the argument that Rdio is not utilizing their technology to create social connections through music, and I will propose two different directions that Rdio could potentially take to accomplish this.

Download pdf

Close Project

Supernormal – The Crayon

You have probably used them countless times; they are a tool of creativity and fun – crayons. Crayons have been manufactured by several different companies for a few hundred years estimated back to the late 1800’s. For the purpose of this assignment the companies responsible for manufacturing are not as important as the function and goals of the crayon.

Material:

Crayons are factory made from large vats of paraffin wax and pigments. Paraffin wax is a wax that is commonly used in industrial settings, mostly because it is very inexpensive to manufacture. This industrial wax is synthesized from petroleum-derived compounds, with a general formula of CnH2n+2. Crayons will start to soften at 105 Fahrenheit and have a melting point of 128-147 Fahrenheit. To provide strength crayons are covered with paper that is twice wrapped. Wrapping the crayons in paper also allows for companies to print brand names, color names, and brand designs. There are 18 different colored papers which shades are similar to the colors of the crayon. The paper is glued around the crayon using cornstarch and water.

Construction:

Paraffin wax is stored in very large heated 17,000 gallon tanks. It is poured into hundreds of molds (in the shape of the crayon of course! See sketch 1) and then cooled to solidify. Each mold makes 1,200 crayons at a time, and it only takes 3 to 9 minutes for the crayon construction. The molds have a shape that allows for fine detailing (sharp tip) and users can also shade with the side of the crayon. Crayons are now entirely machine made, but they used to use hand cranks to release the hardened crayons from the molds. The paper is wrapped around crayons using machines. Crayon paper is glued together with non-toxic cornstarch glue that is very effective and safe for young children.

If you look closely at the blunt end of the crayon, you will notice that it has a slightly concave shape. This is a result of wax slightly sticking to the sides of the molds that the wax is poured into. Because of the mass-production of these crayons, there is hardly a trace of any personal style from the designer. The original inventors were Edward Binney, and Harold Smith but the crayons have evolved so much and been re-designed several times. Because of the iterations there aren’t any hints of a “personal style” from the designer.

Function:

This object is used to create colorful markings whether the objective is to be creative, or just to make generic markings and notes. Because of the nature of the crayon composition (waxy), it has uses that are different from other coloring utensils. For example, you can color paper with a crayon and then paint over it with watercolors. Because of the waxy nature the paint cannot adhere to the paper, and creates creative art. I have also seen crayons used in restaurants to distract children, and keep them quiet. I have heard of artists that melt down crayons to create new and different designs. Crayons are non-toxic, blunt, dull, and will not cause adverse effects if swallowed. Wax can typically be cleaned from hard surfaces with soap and water. Because of these perks, crayons are very commonly used in grade schools and kindergarten classrooms. Crayons are also very inexpensive; several colors in a box equipped with a crayon sharpener will only run a few dollars.

Provenance:

The first crayons made had a similar composition to today’s crayons. Wax can be derived in several ways (beeswax, plants, petroleum, etc.) and mixed with pigments. Egyptians actually used melted beeswax with pigments to bind color onto stone, long before crayons were made. Crayons have gone through several different “iterations” but have essentially remained very simple. There have been other crayon inventions, such as plastic pens that have crayons inside. Generally, crayons have remained very simple for hundreds of years.

Value:

Crayons are mass-produced and factory made, it is unlikely that there is much value placed on this artifact by the producer, other than to make money. There are very few physical details, so the crayon lacks a personal touch. In society, crayons are very accepted and very often used. If you have gone to school or are older than 10 or so, you have probably used a crayon. Crayons are so common in society that the smell of a crayon is the third most recognizable scent after coffee and peanut butter. Because crayons are so cheap, it is not difficult to obtain crayons and stimulate the creative side of the mind in people of all ages. If you have not used crayons in a while, pick up a package and enjoy the nostalgia; the reminders of coloring in school, the smell, and the feel.

Revamp:

If you have ever used crayons enough, you will have probably torn off the paper after it has been worn down to a certain point. After tearing off the paper, you can shade with the side of the crayon or re-sharpen. However, it is always very difficult to neatly tear off a small piece of the paper, so that only a small section is uncovered. Many times the entire paper will fall off, or look messy. In attempts to make this process easier, I have modified the design of the paper crayon wrapper. In sketch 2 you will see that the paper has been perforated several times, creating sections. These sections can be torn off utilizing a tab that is also glued flat to the crayon that can be peeled off when needed. This allows for each crayon to retain a clean image, as well as retain the strength which is provided by the paper. There are also benefits for the manufacturers of the crayon as well as the user.  This modification allows the paper to remain intact, boasting the brand name of the crayon. The cost of this design modification is also minimal and easy to implement; it does not interfere with the actual crayon, it would only require a change to the paper wrapper.

Close Project

MMORPGs with Meaning

Overview:

MMORPGs are a popular game genre that I have been fascinated with for several years. I decided to explore what elements make the gameplay within this genre meaningful, and how to make design decisions that result in meaningful game play.

Process:

I began my work by exploring the problem space by absorbing as much information as possible about the subject. I read blogs, research papers, forums, and the book Synthetic Worlds by Edward Castronova. This information, along with observations of players within these game worlds led to a series of insights on what makes MMORPGs meaningful.

The core problem is that there is a lack of consequences for player actions within MMORPGs. Your actions in many newly released MMORPGs typically only affect your personal experience within the game, and nothing else. As soon as you leave the game sphere, you are forgotten. Without the ability to affect the community and the game environment, there is no social consciousness or awareness, making the gamer’s actions hardly significant in the big picture.

Before I became too fixated on current game structures, I decided to leave the problem space and begin to look at real world interactions that humans view as meaningful. From these real world observations I created unique concepts that game mechanics could be derived from. These mechanics could potentially be implemented into an MMORPG. To explain how each game mechanic works, I created storyboards along with an explanation of what the mechanic is, how it works, and where in the game it is applicable.

Final Design:

I set out to create a library of game mechanics that focus on consequences. Consequences of player actions that affect self, community, and environment. To test out these mechanics in real games would not be feasible, so I interviewed veteran gamers who have spent years within these “synthetic worlds” and have a better understanding of potential outcomes for these new game mechanics. I ended up with a book of game research, insights, concepts, and a huge number of game mechanics.

Downloads:

book
poster

Responsibilities:

Research
Photo Editing
Storyboarding
Sketching
Book design
Poster design
Brainstorming
Mechanics

Tools:

InDesign
Fireworks
Photoshop
Sketching

Close Project

Research – Fridginator 5000

Overview:

Our task was to research users in domestic settings to better understand hoarding activities. Hoarding has the capability to negatively affect many factors in life (cleanliness, finances, relationships, etc.) Our goal was to utilize primary research to create a solution that eliminates or reduces the negative effects of hoarding.

Process:

We began our process by conducting an ethnographic study in the homes of three students. Because we had a large team we were able to divide and conquer the interview and observation processes. We got creative with our research and sketched five flow models to better understand the movement of artifacts within the home. After the ethnography session we created an affinity diagram of the results as well as studied our flow models to develop insights on hoarding. After developing a lengthy list of insights, we needed to narrow our problem space in order to create a solution in the time allotted. We decided to focus on the hoarding of food for the following reasons:

  • Kitchens are often shared spaces
  • Food can be expensive, and should not be wasted
  • Spoiled foods create messes that can be offensive
  • Cluttered kitchens make cleaning, menu-planning, and cooking cumbersome

Armed with our insights and notes, our team began to create concepts of kitchen designs to improve the quality of life of our users. After settling on a concept, we built a prototype and performed extensive usability testing.

Final Design:

Through concept generation the star was born, the Fridginator 5000. This high-tech solution scans food items that enter and leave the fridge and are matched with the expiration date. Foods nearing expiration are displayed on the fridge with menu suggestions utilizing soon to expire ingredients. The user benefits by not having to worry about keeping track of expiration dates and will never run out of menu ideas. Users can buy the ingredients they feel fit their lifestyle and the Fridginator 5000 will manage the rest.

Documents:

Usability test report

Responsibilities:

Interviewer
Photography
Concepts
Prototype

Tools:

Ethnography
Audio Recording
Affinity Diagramming
Flow Model
Sequence Model
Artifact Model
Cultural Model
Physical Model
Contextual Inquiry
Ideation
Physical Prototyping
Usability Testing
Sketching

Team:

Brian Oppenlander
Marie Bautista
Austin Toombs
Kamlesh Jain

Close Project

Storyboarding – Study Buddy

Overview:

Our task was to create a storyboard of an application that assists elementary students with learning. We live in a digital age where students may utilize a tablet to study and do homework. Through our design process, our core became empowering students to develop soft skills by overcoming challenges on their own.

Process:

We began with secondary research to understand how students learn, and what kinds of learning skills are important for our target demographic. We discovered that soft skills, i.e. problem solving, motivation, time management, critical thinking, are very vital for development, and are often developed at an early age. This important insight led us to focus on soft skill development while helping the students with homework. We found that parental involvement greatly improved grades, test scores, graduation rates, motivation, and self-esteem. However, too much parental involvement may cause interference, potentially stunting soft skill development. Using these insights we wanted to create a tool that didn’t distract the student, and could provide parents with an accurate picture of problem areas without the parents having to interfere with their child’s work.

Final Design:

Study Buddy is intended to serve as a tool primarily for parents to monitor, track, and learn throughout their child’s education. Study Buddy quietly monitors the student as the student works on their homework. Reports on the child’s progress are sent to the parents, identifying success and problem areas, allowing the parents to identify areas where their child needs extra help. Study Buddy also senses emotional outbursts and the corresponding homework problems and attention duration. Additionally, it supplies parents with tips to facilitate their child’s development of soft skills.

Responsibilities:

Research
Photo Editing
Storyboarding

Tools:

InDesign
Fireworks
Photoshop

Team:

Brian Oppenlander
Kai Wang

Downloads:

Poster

Close Project

App design Checked-In

Overview:

Establishing connections in small teams can be a challenging task. We believe that using Checked-In will help facilitate interactions between team members and enhance the way teams interact with one another. Furthermore, our research indicates that Checked-in will be an efficient way to get people ready to engage in collaborative meetings.

Process:

Our group began the design process by working through an affinity diagram on connecting diverse groups of people. A mind map was created of the problem space that emerged. After examining the mind map, we narrowed the problem space to collaboration in a corporate environment.

As we began to explore this problem space, we communicated our ideas via sketches and transitioned between many different phases of expansion and contraction. Expansion and contraction helped to develop our target user population that consisted of small groups (10 or less) working at a distance on a collaborative projects. In our review of secondary research, we relied on the extensive literature in the field of computer-supported cooperative work (CSCW). The strategic use of personas, an ethnographic study and an in-depth questionnaire helped to further define our target user group.

The insights we gained from our research were then used to build our prototype in flash. Throughout our iterations we conducted usability testing in situ and a heuristic evaluation to improve the prototype.

Final Design

Checked-In is a lightweight application that encourages small talk between co-workers. Our application encourages team members to share aspects about themselves with co-workers, similar to “water cooler” conversation. Over time, the connections between coworkers become visibly different, allowing users to identify co-workers they have the most in common with. Checked-In is designed for light use before meetings.

Downloads:

CHI paper

Responsibilities:

Personas
Research
Usability Testing
Sketching
Wireframes
Concepts

Tools:

InDesign
Fireworks
Photoshop
Flash
Powerpoint

Team:

Brian Oppenlander
Beth Kyle
Alex Sulgrove
Brendon Attebury

Close Project

Amazon mobile re-design

Overview:

The Amazon mobile application is already a successful and well-designed application. Our challenge was to make it better. Our main constraint was that we weren’t allowed to remove any existing functionality.

Process:

We began our process by creating highly detailed personas. We created scenarios for when and how the Amazon application would be used. We left the top portion of the design alone, but we found the review consumption process slightly flawed. Users have to scroll down constantly, temporarily losing control and placement within the reviews.

One of our users desired quick consumption of reviews, wanting to see the pros and cons of the product. Using Amazons technical capabilities, we decided to fetch the most positive and negative elements of the product from all existing reviews.

We created an interactive paper prototype where users could physically slide to the next review. We conducted three usability tests and with the help of a pre-test questionnaire, we assessed the existing knowledge of each subject with the Amazon mobile application, allowing us to better understand our users and evaluate our design and experience.

Final Design:

We decided to alter the way users consume reviews. The product reviews are no longer in lengthy lists, but instead our users can swipe left and right to navigate reviews. Users can choose to quickly read the pros and cons of the product that are derived from online reviews.

Responsibilities:

User Testing
Mindmapping
Personas
Concepts

Tools:

Paper Prototyping
User Testing
Ideation
Sketching
Photoshop

Team:

Brian Oppenlander
Marie Bautista
Peyman Hosseinzadeh
Leo Pak

Close Project

Tibiafrags.com & Tibiatome.com

Overview:

I wanted to create a niche site that focused on the player vs. player combat elements in Tibia (an MMORPG). There was an apparent need to identify the most ruthless player killers on my local server as well as throughout all servers (worldwide).

Final Design:

The tables were populated with data from a perl script that scraped the tibia website for character deaths. To avoid data overload, only players who were above “level 60″ were considered. The “killer” would be awarded a point which would be added to their frag-count and their victims would be added to their list of “frags”.

The highscores table was populated by a cgi script that fetched the data from the SQL tables.

Responsibilities:

Webmaster
MySQL
Code Updates
Guide Author

Tools:

PhPmyadmin
MySQL
Fireworks
Dreamweaver
PERL
CGI

  • Mint.com design pattern library

    Mint.com design pattern library

  • Rdio collection design critique

    Rdio collection design critique

  • Supernormal – The Crayon

    Supernormal – The Crayon

  • MMORPGs with Meaning

    MMORPGs with Meaning

  • Research – Fridginator 5000

    Research – Fridginator 5000

  • Storyboarding – Study Buddy

    Storyboarding – Study Buddy

  • App design Checked-In

    App design Checked-In

  • Amazon mobile re-design

    Amazon mobile re-design

  • Tibiafrags.com & Tibiatome.com

    Tibiafrags.com & Tibiatome.com

About Brian

photo by John Wayne

I love design because it has the power to influence people, emotions, and the world. Good design is driven by change, it moves as we move.

As a U.S.-German dual citizen, I want to be part of the global future of interaction & experience design. I am a recent graduate of Indiana University, where I studied Human-Computer Interaction & Design.

I am concerned about the health of humans and the environment. Sadly, poor health and chronic disease are plaguing our comparatively wealthy nation. I want to be part of the solution by developing programs and methodologies which contribute to improving the health of our nation. I also want to live by example, implementing a healthy life style.

I’m striving to become a worldly individual and to experience life to the fullest. Last year, I spent the summer abroad as a user experience intern at SAP AG in Walldorf, Germany. I believe that traveling and working abroad are experiences that broaden horizons. I believe interacting with other cultures teaches one to understand different mentalities and raises awareness of world issues, resulting in greater tolerance and a more global understanding of humanity.

Travel:

Resume

-->