Lesson Planning Guide for Mobile AR Design

About this document:

The intended audience for this document is educators, trainers, and presenters interested in developing everything from short presentations to multi-session lesson plans that teach the basics of 3D design and, in particular, mobile AR.

The audience for such trainings is designers, design students or anyone who possesses a basic understanding of traditional 2D mobile app design concepts, tools and workflows. No 3D experience or knowledge is required. 

Goals:

  1. Impart the message: Digital product and UX designers already possess most of the skills necessary to prototype in 3D. 
  2. Familiarize designers with the concepts underpinning 3D design link them to 2D design concepts. Attendees of a training should leave with a clear understanding of 3D-specific design considerations.
  3. Get 2D designer comfortable working in 3D as soon as possible to demystify the medium. Trainings and lessons should involve some hands-on or practical components. Torch AR is available for free on most iOS (Apple) devices.

Assumed Prior Knowledge

  • Design tools - some familiarity with Sketch or Adobe Creative Cloud suite.
  • Prototyping tools - basic familiarity with the role and function of tools like InVision, Figma, Marvel and others.
  • Digital Design Fundamentals
    • UI Basics - best practices for designing applications, especially mobile apps
    • UX Basics - a basic understanding of user experience design and the role of prototyping and gathering user feedback
  • Composition
    • Color theory
    • Typography
    • Layout

Basic Skills Development

Encourage students to  download Torch AR or other 3D prototyping tools beforehand to create accounts and begin to experiment. (Torch AR currently runs on ARKit-capable iOS devices only. Torch sponsors formal classes, trainings and meetups in many ways, including providing iPads for students. Get in touch if you are interested.) 

Concepts

  • Augmented reality means designing in the camera:
    • Key Concepts - it is important to establish the importance of the camera image as a first-order part or "layer" in the design (along with the "screen-locked" and spatially placed layers):
      • Keep UI elements off the screen as much as possible to keep camera view clear.
      • The camera view becomes another layer in the design. Location, environment, and 
      • Blog post - more conceptual but gives presenter grounding
  • A 3D Primer for Screen Designers:
    • Key Concepts: there are three major conceptual themes to stress for designers new to 3D:
      • The Z-axis and the implications of the introduction of a third value to coordinate space for designers used to only working in the X and Y axis
        • Occlusion
        • Parallax
        • Translation
      • 3D assets, their characteristics, and the current lack of standards
        • 3D Models -types and sources (e.g. Google Poly, Sketchfab and TurboSquid)
        • Mesh
        • Materials (or textures)
        • Lighting
      • 2D assets have an important place
  • Google AR Design Guidelines
    • Top messages to stress: 
      • Encourage movement and exploration
      • Make allowances for differently abled users
      • Keep user safety in mind - stress environmental awareness
    • Highlights can be found at our blog.

Hands-on Skills

For an initial training, you should encourage students to experiment in 3D. This is the fasts way to demystify the medium. The following are basic hands-on skills.

  • Placing 3D object in 3D
    • Freeform Manipulation of object(s) - use freeform gestures to modify the size, rotation, and position of the object.
    • Modify an object's properties
      • Size
      • Position
      • Color
    • Encourage and create a Sketchfab account
      • Using Creative Commons-licensed models
        • CC licensing has different levels
          • request for attribution is common
          • Respect artists by giving attribution
      • Import your own assets (Sketchfab and 2D assets via upload from device)
  • Placing 2D object in 3D
    • Freeform - use freeform manipulation to modify a 2D object's position, rotation, and size.
    • Modify a property/behavior
      • Face Camera
  • Using Interactions to create engaging designs
    • Add a simple behavior
      • Tap the object to make it spin.
      • Tap the object to make it change colors
  • Experiment with parallax
    • Make a 3D object extremely big and put it 30 meters away using object properties
    • Try to walk around it

Advanced Skills - Projects 

Any of these projects can be started as part of an advanced skills curriculum. Each focuses on using interactions to demonstrate a common augmented reality use case. (Suitable for 45 minute or longer session.(

Still need help? Contact Us Contact Us