Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

When the Web Re-Enters the Material World


Published on

Presented at Web Unleashed 2017
More info at

Presented by Adelle Lin, Intel Corporation


The web is beginning to spatialize. With the rapid development of hybrid reality tools –computer vision, webGL, 360 filming, animation as well as the hardware such as headsets and sensors– users are already beginning to expect richer content and more immersive ways to connect. How will the web look within virtual / augmented / alternate / mixed realities?
Information architecture starts to embody physical architecture, sitemaps start looking like blueprints; this calls for a new framework for UX design. Do we take skeuomorphic design rules and reapply them in physical form or invent new metaphors? Through a few case study prototypes, Adelle examines devices that are used across the spectrum of digital to material, and explains assessment techniques for designing a hybrid-connected future.


Let’s make a 3d web together

Target Audience

Designers, framework developers, VR, AR, futurists, storytellers

Five Things Audience Members Will Learn

Current and future 3D immersive web trends and technologies
Interaction design for 3D web
Development tools for VR / AR
Lessons from game design
Assessing UX complexity for your project

Published in: Internet
  • Your opinions matter! get paid for them! click here for more info...●●●
    Are you sure you want to  Yes  No
    Your message goes here
  • You can now be your own boss and get yourself a very generous daily income. START FREE...♥♥♥
    Are you sure you want to  Yes  No
    Your message goes here
  • I'll tell you right now (and I've got proof), that anyone who tells you "size doesn't matter to women" is flat out lying to your face and trying to make you feel better... Heck, just recently I asked a focus group of women via an anonymous online survey if size matters, and again and again they said "Oh my god, I HATE IT when it's SMALL." For a long time I didn't know what to tell the guys who'd write in to me and ask how to get "bigger." I'd say something lame like "Women actually like guys who are smaller... you just have to get good with your hands." Then I found "THE BIBLE of Penis Enlargement" by this guy named John Collins ●●●
    Are you sure you want to  Yes  No
    Your message goes here
  • Discover a WEIRD trick I use to make over $3500 per month taking paid surveys online. read more... ●●●
    Are you sure you want to  Yes  No
    Your message goes here
  • Be the first to like this

When the Web Re-Enters the Material World

  1. 1. When the Web Re-Enters the Material World Mixed reality metaphors and frameworks
  2. 2. @adellelin
  3. 3. ADELLE LIN @adellelin
  4. 4. Introduction Intel Image 2 @adellelin
  5. 5. @adellelin
  6. 6. KevR @adellelin
  7. 7. @adellelin
  8. 8. @adellelin
  9. 9. @adellelin
  10. 10. Real Environment Augmented Reality (AR) Augmented Virtuality (AV) Virtual Environment Mixed Reality (MR) @adellelin
  11. 11. AR TOOLS @adellelin
  13. 13. Liisa @adellelin
  14. 14. @adellelin
  15. 15. How do YOU experience the web? @adellelin
  16. 16. How do we Experience the web? @adellelin
  17. 17. @adellelin MooR: Developing a Web Concept for Mixed Reality
  18. 18. What is the Navigation Bar? @adellelin
  19. 19. FEATURES: Artist menu using object recognition Artist desk = hub for information Exhibit of works Physical movement around space Voice prompts @adellelin
  20. 20. @adellelin
  21. 21. Metaphors / Skeuomorphic DESIGN @adellelin
  22. 22. An Icon: Needs to be “systematically related to what it represents” @adellelin
  23. 23. +delete rm -r The trashcan @adellelin
  24. 24. As long as our relational brain gets it @adellelin +delete rm -r
  25. 25. Angular scale of screens
  26. 26. Screens in VR @adellelin
  27. 27. Typing @adellelin
  28. 28. Metaphors to consider: Reading screens Moving things Opening things Moving in space Back, saving, deleting Communication w/ people and things Inputs from and to the real world @adellelin
  29. 29. Information Journey 1. Recognize need 2. Acquire 3. Interpret and validate 4. Use @adellelin
  30. 30. Acquiring Information: Google Smart Agent Algorithmic Recommendation Crowd - sourced Social Media Location Based Surfing @adellelin
  31. 31. Foraging @adellelin
  32. 32. “Double experts teleport” @adellelin
  33. 33. Sensemaking: Search Extract Encode Analyze @adellelin
  34. 34. Three “Sensory Modalities” relevant to learning: 1. Verbal 2. Visual 3. Kinesthetic @adellelin
  35. 35. Work it Work it Work it Work it Work it Work it Work it Work it Work it Work it Work it @adellelin
  36. 36. @adellelin Using Information:
  37. 37. Let’s Bookmark @adellelin
  38. 38. Open Tabs / Open Tabs / Open Tabs
  39. 39. @adellelin
  40. 40. Picture of space Things could get messy... @adellelin
  41. 41. What form should data take? @adellelin
  42. 42. @adellelin Shoebox, Evidence file, Schema
  43. 43. @adellelin
  44. 44. @adellelin
  45. 45. @adellelin
  46. 46. Draw from Metaphors that work for your application @adellelin
  47. 47. Mixed Reality Design Assessment Tool @adellelin
  48. 48. Amorphous system + Familiar environment + General context → User Experience can be more interpretive Structured system + Foreign environment + Specific context → User Experience might require more directiveness @adellelin
  49. 49. Relational Context @adellelin
  50. 50. Context towards specific Users required expertise in evaluating art Would be marketed Is a minimum space requirement @adellelin
  51. 51. System / Interactions @adellelin
  52. 52. Many invitations to interact Multimodal interaction Soft rules for exploration Non-linear approach to site @adellelin
  53. 53. Environment Design @adellelin
  54. 54. Artist studio as a generally recognizable space Using foreign concept of desk as navigation bar Using lighting to indicate activation @adellelin
  55. 55. @adellelin
  56. 56. Structured system + Foreign environment + Specific context → User Experience needs to be more directive Making an Assessment @adellelin
  57. 57. User Experience @adellelin
  58. 58. Keep objects just below eye height More text explanation Lobby explains main features Iconography simulating real life @adellelin
  59. 59. Rick and Morty combiner @adellelin
  60. 60. Thank you! @adellelin