Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
2 changed files
with
2 additions
and
29 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,29 +1 @@ | ||
| <!DOCTYPE html> | ||
| <html> | ||
| <head> | ||
| <title>alternate realities | course notes</title> | ||
| <meta charset='utf-8'> | ||
| <link rel='stylesheet' href='style.css'> | ||
| </head> | ||
| <body> | ||
| <header> | ||
| <h2>alternate realities</h2> | ||
| </header> | ||
| <main> | ||
| <h1>course notes</h1> | ||
| <ol> | ||
| <li> | ||
| <a href="intro.html">intro</a> | ||
| </li> | ||
| <li> | ||
| <a href="environments.html">environments</a> | ||
| </li> | ||
| <li> | ||
| <a href="interaction.html">interaction</a> | ||
| </li> | ||
| </ol> | ||
| </main> | ||
| </body> | ||
| </html> | ||
|
|
||
|
|
||
| <!DOCTYPE html><html><head><meta charset="utf8"><title>alternate-realities | notes</title><link rel="stylesheet" href="style.css"></head><body><header><h2>alternate-realities</h2></header><main><h1>course notes</h1><ol><li><a href="environments.html">environments</a></li><li><a href="interaction.html">interaction</a></li><li><a href="interfaces.html">interfaces</a></li><li><a href="intro.html">intro</a></li></ol></main></body></html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1 @@ | ||
| <!DOCTYPE html><html><head><meta charset="utf8"><title>alternate-realities | interfaces</title><link rel="stylesheet" href="lesson.css"></head><body><header><h2><a href="index.html">alternate-realities</a></h2><h3>interfaces</h3></header><main><div class="lessons-container" id="writing-board"><div class="concept-buttons"><!--button.lesson-btn.concept(concept= index, onclick='switchConcept(' + index + ')')= index + '. '+ val[0]--><!--button.lesson-btn.concept(concept= index, onclick='switchConcept(' + index + ')')= index + '. '+ val[0]--><!--button.lesson-btn.concept(concept= index, onclick='switchConcept(' + index + ')')= index + '. '+ val[0]--><!--button.lesson-btn.concept(concept= index, onclick='switchConcept(' + index + ')')= index + '. '+ val[0]--><!--button.lesson-btn.concept(concept= index, onclick='switchConcept(' + index + ')')= index + '. '+ val[0]--><!--button.lesson-btn.concept(concept= index, onclick='switchConcept(' + index + ')')= index + '. '+ val[0]--><!--button.lesson-btn.concept(concept= index, onclick='switchConcept(' + index + ')')= index + '. '+ val[0]--><!--button.lesson-btn.concept(concept= index, onclick='switchConcept(' + index + ')')= index + '. '+ val[0]--><!--button.lesson-btn.concept(concept= index, onclick='switchConcept(' + index + ')')= index + '. '+ val[0]--><!--button.lesson-btn.concept(concept= index, onclick='switchConcept(' + index + ')')= index + '. '+ val[0]--><!--button.lesson-btn.concept(concept= index, onclick='switchConcept(' + index + ')')= index + '. '+ val[0]--><!--button.lesson-btn.concept(concept= index, onclick='switchConcept(' + index + ')')= index + '. '+ val[0]--><!--button.lesson-btn.concept(concept= index, onclick='switchConcept(' + index + ')')= index + '. '+ val[0]--><!--button.lesson-btn.concept(concept= index, onclick='switchConcept(' + index + ')')= index + '. '+ val[0]--><!--button.lesson-btn.concept(concept= index, onclick='switchConcept(' + index + ')')= index + '. '+ val[0]--><!--button.lesson-btn.concept(concept= index, onclick='switchConcept(' + index + ')')= index + '. '+ val[0]--><!--button.lesson-btn.concept(concept= index, onclick='switchConcept(' + index + ')')= index + '. '+ val[0]--><!--button.lesson-btn.concept(concept= index, onclick='switchConcept(' + index + ')')= index + '. '+ val[0]--><!--button.lesson-btn.concept(concept= index, onclick='switchConcept(' + index + ')')= index + '. '+ val[0]--><!--button.lesson-btn.concept(concept= index, onclick='switchConcept(' + index + ')')= index + '. '+ val[0]--><!--button.lesson-btn.concept(concept= index, onclick='switchConcept(' + index + ')')= index + '. '+ val[0]--><!--button.lesson-btn.concept(concept= index, onclick='switchConcept(' + index + ')')= index + '. '+ val[0]--><!--button.lesson-btn.concept(concept= index, onclick='switchConcept(' + index + ')')= index + '. '+ val[0]--><!--button.lesson-btn.concept(concept= index, onclick='switchConcept(' + index + ')')= index + '. '+ val[0]--><!--button.lesson-btn.concept(concept= index, onclick='switchConcept(' + index + ')')= index + '. '+ val[0]--><!--button.lesson-btn.concept(concept= index, onclick='switchConcept(' + index + ')')= index + '. '+ val[0]--><!--button.lesson-btn.concept(concept= index, onclick='switchConcept(' + index + ')')= index + '. '+ val[0]--><!--button.lesson-btn.concept(concept= index, onclick='switchConcept(' + index + ')')= index + '. '+ val[0]--><!--button.lesson-btn.concept(concept= index, onclick='switchConcept(' + index + ')')= index + '. '+ val[0]--><!--button.lesson-btn.concept(concept= index, onclick='switchConcept(' + index + ')')= index + '. '+ val[0]--><!--button.lesson-btn.concept(concept= index, onclick='switchConcept(' + index + ')')= index + '. '+ val[0]--><!--button.lesson-btn.concept(concept= index, onclick='switchConcept(' + index + ')')= index + '. '+ val[0]--><!--button.lesson-btn.concept(concept= index, onclick='switchConcept(' + index + ')')= index + '. '+ val[0]--><!--button.lesson-btn.concept(concept= index, onclick='switchConcept(' + index + ')')= index + '. '+ val[0]--></div><div class="concept-group"><h3 class="concept-name">0. interfaces</h3><div class="prep-group"><div class="prep note" concept="0">the humane conception of human though</div></div><div class="note-group"></div></div><hr><div class="concept-group"><h3 class="concept-name">1. what?</h3><div class="prep-group"><div class="prep note" concept="1">what is an interface?</div><div class="prep note" concept="1">what are some examples of interfaces?</div></div><div class="note-group"></div></div><hr><div class="concept-group"><h3 class="concept-name">2. the point</h3><div class="prep-group"><div class="prep note" concept="2">the exact point of where you interact</div></div><div class="note-group"></div></div><hr><div class="concept-group"><h3 class="concept-name">3. nature</h3><div class="prep-group"><div class="prep note" concept="3">what are some examples of natural interfaces?</div></div><div class="note-group"></div></div><hr><div class="concept-group"><h3 class="concept-name">4. affordances</h3><div class="prep-group"><div class="prep note" concept="4">false</div><div class="prep note" concept="4">hidden</div><div class="prep note" concept="4">perceptible</div><div class="prep note" concept="4">obvious</div></div><div class="note-group"></div></div><hr><div class="concept-group"><h3 class="concept-name">5. external</h3><div class="prep-group"><div class="prep note" concept="5">physical interfaces give us a point of access to an external object</div></div><div class="note-group"></div></div><hr><div class="concept-group"><h3 class="concept-name">6. non-physical</h3><div class="prep-group"><div class="prep note" concept="6">are there interfaces for the non-physical?</div><div class="prep note" concept="6">1.</div><div class="prep note" concept="6">2.</div></div><div class="note-group"></div></div><hr><div class="concept-group"><h3 class="concept-name">7. symbols</h3><div class="prep-group"><div class="prep note" concept="7">symbols such as</div><div class="prep note" concept="7">- letters</div><div class="prep note" concept="7">- numbers</div></div><div class="note-group"></div></div><hr><div class="concept-group"><h3 class="concept-name">8. data visualization</h3><div class="prep-group"><div class="prep note" concept="8"><img src="tufte.png"></div></div><div class="note-group"></div></div><hr><div class="concept-group"><h3 class="concept-name">9. multi-modality</h3><div class="prep-group"><div class="prep note" concept="9">vilem flusser's line vs. plane</div><div class="prep note" concept="9">using multiple modes in communicating information back to the user</div><div class="prep note" concept="9">equivalence</div><div class="prep note" concept="9">specialization</div><div class="prep note" concept="9">redundancy</div><div class="prep note" concept="9">complimentarity</div><div class="prep note" concept="9">transfer</div><div class="prep note" concept="9">concurrency</div></div><div class="note-group"></div></div><hr><div class="concept-group"><h3 class="concept-name">10. reinforcing effect</h3><div class="prep-group"><div class="prep note" concept="10">the more modalities in the interface</div><div class="prep note" concept="10">the more effective the message</div><div class="prep note" concept="10">(but too much of unimodality can have a detrimental effect)</div></div><div class="note-group"></div></div><hr><div class="concept-group"><h3 class="concept-name">11. rationality vs. emotionality</h3><div class="prep-group"><div class="prep note" concept="11"><img src="florida.png"></div></div><div class="note-group"></div></div><hr><div class="concept-group"><h3 class="concept-name">12. faking things</h3><div class="prep-group"><div class="prep note" concept="12"><img src="immigration.png"></div></div><div class="note-group"></div></div><hr><div class="concept-group"><h3 class="concept-name">13. definition</h3><div class="prep-group"><div class="prep note" concept="13">interfaces are designed affordances with a purpose to act and know about something else</div></div><div class="note-group"></div></div><hr><div class="concept-group"><h3 class="concept-name">14. digital</h3><div class="prep-group"><div class="prep note" concept="14">the digital</div><div class="prep note" concept="14">- a black box exclusively made up by people</div></div><div class="note-group"></div></div><hr><div class="concept-group"><h3 class="concept-name">15. digital 2</h3><div class="prep-group"><div class="prep note" concept="15">so what do digital interfaces link to?</div></div><div class="note-group"></div></div><hr><div class="concept-group"><h3 class="concept-name">16. computer interfaces</h3><div class="prep-group"><div class="prep note" concept="16">computer interfaces</div><div class="prep note" concept="16"><img src="babbage.png"></div></div><div class="note-group"></div></div><hr><div class="concept-group"><h3 class="concept-name">17. computer interfaces 2</h3><div class="prep-group"><div class="prep note" concept="17"><img src="univac.png"></div></div><div class="note-group"></div></div><hr><div class="concept-group"><h3 class="concept-name">18. computer interfaces 3</h3><div class="prep-group"><div class="prep note" concept="18"><img src="kare.png"></div></div><div class="note-group"></div></div><hr><div class="concept-group"><h3 class="concept-name">19. computer interfaces 4</h3><div class="prep-group"><div class="prep note" concept="19"><img src="ipad.png"></div></div><div class="note-group"></div></div><hr><div class="concept-group"><h3 class="concept-name">20. abstraction</h3><div class="prep-group"><div class="prep note" concept="20">abstracting</div></div><div class="note-group"></div></div><hr><div class="concept-group"><h3 class="concept-name">21. digital world is still real</h3><div class="prep-group"><div class="prep note" concept="21">everywhere, interfaces inform the action</div><div class="prep note" concept="21"><a href="http://darkpatterns.org">darkpatterns.org</a></div></div><div class="note-group"></div></div><hr><div class="concept-group"><h3 class="concept-name">22. parts of interfaces</h3><div class="prep-group"><div class="prep note" concept="22">things are required to make them usable</div><div class="prep note" concept="22">- input/output</div><div class="prep note" concept="22">- dialogue</div><div class="prep note" concept="22">- a function</div><div class="prep note" concept="22">- an organization</div></div><div class="note-group"></div></div><hr><div class="concept-group"><h3 class="concept-name">23. questions of interfaces</h3><div class="prep-group"><div class="prep note" concept="23">is it useful?</div><div class="prep note" concept="23">is it obvious?</div><div class="prep note" concept="23">is it cooperative?</div><div class="prep note" concept="23">is it consistent?</div><div class="prep note" concept="23">does it allow for mistakes?</div><div class="prep note" concept="23">is it modular?</div><div class="prep note" concept="23">is it informative?</div></div><div class="note-group"></div></div><hr><div class="concept-group"><h3 class="concept-name">24. types of interfaces</h3><div class="prep-group"><div class="prep note" concept="24">four broad types of digital interfaces</div><div class="prep note" concept="24"><img src="interfaces.png"></div></div><div class="note-group"></div></div><hr><div class="concept-group"><h3 class="concept-name">25. non-diegetic</h3><div class="prep-group"><div class="prep note" concept="25">non-diegetic</div><div class="prep note" concept="25"><img src="invaders.png"></div></div><div class="note-group"></div></div><hr><div class="concept-group"><h3 class="concept-name">26. diegetic</h3><div class="prep-group"><div class="prep note" concept="26"><img src="farcry.png"></div></div><div class="note-group"></div></div><hr><div class="concept-group"><h3 class="concept-name">27. meta</h3><div class="prep-group"><div class="prep note" concept="27"><img src="meta.jpg"></div></div><div class="note-group"></div></div><hr><div class="concept-group"><h3 class="concept-name">28. spatial</h3><div class="prep-group"><div class="prep note" concept="28"><img src="tiltbrush.png"></div></div><div class="note-group"></div></div><hr><div class="concept-group"><h3 class="concept-name">29. the interface of your interface</h3><div class="prep-group"><div class="prep note" concept="29">digital interfaces rely on physical interfaces</div></div><div class="note-group"></div></div><hr><div class="concept-group"><h3 class="concept-name">30. vr interface</h3><div class="prep-group"><div class="prep note" concept="30">what are physical interfaces for vr?</div></div><div class="note-group"></div></div><hr><div class="concept-group"><h3 class="concept-name">31. vr is space</h3><div class="prep-group"><div class="prep note" concept="31">spatiality</div><div class="prep note" concept="31">in movement</div><div class="prep note" concept="31">in layout</div></div><div class="note-group"></div></div><hr><div class="concept-group"><h3 class="concept-name">32. vr layouts</h3><div class="prep-group"><div class="prep note" concept="32"><img src="tagalong.gif"></div><div class="prep note" concept="32"><img src="worldlocked.gif"></div><div class="prep note" concept="32"><img src="diegetic.gif"></div></div><div class="note-group"></div></div><hr><div class="concept-group"><h3 class="concept-name">33. conclusion</h3><div class="prep-group"><div class="prep note" concept="33">- the interface represents your world.</div><div class="prep note" concept="33">- the interface is a dialogue between the internal thoughts of the user and the external states of the object, and every dialog can be both rational and emotional.</div></div><div class="note-group"></div></div><hr></div></main></body></html> |