Category: 06

meh-CriticalInterface

Can we make the invisible visible? The more present interfaces are in our lives, the less we perceive them.

  • Change the typography of your browser to a gothic blackletter. Or Dingbats (for a more advanced exercise).
  • How many times do you remember you're shifting gears when driving? Speak the gear number loud every time you do it.
  • Tonight write on a paper what interfaces you have used. Tomorrow score how long have you been using each. Do it every day this week.

If we bring the idea of "interface" to a larger context beyond digital platforms and see it as a touch-point where two systems interact, the same principle still applies. In design, we learnt about the concept of "ready to hand" and "present at hand". When an object/interface becomes invisible to us and fails to present the , it becomes "ready to hand". For example, when a person is looking through the glasses, they are not aware of the glasses but focuses on the things they see through glasses. When the glasses is broken, its existence suddenly becomes visible and thus becomes "present at hand". In design, "ready to hand" is always considered as desirable since it reduces the effort of users to interpret and learn about the product. However, just as what are listed in the propositions, it is sometimes very important to pull us out of this comfort zone and reflect on the interface we are using to be aware of the possible consequences. A good example would be the new feature on iPhone that notifies you how much time you spend on your phone today. With the interruption of pop-up notification, you are suddenly aware of the interface and your actions.

rysun-techniques

Examples: Springs

Link: https://p5js.org/examples/simulate-springs.html

This example demonstrates how to use physics to give objects character and dynamism.

 

Libaries: p5.localmessage

Link: https://github.com/bmoren/p5.localmessage

This library interests me because the ability to send messages from one sketch to another allows for multi-user interaction!

Glitch: handsfree-starter

Link: https://glitch.com/~handsfree-starter

Head controlled interactive art looks fun and innovative!

meh-techniques

  • Reach 2 - Line segments give a lot flexibility for rigging and more elegant moving effect;
  • WaveMaker - Useful when I want to create any moving patterns
  • p5.asciiart - A great way to stylize the image, wonder if i can use it with OpenCV;
  • Tramontana - It would be interesting to develop some multi-platform game using this.
  • Magenta.js - Maybe create an instrument using interaction with a website?

clox-CriticalInterface

clox-CriticalInterface

I thought tenet 13 was interesting: "In the design of the interface, not only skills but also emotions and affections are deployed. How are emotions produced and circulated in interfaces?" Here are a couple of the tenet's propositions/assignments:

  1. Never, never smile when photographed. Stop the happy flow. Even better: pretend to take pictures but instead take videos, and don't tell the person. You'll see how smiles fade away.
  2. Draw your own emoticons
  3. Kiss the screen
  4. From time to time, choose some messages you want to comunicate, and avoid sending an email, post, sms, message and try to do it in real life to see how it feels.
  5. Share your fears in the social networks. Then share your neckline (sorry feminists :S , I don't find a male correlate).

I think the propositions for this tenet are, more than trying to trace how emotions flow, become mediated by, are imbued by, embedded in (etc.) by interfaces, they provide a set of counter-choreographies to the way we "normally" interact with interfaces (or the idea of interfaces). By "normally" I mean that these propositions already carry a preconceived view of our affective relationship with (digital/not-digital) interfaces (the cold screen (inauthentic) VS. the warm cheek (authentic), the text message V. a face-to-face conversation), and seek to repair those affective relationship (see the call to: "Kiss the screen"). Some of the propositions also recognize the agency we have in determining some aspect of how we circulate emotions through interfaces--like drawing your own emoticons. Generally, this tenet is showing how both the materiality and temporality of the person and the interface is implicated in the way emotions are circulated. I also want to say that proposition 5  (above) is lazy and there is no need to replicate sexist language to make a point (we ALL already know what "showing your neckline" does, we see it all the time, and for longer than social networks have ever existed). While I can see that these could be fun experiments to do,  I think that some of these propositions are just amateur sociological experiments (riddled with biases).

clox-06-Techniques

References/Examples: For this technical looking-outwards I inspected: createWriter(), video pixels, continuous lines, sound effect, loadJSON(), saveStrings(), and letter.

Most of the references and examples I encountered were all interesting and useful (since I am still learning what is possible in p5js, let alone what kind of interaction is possible with and within the computer). So, I found the loadJSON() function more useful than interesting--in the sense that I now know that I can load data (for my interests, textual data) into p5js using this function (I learnt how to receive data from a JSON file previously in my coding for digital humanities class). The example on how to how to write text (saveStrings() to a file is also useful in tandem with the loadJason function.

Libraries: Looked at: p5.speech, Vida (p5js + motion detection), p5.geolocation, ml5.js (got a peek last week working with Golan on a custom classifier),  p5js +ASCII art, and p5.riso.

All of the libraries I looked at were interesting! But I thought that the p5.riso library was especially intriguing since it is a library designed to eventually generate a physical object (a risograph print)--I have seen this used a few times to convert shader-generated graphics into a static poster.

Glitch.com: I looked at friendly-words  and hello-magenta on Glitch.com. I think friendly-words would be a useful if I need a good bank of words to draw from. Hello-magenta is interesting  because it helps you make music online (might be cool to use for collaborative music composition).

lsh-techniques

While browsing the P5.JS docs, I found out that one can instantiate a P5 instance, so one can have a program of object oriented P5 sketches, which is pretty cool, especially with the concept of scoping.

p5.gui looks like a promising library for prototyping sketches or designs for those used to openFrameworks and Cinder.

The d3 block on glitch looks useful for converting datasets between different types (such as geodata which I regularly use in CSV).

ilovit-CriticalInterface

"10. The interface uses metaphors that create illusions: I am free, I can go back, I have unlimited memory, I am anonymous, I am popular, I am creative, it's free, it's neutral, it is simple, it is universal. Beware of illusions!"
"Imagine your desktop is a kitchen, a garden, a hospital, a computer. Now, imagine it using no metaphor"
"Don't delete your bookmarks history after watching porn. It's useless, Google always remembers."

This articulates really well something that makes me really uncomfortable about interacting with the digital world. All the illusions! The way search history is organized like a journal - date, time, where you went - so it seems like you can just tear out a page and throw it out. How you "paint" with Photoshop, "type" with Word. The more that digital environments become the dominant frame of reference, the more elusive the metaphors become: interfaces become metaphors for interfaces. I like especially the idea of using our own metaphors for our interfaces, although it's hard to keep up.

 

MoMar – Critical Interface

1: The interface is a device designed and used to facilitate the relationship between systems.

An interface is a messenger. 

Say we want to make a button and a lamp. The button when pressed must send an electric signal (message) to the lamp to turn it on. This electric signal is an interface, specially designed to work between objects that need to be remotely enabled.

To anyone who worked with computer interfaces before this seems to be obvious. Not so to the casual observer! In software, we use interfaces to connect one program (or different parts of a program) to another. In physical computing, interfaces are very important, which is why I chose the first tenant.

In the weather example for P5.Js, the function gotWeather() is an interface designed to help get the information from the weather API.

In my looking outwards, I wrote about claytronics. The team wrote a software interface between the 3D modeling program and the catons to shape the claytronic.

 

 

vingu – Techniques

example

This gets audio input from the Computer Microphone. I think that there are fun uses for making this interactive.

library

This is a 2D collision library, which will be helpful in making animations or games.

glitch

hello-Magenta helps create music on the web. It seems simple and fun.