"Where are my glasses?"
In our HCI course, we were tasked to work towards a solution throughout the semester with the theme of "Internet of Things". With this in mind, my group and I juggled a few ideas around until we decided to solve the problem of losing or misplacing glasses. In order to design a solution that fit within the theme of "Internet of Things", we looked towards products such as Tile for inspiration.
Our initial solution – before conducting any research – was a pair of glasses which have a Bluetooth tracker in them that can paired with a companion app which can be used for tracking. I was put as the lead on the design of the app, but everyone in the group had a hand in every part of the design.
Our initial glasses design had a Bluetooth radio built in to communicate with the user's smartphone, lights on the outside of the glasses which could be used to help find them in dark environments, a speaker to help finding the glasses using auditory cues and a QR code for easy pairing to the app. The glasses did not have any other "smart functions" on them like a camera, a way to check notifications, or the ability to control music. We wanted the glasses to not be more than a regular pair of glasses and to blend into everyday life. This would also allow the physical build of the glasses to not stand out as "smart glasses" and would make the pair more desirable to wear compared to other smart glasses like Google Glass. The glasses would come with a case which would be used for charging. To charge, the glasses would plug into the case with a port on the inside of the glasses which connects to a plug inside the case. The case itself would be connected to a power source via USB.
The app would be the main place for users to interact with the search features of the glasses. From the app, you could add pairs of glasses, view location history, locate the glasses and manage a friends list of other users that were a part of the service. We also considered a feature dubbed as Glasses Hunt which would track the position of a user’s glasses in relation to their body – such as when they wear their glasses and when the glasses were off their person – to better help them better track their glasses based on patterns in their actions.
Research and Understanding our Users
With an initial design idea in our minds, we set out to research users to better understand their needs and refine our initial design. Our research consisted of a combination of observations of glasses users and interviews with glasses users. We limited our focus to glasses users, but we considered people who wear glasses all the time and those who only wear glasses a part of the time (e.g. sunglasses users).
We all conducted observation sessions at other classes with a lot of students at UTM. We looked at how students would interact with their glasses during a class. Many of the students in the classes we observed did not wear glasses, but among the glasses users in the classes, we noticed that most students would wear their glasses the throughout during lecture as they probably needed them to see. We noticed some unique behaviour with some glasses users, such as keeping their glasses on top of their head (i.e. not using them to see) and taking their glasses out of the bag as they only need them for reading.
We also all conducted one-on-one interviews with several glasses users. I interviewed five glasses users and focused on the following topics:
- Where they typically store their glasses
- How often they worry about losing their glasses
- A story of them losing their glasses
- Whether they would consider purchasing glasses with a built-in tracker
What surprised me the most about these interview sessions was probably the stories I heard about a time they had lost their glasses. Many of the stories boiled down to the user forgetting about the glasses before leaving a certain place. A couple users were not able to retrieve their glasses in their stories. Most users kept their glasses in a case when they’re not being used, except for one user who would hang the glasses on the railing of their bed.
Among all our interviewed subjects, we discovered that most glasses users would keep their glasses near their bed or their desk. Part-time glasses users are less worried about losing their glasses compared to full-time glasses users. There were also a few full-time users who don’t worry about losing their glasses because they wear them often. Most of our interviewees lost their glasses within plain sight, but we heard stories of glasses being stolen or lost while on a trip. Most users would consider purchasing a pair of glasses with a tracker in them, but there were a few users who wouldn’t consider them at all as they do not typically lose their glasses.
With our research about our users finished and gathered, we went back to our design to update them based on our findings.
We did not change out glasses design much from our initial design. We only made the frame thicker to make sure that we could fit all the electronics.
Our app underwent a bit of a reduction in terms of scope. We dropped Friends and Glasses Hunt and considered them out of scope for this project. We had a History section on the main level of the app that would show a cumulative location history of all the user’s glasses paired to the app but decided to get rid of that in favour of per glasses history.
As lead of the app's design, I opted to go design an iOS app for this project. While I do not own an iOS device, the other group members owned an iPhone and I knew that designing an app that followed iOS guidelines would help them and other iOS users navigate our app when it came time to test the design. This also gave me a chance to learn and understand the iOS design guidelines, which I was not as familiar with compared to the Android/Material Design guidelines.
Initial App Mockups
The home screen is where users see all their glasses in a list. From here, users can add a pair of our glasses, take a look at notifications and go to app settings. Once glasses were populated on the home screen, the user can quickly ping their glasses with the icon on the right side inside the list item.
If the user adds a pair of glasses, we guide them in a step by step process through both of the available pairing methods: QR code scanning and Bluetooth.
Each pair of glasses has a details screen showing the current location of their glasses in relation to them. Users can quickly "ping" their glasses up if they are within range of the user's device, view the location history of the glasses or manage hardware settings such as the volume of the speaker and the brightness control of the lights.
Users can also share the last known location of the glasses to other users through the operating system's native Share feature and access a feature known as "Community Search". Based on Tile's Notify When Found feature, if another Spec Detect user passes by the the original user's glasses that have been misplaced beyond the detection range of the device, Community Search will notify the user when the other user passes by with the approximate location of where the ping happened. The other users are kept anonymous for privacy reasons.
Notifications from the Community Search feature will appear in the Notifications tab. Selecting the notification will open up the pinged location in their preferred maps app.
Three classes were spent testing our design with our classmates. We had our classmates run through scenarios of interacting with both the app and the glasses. Those scenarios included the following:
- First time opening the app and first time pairing the glasses
- Adding an additional pair of glasses
- Doing a basic locate of the glasses
- Doing a community search
- Unpairing glasses
- Charging the glasses
We conducted tests using methods such as Wizard of Oz, paper prototyping and high fidelity tests on a smartphone using Figma and Figma Mirror. The hardware we used for the glasses contained no electronics since we do not have access to electronics, nor the know-how to create a working wireless solution. So we used theatre glasses and a spare glasses case to mock our product.
Final Design (for our course)
Our final design consisted of changes we had taken into account from feedback from our testing sessions, as well as an increase in fidelity with the addition of colours and branding for the app. We also came up with a name for our app which he had put off throughout the semester as it wasn't important during the early parts of the design process.
This project represented one iteration of the design process that goes through many iterations before release. The solution I present may not be ideal for shipping as many more iterations would undoubtedly improve the design, but we only had time to go over one iteration.
Final Glasses Design
Our glasses and case went through a lot of redesign throughout the testing. Users mentioned that charging was not intuitive and confusing. So instead of a cable that plugs into the bridge, we adopted a system similar to Snapchat Spectacles, where glasses has charging pins in the arms and the case has magnetic pins that line up with the pins on the glasses arms when folded. We also moved the QR code from the glasses arm into the case as there is much more room for the QR code to be scanned, making it easier for the phone to recognize the QR code. We also added a charging indicator light at the front of the case, signified by the yellow sticker.
Final App Design
Our app mostly received visual updates with more colours to help highlight important points of interest, as well as improvements to the flow of certain processes based on our testing.
We added labels to the buttons on the home page to help the user understand what the buttons do. We also changed the icon to quickly "ping" a pair of glasses to an icon that made more sense to our users.
We didn't make any changes to the pairing process apart from moving the QR off the glasses into the glasses case as previous mentioned because we found that our users had no difficulty going through the pairing process.
We named the menu with the functions at the bottom of the Details screen the "Assistance Menu" and put the options in a slide up drawer instead of showing them all the time. We found that users would be overwhelmed with all the options being visible at once, so putting them away unless needed was the best action to take.
We made volume settings and LED brightness settings an easy to use slider rather than burying the option in an additional dialog. We also never had a confirmation dialog for unpairing glasses, so we added that to ensure the user does not accidentally unpair their glasses.
We expanded the Get Help functions into a full screen menu instead of overlaying it at the bottom of the Get Details screen. We used placed the iOS share dialog in the screen to demonstrate that the user can share their location just like how they can share other information on iOS. Community Search was turned into a switch after we realized that the user should have a way to turn off the feature should they either find the glasses themselves or otherwise.
We reduced the scope of location history to only include the location history of the current day and renamed it "Today's Locations". Some of our testers cited privacy concerns over keeping an extensive location history of the user's glasses, and we also came to the realization that old location history for glasses may not be relevant to the user.
We added a text blurb if there are no notifications in the Notifications screen to explain what that section is used for, as well as a link to learn about Community Search, which would open the same dialog shown in the Help Menu screen from above. We also added a Clear all button if the user receives a number of notifications that they have no use for.
We added a screen to demonstrate to the user how to charge the glasses. While the charging process is made easier, one of our members suggested we add it to have that information available when the user needs it. This screen is accessed when the battery level gets low on the glasses and the app notifies the user of the low battery warning. Tapping the notification will take the user to this screen.
This was my first experience working from start to finish on one iteration of a design. Looking back as I write this condensed version of the project, there a few changes I'd make to the design now to further improve it. But all-in-all, I'm very happy with how this project turned out. My group members were fantastic to work with and we all put in hard work to create this project. The experience I got from this class would move forward towards my next design project for another class, where I would get the chance to tackle a different problem area and take different approaches to designing a solution.Back to top ↑