MooR

At New York University, the Integrated Digital Media program offered a User Experience (UX) Design course which provided the opportunity to work with Microsoft as a client. At the beginning of March 2017, Joshua Walton from the Microsoft HoloLens team challenged us to design a HoloLens application that would allow curators to perform studio visits in MR. The final product was to be a proof of concept for a holographic portfolio that would showcase an artist’s selected works in an immersive way.

This is our digital rendering to show how paintings can be placed and manipulated.

This is another digital rendering to show how one of the more abstract pieces could be represented in MooR. It's an interactive dress with 5 films playing around it.

We developed the Mixed Reality Design Assessment Tool to help guide designers in determining the minimum User Experience complexity required for their project. Taking into consideration all Actor-Network relationships within the Mixed Reality context, we determined that there are four key forces that should be considered when building products for the HoloLens and for MR: Relational Context, System Design, Environment Design, and User Experience Design. This diagram describes how the Relational Context is used to design the System and Environment of the MR project, which in turn influences the UX forces of the experience.

The Relational Context is the first force that is considered in a project. It is essentially the project brief, research question or provocation. This is determined by the Authorship, Experience Level of the use, Delivery of the product, Location and Narrative quality of the experience as described above. These relationships help weigh the project towards whether it is meant for General Purposes or Specific contexts. A project with a very Specific purpose would conceptually require a more directed User Experience. Considering MooR against these polars, it is given an average score of 3.5.

In determining the relationships within the System force, we appropriated from Game Design Theories and methodology. The System force is concerned with the level of structure required in the app, and can be broken down into the Rules, System Feedback, App Mechanics, Invitation to interact, and Interaction modalities within the app. These relationships help determine if the System is more Structured or Amorphous. The more structured the System requirements, the less Interpretive the User Experience can be.

The System and Environment Design are closely related, and are often designed together. The relationships within the Environment Design are determined by Familiarity of the environment, Audio reinforcement, rendering Materials, relationship to the Physical World and Props.

User Experience can be thought of as the voice of the app. It represents the intention of the app and therefore sets the tone for the user as to what they can expect. This is involves the Interface, Interaction cues, how much Information is exposed to the user, Simulation type and the embodiedness of the App Guide. These relationships described are not an exhaustive list of UX techniques but are based on a few project examples that have been tested on the Hololens, as well as Mobile, Augmented and Virtual Reality Systems.

If we average the elemental values in the Relational Context, Environment, and System Forces, then we can establish that the elements in our User Experience Force need to average greater than 3.6.

While developing MooR, it was determined quickly that there are two key relationships at play within the system design for the HoloLens and for MR: what the environment can do and what the user can do. This was visualized in an Experience Matrix of Interactivity vs Freedom (see below). The top left quadrant provides the most freedom and immersiveness by allowing the user to freely explore a given space and interact with objects at any time. An example would be a room with flower vases which a user can toss and break at will. The top right quadrant also offers interactive elements, but the user can only interact with them when they are prompted, constraining them to that narrative, such as an interactive VR story. The bottom right quadrant is the most restrictive: the user is not allowed to interact with anything and participates in a guided experience. A 360 film is a good example of this. Finally, the bottom left quadrant allows the user to freely explore a space, but the space itself is not interactive. An example would be a virtual environment, like a beach or jungle.

Little Einstein

One of our first projects in our UX class was to create a website for an e-commerce store that sold S.T.E.A.M. toys to children age 4-15. The website was to be called Little Einsteins after the owner's retail store, which had been closed down. Alberta was the owner and she wanted the website to provide the same atmosphere and amenities that her brick and mortar store did in its existence, specifically a way for her to communicate with the customers, a method to promote a sense of community, and the ability for children to try some of the toys prior to purchase. This is the website my team and I created.

Custom Settlers of Catan

This project was developed so that I would better understand Adobe Illustrator. To do that, I decided to create a stylized board for the board game Settlers of Catan, which would prevent confusion during gameplay.

The board consists of 30 numbered tokens and engraved hexagons which are arranged randomly. In the retail version, new players would often get confused by what the images on the hexagons represent. I have created my own design to eliminate this confusion.

These images follow some of my process for creating this custom board for the Settlers of Catan game.

This is test run with some scrap 1/8” acrylic plastic. This was to determine if the material was appropriate for this project.

After much trial and error I settled on an opaque, colorless, 1/8” acrylic plastic to build my board.

I originally wanted to use 1/16” acrylic, but it would warp from the heat of the laser.

The font on the numbered tokens was chosen so they can be easily read regardless of thier orientation.

The dots beneath the numbers represent the probability of that number being rolled with two 6-sided dice. The more dots, the greater the probability.

The designs on these hexagonal pieces represent the 5 different resources acquired in the game.

Top Left: Ore Top Right: Wheat

Bottom Left: Brick Bottom Middle: Sheep Bottom Right: Wood

When the acrylic sheet is bought, it comes with a thin sheet of paper on the front and back. I left the paper on when etching so that it would act as a stencil when painting. This way, I can be messy with my paint job then remove the paper to reveal clean lines.

The entire board painted and put together.

Here you can see the cleanliness of the design and paint job after removing the paper from the surface.

All of the paper is now removed on the whole board to show clear designs.

My new Settlers of Catan being played and enjoyed without any confusion.

Themed Boxes

At the end of every Spring semester, the Integrated Digital Media (IDM) department has a student showcase for graduates and undergraduates. The showcase draws hundreds of visitors, receives some press, and allows the students to be seen by people from industry.

There is a theme to each showcase, and the 2018 year’s theme was “Vision". The student’s work was then divided into 3 categories: Reality, Perception, and Illusion. As part of the exhibition design, illuminated boxes were hung in the areas representing their theme.

The first prototype in small form. Before large orders of materials were made we created a proof-of-concept mock-up.

Diagram illustrating how the boxes will be assembled and hung from the ceiling rafters.

Inside the boxes are a string of LED lights. To diffuse the light throughout the box, we inserted some mesh fabric.

The lights were controlled through a pre-programmed Adafruit chip. The chip was then velcroed to the internal support, along with its additional circuitry.

The “IDM SHOW” boxes changed colors.

Each theme also had it’s own color. Perception was red.

The color for “Reality” was purple.

All the boxes together.

In Distress

I created a cinematic experience in Virtual Reality based on the classic trope, "Damsel in Distress" with a woman tied on railroad tracks.

I used 4 rules when creating this experience:

1) Viewer is a part of the story, not omnipresent.

2) Interactivity is minimal or nonexistent.

3) Physically position the viewer relevant to the story.

4) Utilize environmental scale and depth.

To incorporate these rules in my story:

1) I made the viewer the damsel.

2) The viewer does not have to do anything.

3) The viewer is instructed to crouch on the floor with their legs in the position of a V.

4) The train is constantly visible from a great distance throughout the experience.

Albert Website

Website Interface | 2016

Once I began attending New York University, I found myself using their website albert.nyu.edu (aka Albert) quite often. Albert is intended to assist students during their time at the university and in New York City. However, I found the site to be confusing and difficult to navigate. This is how I would organize the Albert interface. The buttons and color scheme have remained the same; I'm only trying to reorganize the given information in a more manageable fashion.