Understanding Typography
After reading this article by Michael Gilbert from Material Design. I wanted to apply some learning to the spatial medium. I was exploring spatial sizing in my previous article.
Before we dive into sizing, here are some best practices that I came across when researching this topic,
Font Size
Let get to the sizing part I found details about typography sizing on Hololens documentation and Nreal.
Pixel is not an appropriate way to understand spatial sizing let's convert it into a spatial unit.
14px is approximately equal to 3.704167mm. (1px is 0.26458333333719 mm)
Tools Used: Figma, Vectary, AR compatible smartphone
Step 1: Creating the interface
Create your mobile app interface on the Figma. For this example, I used a plant shop template from figmacrush and tweaked it out a little bit.
Add a call to action to trigger the AR workflow, here I added a view in the 3D button so the user will be able to see the plant in the real world.
Step 2: Creating the 3D model on the Vectary
You can import the 3D model or create one yourself in vectary. For this example, I am using a free 3d model.
😷🧴👏✌️
Last year I started writing year end notes as reminder to myself about the things that happened in the year.
After a productive 2019, I had no clue that 2020 would be a unique year that would turn the whole world upside down. For 2020 I planned to rethink what I was spending time on earlier to more strategic. One of the plans was to make my community contributions more effective; I was planning to move the events I organize more into digital format to reach a wider audience and also to make it stay longer. …
Understanding 3D Coordinates and Content Positioning
Previous articles in the series,
Part 1: Understanding Spatial Sizing
Part 2: Understanding Movement
Part 3: Diegesis theory
Part 4: Understanding Color
Part 5: Understanding Input Methods
3D Coordinates
There are three main elements, the user, environment, and content in an augmented or mixed reality. The position of the content plays a major role in the immersion and experience. To understand the position in three-dimensional space, we need three values expressed as x, y, and z-axes of the coordinate frame. Each of these 3 axes is orthogonal to each other.
For positioning the content, the AR/MR devices use 3D coordinate. It can either follow a left-handed or right-handed coordinate system.
There are three types of co-ordinate system which makes this work,
World Co-ordinate (World Space)
The world co-ordinate is a fixed reference frame…
To the era of Augmented World.
Computers are considered to be one of the important inventions that changed human history along with other inventions like fire. It’s not the fire, but the control of fire by early humans was a turning point. Similarly, innovation on how we interact with computers played a vital role in its evolution.
Human-Computer Interaction has been a buzzing field right from its beginning from the days of command-line interface (CLI) to the current natural user interface (NUI). Though we call it Human-Computer Interaction, Computers have been put first ignoring human abilities for a long time. …
Extended reality (XR)
Immersion in XR is dependent on how natural the interaction is with the extended world. Both GUI and NUI based input methods are used in XR. Standard input methods include speech, gaze, gesture, and controllers.
Gaze
The gaze is a fundamental input method in XR. It is closely related to the way we interact with computers using a mouse by moving a cursor. In XR, a gaze pointer is used to mimic the functionality.
Gaze can be divided into two Head Gaze and Eye Gaze.
In eye gaze, the movement of the eye is measured and processed to understand where…
Understanding Input Methods
This is part of a series on Designing Spatial UI,
Part 1: Understanding Spatial Sizing
Part 2: Understanding Movement
Immersion in XR is dependent on how natural the interaction is with the extended world. Both GUI and NUI based input methods are used in XR. Standard input methods include speech, gaze, gesture, and controllers.
Gaze
The gaze is a fundamental input method in XR. It is closely related to the way we interact with computers using a mouse by moving a cursor. In XR, a gaze pointer is used to mimic the functionality.
Extended reality (XR)
Before diving into colors in XR space, we should understand three elements necessary for us to perceive color light, vision, and object.
💡 Light
The visible light is the small part within the electromagnetic spectrum that human eyes are sensitive to and can detect.
Understanding Color
Before diving into colors in XR space, we should understand three elements necessary for us to perceive color light, vision, and object.
💡 Light
The visible light is the small part within the electromagnetic spectrum that human eyes are sensitive to and can detect.
Prototyping tools for Augmented Reality are still in their early phases when compared to other mediums like web or mobile. To help beginners to prototype quickly to test their user flow or to demonstrate a concept. Here is a hack to use the existing tools which designers are familiar with to prototype for the new medium.
Before getting into prototyping for AR, we should know how colors behave in the new medium. Traditional UIs have a vibrant color palette, ranging from black to white and the millions of color in between. In optical see-through displays, there is a relative disadvantage…
