Gestalt Principles Pt 2 – PART 2
Fierce and Dynamic:
– Bold
– Standing out
– Breaking a rule
– major contrast
– Big move in the composition
– Intense
– Strong Focus
– Used extensively throughout the composition
– Unpleasant
– Extensive continuation of big and small moves
Gestalt Principles Pt2 – PART 1
Whimsical and Delicate:
– Playful
– unusual
– Abstract
– thin white spaces
– Funny
– Breaking a rule
– one of a kind
– delusional
– weightlessness
– confusing
Safe and Efficient:
– Composed
– balanced
– equal use of white and black space
– following a rule
– enclosed
– quick
– smart
– more white space- light
– equal division
– symmetry
What is your story?
Our story is attempting to educate people about the effectiveness of the ‘Stop and Frisk’ program. Primarily, how it leads to rightful incarcerations as well as notify citizens where and when crime occurs in the Los Angeles area.
How does the selected data support your story?
By solely looking at the “stop and frisks” that lead to a follow-up or incarceration, we can tally the number of times the program effectively lead to a “true positive” outcome. Our story essentially states that without this program in place, this statistic would instead be the number of potential crimes that would not have been mitigated.
The second graph from our analysis shows where and when the true positives occur. This visualization serves as a public service announcement to the citizens of Los Angeles about potentially dangerous areas and when to avoid them.
What data did you omit, and why?
In order to show the effectiveness of the program, we filtered out the data representing “stop and frisks” that did not result in a situation necessitating follow-up or incarceration. In other words, our data represents only “stop and frisks” resulting in arrest — a metric that is indicative of success of the program. We also chose to not create a visualization about gender, race, or division of the LAPD as they could be interpreted as biased and even discriminatory.
How does the representation support your story?
We used Tableau as our main representation graphic as it would give us a clear visual analysis which would be easy for the general public to understand. The graph clearly explains our analysis using two simple color coding system, with line graphs quantifying the number of true positives over time.
What visual metaphor(s) did you use and why?
We chose a line graph to communicate how this data changes over time. We felt that the continuous nature of a line would effectively communicate the dimension of time, going from the conventional left to right orientation. The erratic nature of the line graph communicates the unpredictable and stressful nature of crime in Los Angeles. We can see the constant ebbing and flowing, conflict and resolution, of crime. We have the Stop and Frisk program to thank for helping to bring order to society.
Fierce and Dynamic:
– Bold
– Standing out
– Breaking a rule
– major contrast
– Big move in the composition
– Intense
– Strong Focus
– Used extensively throughout the composition
– Unpleasant
– Extensive continuation of big and small moves
Whimsical and Delicate:
– Playful
– unusual
– Abstract
– thin white spaces
– Funny
– Breaking a rule
– one of a kind
– delusional
– weightlessness
– confusing
Safe and Efficient:
– Composed
– balanced
– equal use of white and black space
– following a rule
– enclosed
– quick
– smart
– more white space- light
– equal division
– symmetry
My initial object is a ‘scotch tape’. One thing I really like in this object would be the combination of two actions into one!! In order to use a scotch tape, along with the tape we generally need another object (a scissors) performing two different actions/ hand movements– pulling the tape from the tape roll and cutting it using a scissor. This particular creation is a condensed version of those actions together which I think is amazing.
This basically happens with 2 things. 1 is the circular motion of the tape and the other is the ’wonder blade’, which has just the right amount of sharpness to do its job.
When I started to work on this assignment, I wanted to modify this object in a way that visually still gives an illusion of a tape but when we actually use it, that is when the user realizes it to be different. I was looking out for options to replace the tape and I came up with – “ Sticky Notes”. The reason behind choosing sticky notes – I was trying to look for something contrast to a tape which is generally used to stick two pieces together where as a sticky note is used to stick onto something. Though the content of them is the same, the purpose and function of it is totally opposite.
Replacing the tape with sticky notes had made the object look like a tape visually but it has lost its function. It is no more used to stick two things together. We are still using the circular motion of the object but the blade has lost its purpose and is now being used to support the notes. The main intention of making this object is to deceive the person using it as well as making use of the scotch tape mechanism for another purpose (Re- Purposing).
When I showed this object to my friends, most of them thought it to be a “colored tape” and one of them actually went ahead to use it but later realized it to be a sticky note. The purpose of my move was accomplished- both creating a visual illusion as well as repurposing it for another function.
Remaining slide for our presentation are below. Please see earlier post of the same title for the written description.
(Splitting to 3 posts due to # of images upload maximum per post).
Remaining slides for our presentation are below. Please see earlier post of the same title for the written description.
(Splitting to 3 posts due to # of images upload maximum per post).
User Interface Metaphor Discussion Presentation
Teresa Haun, Yang Tan, Meghana Battini
[Please note you can see the presentation attached as images of each slide. The below are some written out explanations, similar to what we talked about during our presentation. Due to the image # limitations per post, there will be an additional addendum post to cover remaining slides]
What is an affordance?
“An affordance is a property of an object, or a feature of the immediate environment, that indicates how to interface with that object or feature.”
Metaphors help us understand affordances. We associate characteristics or emotions from one thing and apply them to another.
Affordance example 1: Computer mouse (Teresa Haun)
A computer mouse allows you to click and select different items on a computer. A metaphor for this is driving a car that gets you around the world quickly, since a mouse is like a little transport vehicle to get you around your computer quickly. This is a universally understood example that works across cultures as people all over the world use the computer mouse and drive automobiles. This metaphor is understood through teaching, since it is not very intuitive to figure out what to do with a computer mouse or how to drive a car. You are taught both usually by a parent or mentor and there is even driving school to make sure everyone understands the process similarly.
Affordance example 2: Apple Home Button (Yang Tan)
The apple home button is the sole tactile button. Metaphors for this are:
– “big red button”, with associations of power;
– rube goldberg machines, with associations of one touch that triggers a delightful cascade of events which you do not have to do yourself, whimsy, fun;
– a nest, which is perhaps a more personal metaphor, with associations of warmth, familiarity, comfort. The home button’s round design evokes this, as well as its function of bringing you “home”.
The metaphor of the big red button for example is more universally understood in post-industrial societies. This metaphor is learned through experience (cause and effect is pretty directly observable without being taught).
Affordance example 3: Mug Handle (Meghana Battini)
Whenever we hold a mug using its handle, we build a connection towards it and feel like it’s ‘ ours!’ just like holding onto something or someone really close to you. Keeping this in mind, the metaphors used for this object are – Affection or holding onto something / someone really close to you.
HOW and WHY do we associate that action and feeling towards it?
We can see that the shape of the object implying the purpose and function of the affordance. In a way, the shape itself can be used as an interface to use the object. We have been trained to do that action whenever we see that shape and we associate that in many other situations like holding a scissors/ a ring/ a person etc. We can see how these metaphors are being used in actually designing an object
It is Universally understood and works across cultures. We have been trained to do that action right from our childhood and now we do it by instinct. No matter how you hold it, the basic initial actions of your hand is the same and that is how you connect with it.
Bad Design example 1: Door that is too close to toilet (Teresa Haun)
An example of bad design is a bathroom that is far too small and the door is so close that your legs hit it while sitting on the toilet or you just can’t get out easily. A metaphor for this is public transportation systems where there are far too many people jammed together and so you don’t have the space you need. Even with more experience using a tiny bathroom or commuting on a packed train, this would not improve the bad design since it is a functional problem driven by too little space accounted for. This is a universally understood example but it is appreciated more by certain cultures that value more space and have the opportunity to give each person more space. This metaphor can really only be understood and appreciated by experiencing the inconvenience of small spaces for the sake of efficiency.
Bad Design example 2: Rally Race Computer (Yang Tan)
The Rally Race Computer has a lot of knobs, buttons and requires a lengthy key combination to execute a simple task. Metaphors for this race computer include: traditional programming thermostat, airplane cockpit, a robotics technician (evokes technology and “expertise required”). Some of these metaphors contain some positive associations (airplane cockpit could connote excitement, speed, technological expertise) but a lot of them have negative associations and emotions such as frustration, overly-complex, confusing.
Experience could improve this, such as by learning key combinations, but only up to limit. After that a functional matter because the core function is impeded: you could forget how to access certain core functionality because of the complexity and diminish your experience.
These metaphors are perhaps more personal. Metaphors for this object are somewhat individual – e.g. generational, expertise-based.
These metaphors are taught, based on your exposure to electronics, tech experience, and/or media concerning race car cockpits, airplane cockpits etc.
Bad Design example 3: An Umbrella (Meghana Battini)
I personally had bad experiences with this object and because of this I would split the metaphoric interpretations into 2 parts –
1. When using it for the first time: Protection/ Blessing.
· An umbrella can be associated with a roof, which protects us from rain and other environmental factors.
· It can also be associated with an Indian way of blessing, which usually implies support.
2. After bad experiences with the object: Weapon/ Pushing people away from you.
Due to some aspects of the object, which makes it a bad design, unintentionally we tend to use it to push people away from you or used as a weapon to protect yourself.
· It is too big for one, too small for two, has sharp ends at its circumference.
· Because of its size and material, it is really hard to use this object in the crowded areas – We usually tend to lift our umbrella due to lack of space.
It is universally understood and works across cultures. The metaphoric associations wouldn’t improve the experience of it as it’s purely function based and is personally linked with every individual using it.
Roommate Searching Tool for Craigslist
Group: Siqi Wang, Justin Berner, Elena Duran L. Meghana Battini
Text by Justin Berner
The product is for students who is new to the area does not have a place to live, but are looking to live with new flatmates/roommates. Currently, roommate-hunting websites primarily present a lot of information about the personality of the roommate and the specifics of the apartment, but they provide little information about the dynamics of the neighborhoods in the area. Our user can thus first discover the neighborhoods in which they would feel most content (i.e. a neighborhood with nightlife, restaurants, parks, etc.) before diving into the personalities of possible roommates.
Design Flow:
After deciding whether they are offering or seeking a roommate, the user puts in a range of prices and possible roommates. Then, they go to a map that has circles overlaid it to represent both number of matches (size of circle) and the most salient feature of that neighborhood (color of circle). The user can be taken to a screen where they can choose from a predetermined set of tags to help refine roommates. Once they have a sufficient number of tags, they can go to a new page with a group of circles with photos of prospective roommates. They can then click on the roommate to see a list of social media characteristics (top songs, top photos, mutual friends, etc.) and then from there they can click a button to contact this person.
The desired feeling that the product should evoke would be someone between the classic feeling of craigslist/newspaper browsing for roommates and the more immersive, navigational feel of applications or social media. It should try to take some of the uncertainty out of this process since it is geared towards those who have little-to-no knowledge of the area.
Post Category: Taste Response