# Class 1: Design Tools

## TOOLS

[Spatial Narrative](https://firebasestorage.googleapis.com/v0/b/gitbook-28427.appspot.com/o/assets%2F-LiPPFFn8713gkOyphHP%2F-LnMxBwSuJSAO1mgf5IA%2F-LnN2zG18WqqvmtTfH5z%2FScreen%20Shot%202019-08-28%20at%2013.49.58.png?alt=media\&token=1379d3b5-3734-4766-af06-a2cf477b72b2)\
[Action Spaces\
](https://blobscdn.gitbook.com/v0/b/gitbook-28427.appspot.com/o/assets%2F-LiPPFFn8713gkOyphHP%2F-Ln3VsxEbFCuRm6UZV91%2F-Ln3Xcgy4HKzaCmxheD3%2Fzones.jpg?alt=media\&token=462dd065-a13a-445a-bc8e-bb1e494b5dcf)[Proxemics](https://blobscdn.gitbook.com/v0/b/gitbook-28427.appspot.com/o/assets%2F-LiPPFFn8713gkOyphHP%2F-Ln2Pz4M3ljQvZuixhWI%2F-Ln2T5AOqWWhn59PTswp%2Fproxemics.jpg?alt=media\&token=75b086f9-52c0-4746-9e8f-e7b103fa592f)

## I. Look for Spatial Narratives

#### Define settings

* _Who_ is my user group? Who are my stakeholders?
* _Why_ does my client want to have a VR/AR/MR experience? What the proposed purpose of the product? And, do we agree?
* _When_ will the product be used? What does this moment look like? Is it a casual moment? Does the moment occur repetitiously?
* _Where_ will the product be used? What kind of environment? What kind of feel does this environment have? Who are present? And who are not?
* _How_ is the product used? Does it need support? Is that available?
* _What_ are we going to make that is contributory to the clients needs and society as well?

#### Formation Spatial Narrative

\- **Integration**:  How are _spatial_ _territories_ defined and integrated?\
\- **Flow:** What _obstacles_ and _openings_ are placed?\
\- **Choice:** What _choice_ do users have?&#x20;

### A. SPACE&#x20;

<img src="https://1763729276-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LiPPFFn8713gkOyphHP%2F-LnfkbujfLFhjvk8K1-a%2F-LnfpYHwSyfOGKC9fgUH%2Fspatialnarrative.jpg?alt=media&#x26;token=38823a18-5bb6-42ba-9e20-d1af167da417" alt="" data-size="original"> <img src="https://1763729276-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LiPPFFn8713gkOyphHP%2F-LnMxBwSuJSAO1mgf5IA%2F-LnN3tY42GTpgpGJxtG1%2FScreen%20Shot%202019-08-28%20at%2013.53.42.png?alt=media&#x26;token=47494cf7-9d10-4639-8963-4dc45efcbb80" alt="" data-size="original"> \
source: [What architecture adds to building](http://spaceisthemachine.com/wp-content/uploads/2015/03/SITM_Chapter-1_What-architecture-adds-to-building.pdf)

### B. NARRATIVE

![narrative techniques](https://1763729276-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LiPPFFn8713gkOyphHP%2F-Ln2Pz4M3ljQvZuixhWI%2F-Ln2R3Pn-kWvlJgGbbLM%2Fnarrativetechniques.jpg?alt=media\&token=c107a6cf-30f5-43db-a81b-4c92e66a559a)

_further reading:_ \
_-_ [Narrative Theory](https://immersive-design.gitbook.io/immersive-design/-LVZotDI37V2-xJeHLYj/related-materials/concept-and-identity-deep-learning-narrative-theory)\
\- [Periodic Table of Storytelling](http://jamesharris.design/periodic/)

## II. Spatial Planning

[Space planning ](https://www.firstinarchitecture.co.uk/space-planning-basics/)

![](https://1763729276-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LiPPFFn8713gkOyphHP%2F-M0sCr-F_kO1jYWnMNP1%2F-M0sMFCHGteIqMGAZ3uu%2Fbubble%20diagram.jpeg?alt=media\&token=329b7204-3fec-4061-9dbe-92ef108a0655)

![](https://1763729276-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LiPPFFn8713gkOyphHP%2F-Lp83lfH1ISu0MwGOXyE%2F-Lp85C5q9NfpCmA09zNW%2FIMG_6561.JPG?alt=media\&token=8e2a3fb5-7c87-40e0-934d-bd5f069a499a)

![](https://1763729276-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LiPPFFn8713gkOyphHP%2F-Lp83lfH1ISu0MwGOXyE%2F-Lp85FWvA0gHTjhxdD2d%2FIMG_6582.JPG?alt=media\&token=1ee0d088-ab17-4a79-9cd1-7c684a780938)

![intimate - personal - social - public](https://1763729276-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LiPPFFn8713gkOyphHP%2F-LmybyZPDpgc-zrzltON%2F-LmyiDQ-T4SuGKhzXK2x%2FIMG_6765.JPG?alt=media\&token=02e13bee-9e3f-4b96-ab88-215388ffeddf)

![heatmap audio intensity](https://1763729276-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LiPPFFn8713gkOyphHP%2F-M0sCr-F_kO1jYWnMNP1%2F-M0sMP0NMY6h6g5VguYa%2F1_snOHylRsXsyybVicjP8X8w.png?alt=media\&token=49873f54-ec47-4625-a3fd-e56159126f6d)

![](https://1763729276-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LiPPFFn8713gkOyphHP%2F-M0sCr-F_kO1jYWnMNP1%2F-M0sMhJsJtjtJeJ4leSt%2Faudio%20mapping%20%26%20storytelling.png?alt=media\&token=d5bfef31-77d4-4626-91c5-cb73bc95bf97)

## III. Proxemics

![Define proxemics](https://1763729276-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LiPPFFn8713gkOyphHP%2F-Ln2Pz4M3ljQvZuixhWI%2F-Ln2T5AOqWWhn59PTswp%2Fproxemics.jpg?alt=media\&token=75b086f9-52c0-4746-9e8f-e7b103fa592f)

{% embed url="https://vimeo.com/288132567" %}

Video: [Character Building through movement](https://www.youtube.com/watch?v=1RRc4tq2kpE)

## IV. Action Spaces

![scene](https://1763729276-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LiPPFFn8713gkOyphHP%2F-LmybyZPDpgc-zrzltON%2F-LmyijFAM52bVNcBkBJz%2FIMG_6907.JPG?alt=media\&token=8d3d0ee0-981b-41bc-a9a1-6d5e3e91b333)

![1st - 2nd - 3rd action spaces](https://1763729276-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LiPPFFn8713gkOyphHP%2F-Ln3VsxEbFCuRm6UZV91%2F-Ln3Xcgy4HKzaCmxheD3%2Fzones.jpg?alt=media\&token=462dd065-a13a-445a-bc8e-bb1e494b5dcf)

![define interactive elements & use cues ](https://1763729276-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LiPPFFn8713gkOyphHP%2F-Ln7nvWvWXn2h-lvJHyv%2F-Ln7oIfV3LQzQ15sk_ok%2Fpov2.jpg?alt=media\&token=8f81fe98-8558-48bb-9a79-4b6e583e759f)

## Additional

### Storytelling basics

#### Define settings

* _Who_ is my user group? Who are my stakeholders?
* _Why_ does my client want to have a VR/AR/MR experience? What the proposed purpose of the product? And, do we agree?
* _When_ will the product be used? What does this moment look like? Is it a casual moment? Does the moment occur repetitiously?
* _Where_ will the product be used? What kind of environment? What kind of feel does this environment have? Who are present? And who are not?
* _How_ is the product used? Does it need support? Is that available?
* _What_ are we going to make that is contributory to the clients needs and society as well?

{% embed url="https://www.youtube.com/watch?v=wUwr7qJCQhA&feature=youtu.be" %}

#### How to Start Telling Stories

* Start with your message and goals (who, what, where, when, how, why)
* Know special needs for special target groups
* [Define the type of experience](https://www.researchgate.net/profile/Luis_Encarnacao2/publication/257921847/figure/tbl1/AS:392556530683905@1470604178262/Preliminary-Serious-Games-taxonomy-Sawyer-and-Smith-2008.png)
* Create effective dialogues (emotional & expressive)\

* **Syntax**_**:**_ [Periodic Table of Storytelling ](http://jamesharris.design/periodic/)-_sequence & order, cause & effect, problem & solution, compare & contrast_
* **Semantics**: Plot - _situation, empathy, intentions, character, dialogue, conflict, resolution, call-to-action_
* **Pragmatics**: Translate the plot to 360/VR - _presence, point-of-view, 1st person, 3rd person_

#### Building Narrative Structures: weaving the braid

![Interactive Narrative Structures](https://weixuanzhaosss.files.wordpress.com/2010/09/e59bbee78987-161.png)

[Marie – Laure Ryan](https://archive.org/details/NarrativeAsVirtualReality2MarieLaureRyan/page/n1) lists 9 possible interactive narrative structures (see above):

1. The Complete graph structure,&#x20;
2. The network structure,&#x20;
3. The Tree structure,&#x20;
4. The Vector with Side Branches,&#x20;
5. The Maze structure,&#x20;
6. The Directed Network, or Flow Chat,&#x20;
7. The Hidden Story structure,&#x20;
8. The Braided Plot,&#x20;
9. Action Space, Epic Wandering and Story-World.

#### Breaking Immersion: The Fourth Wall

![Henry](https://i0.wp.com/skarredghost.com/wp-content/uploads/2018/06/Henry_Go_1.jpg?ssl=1)

Breaking the fourth wall was common in Elizabethan theatre, specifically in Shakespeare's works. There is an unparalleled connection between audience and story in VR when a storyteller knows how to manage the medium. An almost visceral reaction can be evoked in audiences when a Director knows how to leverage Virtual Reality to tell his/her story. When [**Henry**](https://www.youtube.com/watch?v=IUY2yI5F16U) looks directly at us - in context- in the well made VR film of the same name, there is no denying the feeling of ‘presence’ the audience feels when viewing Henry in VR.&#x20;

#### Storyboarding: integrate SPACE, TIME and STORY

#### &#x20;<img src="https://1763729276-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LiPPFFn8713gkOyphHP%2F-LncicASYpHLv5HyEjWK%2F-Lncink4wbFWxniaNZnw%2Fexample_storyboard4.jpg?alt=media&#x26;token=a255bcff-a7a4-43b5-bedf-35985c5cb5ff" alt="" data-size="original">&#x20;

![](https://1763729276-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LiPPFFn8713gkOyphHP%2F-LncicASYpHLv5HyEjWK%2F-Lnciv5KzY7qX3KCQW-Y%2FStoryboard-tool.jpg?alt=media\&token=89ecf7e5-0f92-4c7a-9261-18ab8db25345)

#### **Make a journey map and define touchpoints**

![Define the journey and the touchpoints](https://1763729276-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LiPPFFn8713gkOyphHP%2F-Ln2TKGlNpXc79VbebGm%2F-Ln2TMKLjjMee-n_zAOU%2Ftouchpoints.jpg?alt=media\&token=4265ead5-8efd-4da3-b7ca-7ffc02f18b26)

further reading:\
[beginner's guide to user journey mapping](https://www.appcues.com/blog/user-journey-map)
