Overview
Ancient Jewelry is a web application that uses augmented reality to let users try-on ancient jewelry virtually. This project was aimed at enhancing the experience of Eskenazi museum visitors. While this app lets users interact with ancient jewelry, it also educates them about the jewelry, fostering a sense of appreciation for ancient art. The client was Sidney and Lois Eskenazi Museum, which is an art museum in Bloomington, Indiana.
How might we
- help museum visitors appreciate and understand ancient objects
- give visitors a fulfilling museum experience
The design process
Key insights from research
Intricate details on objects often go unnoticed due to the way they are exhibited.
Information about objects generates appreciation for the objects
Content on museum plagues is inadequate to satisfy visitor's curiosity
The Solution
Wear the jewelry virtually
Virtually wearing the ancient jewelry
fosters a sense of control and creates an
impression of being in close proximity
of the jewelry. This imparts a sense of
empowerment leading to a fulfilling and satisfactory experience.
Learn about ancient times
Learning about ancient objects induces empathy towards ancient people and
this fosters appreciation for the objects
among the users.
Impact
Ancient Jewelry was selected amongst 10 other projects to be further implemented by the museum. The project was highly appreciated by the museum directors and curators.
"This feels like it will take the museum far ahead. I know museums have been trying to introduce interactivity I am happy that we are able to do it far before"
- Museum Director
"So many people have asked me if they can try on the jewelry and now it is possible"
- Museum Curator
Lets look at the design process !
Understanding the museum's needs
We worked closely with the museum leadership to understand the problem space from their point of view. Interviewing the curator of the ancient art section gave us insights into their needs and expectations.
Key Findings
Museum objects are not just ‘pretty things to look at’
Curators want the visitors to understand the significance and the history behind museum objects. They try to convey this through the arrangement of objects and museum plaques. They however expressed a sense of disappointment as visitors think of museum objects as just 'pretty things'.
Making intricate details noticeable versus protecting the objects
In order to keep the artifacts safe and avoid visitors from touching it, they are kept in glass cases. Curators have tried various ways of bringing the intricate details on the artifacts to the visitors eye, but don’t find the results to be satisfying.
“Even though I have kept a magnifying glass in front of one, the details are not visible”
Observations and Interviews at Museum
We visited the museum and conducted an observational study. Through this study we tried to understand the behaviour or the museum visitors. We also conducted impromptu interviews with the visitors to identify factors that affected their museum experience.
Arrangement of objects
limits visitors from having
a fulfilling experience
Information generates
curiosity and appreciation
for museum objects
Visitors find the information
on plaques to be inadequate
to satisfy their curiosity.
Visitors do not want to spend
all their time in one particular
gallery or at one object
Connecting the dots
Why interaction and information ?
Interaction with object
Induces empathy
Fosters empowerment
Personalizes experience
Information about object
Gives context
Feeds curiosity
Fosters appreciation
Next, we looked at exemplars
The team documented and analysed a number of exemplars of how museums across the world were using immersive technologies like AR, VR and MR to engage their visitors. We also read online reviews about these exhibits to know if users enjoyed them and why.
Key takeaways
- Gadgets required for immersive experience determine the kind of audience it attracts and engages.
- Displays that allow more than a single user to engage at a time (either on a common device or their personal device) gain popularity.
- Space availability plays a major role in museum context.
A few of the exemplars we collected
National Museum Singapore
Visitors can interact with the
animated wildlife through an app.
England's Historic Cities
The application aims to give users
a tour of some of England’s cities.
Isabella Gardner Museum
Hacking the heist : This exhibit uses AR
to digitally put back 13 pieces of art
that were stolen from the museum.
Franklin Institute
Terracota Warriors : Showcases
how the terra-cotta sculptures
looked thousands of years ago.
Identifying constraints
Limited time at museum
Visitors cannot be occupied with gadgets during all their time at the museum
Limited space in museum
Limited space between museum objects would obstruct free movement
Concepts and Iterations
The team came up with a few concepts that could address the problem space. We filtered the concepts based on some constraints like - technical feasibility, time required for development, space required for the experience etc and decided to go ahead with two concepts. I then made sketches of these two concepts on cards and used them along with pictures of the artifacts as probes to conduct interviews with participants.
Initial concepts
Information about objects is disclosed as vistors interact with the object
A digital jigsaw puzzel of paintings on objects that visitors put together.
Augmented Reality clues help visitors locate objects in the museum
Visitors see AR videos of stories painted
on pots after scanning the objects
Visitors virtually try-on ancient jewelry exhibited in the museum
Shortlisting the concepts
Getting user feedback
After shortlisting two of our concepts we created what-if cards that explained these concepts and illustrated them. I used these cards as probes to gather feedback from the users. This helped me understand what excited the users and if the concepts could attract a wide range of users
We created what-if cards
Key findings
- Virtual try-on attracted a wider set of audience in terms of gender and age
- Participants did not find any novelty in AR videos and hence were not attracted to it
We decided to go ahead with virtual try on because
- The concept aligned with our goals
- It was perceived as an exciting idea by participants
- It attracted a wide range of audience
Low Fidelity Prototype
Set-Up for Low-fidelity Testing
A low fidelity prototype was tested with 6 participants. Since we were not allowed to test in museums we created a museum-like set-up at our testing site.
Iterations
Revising the information
We revised the information being provided and presented it in on a card as the earlier version seemed to overwhelm the users due ot too much text.
Rotation and zooming function
Users expected other ways of interacting with the jewelry. They tried to rotate and zoom into the 3D models. Not being able to do this caused frustration and hence we dec died to add this function.
The Covid Curveball
Due to the coronavirus pandemic, we were prevented from visitng the museum and so were our users. Due to this we had to make some chnages in our design.
In-Museum Experience to remote experience
Due to the lockdown, the museum asked us to adapt our designs for a remote audience so that the users can enjoy tha AR experience from their homes itself. We decided to adapt the design in such a way that it could be easily turned into an in-gallery experience, post lockdown. Since the user’s would no longer be visiting the museum we needed a way of providing them with a target that could lead them to the AR experience. So we decided to include a website which would introduce the users to the AR experience and also provide them, with a target for scanning and lead them to the Ar experience.
Photogammetry for 3D models to Blender and Sketchfab
Since creating 3D models using photogammetric methods was no longer possible as it involved taking 100 to 1000 picture of a single jewelry piece we decided to create 3D model in blender. For the jewelry items that were very incricate and were very difficult to create in blender we purchased simial looking models from sketchfab and used them as placeholders
High Fidelity Testing
The next round of testing was conducted with a high fidelity prototype. Since we decided to go for a remote AR experience, we decided to introduce a website. We provided the URL of this website to our participants and asked them to explore it freely.
Iterations
Buttons
Earlier design and placement of the buttons hindered the user's view when they were trying on the jewelry and did not contribute positively to the experience when the front camera was turned on. I iterated on the design of the buttons to make it more synchronous when the front camera was turned on.
Card design and placement
The card displaying information blocked the user's face. We redesigned the card and placed it at the bottom. I also added a next button so that users can view more information if desired.
Iterating on the color palette
The color palette used earlier was perceived as dull and old by the users. I iterated on the color palette to choose colors that looked modern and were yet suitable for a museum experience. The new color palette was inspired from IU's brand colors since we were designing for an on-campus museum.
Other changes implemented
Shifting to WebAR
The users were earlier required to download Zappar app for the virtual try-on. This however proved to be chaotic and was bad for the user experience, hence we shifted to Web AR.
Better snapshots
Buttons and other UI elements were eliminated from snapshots as they hindered the user experience during as well as post interaction with the web AR.
The users said ...
" It is cool to see yourself in these pieces in real time. It is amazing how ancient people managed to create
such details without any sophisticated tools."
" It is like looking in a mirror. I loved trying on the jewelry and would love to try on some more"
The final design
Reflection
- New constraints : Working on a project for a museum was a new and exciting experience as it meant designing with constraints that we had not dealt with before.
- Adapting design to overcome unexpected circumstances : Due to the covid-19 pandemic, I learnt how to adapt methods and the designs to meet the requirements of a changed scenario in a short span of time.
- Working around technical issues : I faced a lot of technical issues while testing the designs as the prototyping platform stopped working. I had work around these issues so that the team did not waste the time we had scheduled with our participants. This helped me understand that I need to be prepared to overcome technical issues and have a plan B ready beforehand to work around them.
Overview
Academic planner is a web-based platform designed for students in the online DS program at Indiana University. This system helps students to understand their degree requirements, browse through available courses and plan what courses to take depending on their academic needs and career goals. This project was sponsored by Luddy Office of Student Engagement and Luddy Office of Online Education at Indiana University.
The Challenge
- Streamline the process of selecting academic courses
- Provide a reliable way of gathering accurate information about courses
The design process
Key Insights from research
The process of browsing & selecting courses is confusing
& troublesome due to the student's busy schedule
Workload, assignments, exam requirements and career goals are majorly considered parameters while selecting courses
The information currently available to students does not support decision making regarding enrollment.
The Solution
# Feature 1
Students can track their courses using the platform
Students can track their degree progress and search for new courses. Course search enables students to search courses according to time, topics and goals, which are the most prioritized considerations.
# Feature 2
Course search that filters courses according to time, topics and career goals
Course details like pre-requisites, exam or assignment types, textbooks required and instructor name enables the students to make a decision regarding enrollment. Students can also add courses to a wishlist.
Let's dive into the process !
Initial Interviews
I interviewed the staff of the office of online education at IU to understand the major problems they faced with respect to the online data science program and to get a client perspective on the existing problem space. I also conducted 4 remote exploratory interviews with the students that helped the team understand the major concerns students had with the program.
A number of problem
spaces were identified
I decided to focus on
Academic Planning
Why academic Planning ?
Academic planning was a repeated pain-point during our initial research.
Streamlining academic planning would be helpful for more than one stakeholders.
Interviews and Survey
In order to dive deep into the area of academic planning I conducted 6 remote interviews with the students. These interviews helped me identify their pain-points and how they were currently navigating the situation. The interviews also helped to identify what considerations they made while selecting academic courses. In order to verify if these considerations were applicable to a larger audience, a qualtrics survey was sent out.
Online workshop
I planned and facilitated an online workshop with the staff of online education. The goal of this workshop was to map student's problems with the that of the staff's. The workshop also helped me understand the constraints we could face in the future.
I collaboratively created a virtual diary using google slides with my team for the participants. The dairy listed paint-points that the team had identified during earlier research. The participants were asked to draw or write about any solutions they thought would solve this problem and also note down the challenges they thought could hinder implementation of the solutions. Participants were given the flexibility to use pen and paper to sketch out their ideas and then paste their pictures in the virtual diary. The participants were given a week to complete the diary. An online workshop was conducted during which the staff discussed their solutions and also gave feedback on ideas by other staff members.
Pain-points of the students
An added task in a busy schedule
Course search is an added task in the student’s busy schedule as
they are working professionals managing work, academia and family.
Insufficient and scattered information
Finding courses that match their goals is time consuming as the information available to them is insufficient and scattered across platforms.
Academic, personal and professional commitments
Taking courses that do not match their time availability results in sufferance of academic, professional and personal commitments during the semesters.
An added task in a busy schedule
Course search is an added task in the student’s busy schedule as they are working professionals managing work, academia and family.
Insufficient and scattered information
Finding courses that match their goals is time consuming as the information available to them is insufficient and scattered across platforms.
Academic, personal and professional commitments
Taking courses that do not match their time availability results in sufferance of academic, professional and personal commitments during the semesters.
Pain-points of the client
Too many students
Helping a large number of students to identify courses depending on their separate needs and goals is a difficult task for a 2 member office.
Tedious process
They have to gather information from professors and career services while helping students. This makes the process tedious for them.
Too many students
Helping a large number of students to identify courses depending on their separate needs and goals is a difficult task for a 2 member office.
Tedious process
They have to gather information from professors and career services while helping students. This makes the process tedious for them.
How are students navigating the situation?
1. Social Media Groups
Students create social media groups to exchange information about the courses they have taken or wish to enroll.
Problems Associated
- Not all students use social media
- Information exchanged could be inaccurate
- Since the students are not very familiar with their peers due to online environment, they are not comfortable asking them all the questions they have.
2. Orientation Material
Orientation material is a set of information provided to the students when they first enroll in the program. It provides information about their degree requirements.
Problems Associated
- Text heavy information that students do not read through.
- Students engage with the content only once and forget about it later.
3. University Portals
The university website and another platform called iGPS provides a list of courses and some basic information about the courses available to the students.
Problems Associated
- Insufficient information that does not support decision making about enrollment.
- Information distributed across different platforms.
User Persona
Age : 35
Product Manager
"Identifying courses that match
my goals is very frustrating even though I do it every semester"
Lisa Stegall
About
Lisa is a student at IU, enrolled in the online MS in DS program. She is in her 3rd semester and plans to graduate in the next two years. She is a Product Manager at Maxim. She has to juggle her studies, along with her job and her toddler son.
Goals
Take courses that help her get into a technical role after graduation.
Get knowledge about the most important data science topics.
Identify courses that are not time demanding.
Ensure that she takes courses that fulfill her degree requirements
Meet her personal, professional and academic commitments.
Pain-points
Course information available is insufficient.
Finds social media interaction with fellow students to be irrelevant
Reaching out to course advisors is time consuming.
User Journey Map
Considerations made while selecting courses
Time
Being working professionals, students can dedicate limited time to academia. Hence, time required for working on a course is a major consideration.
Career goals
Students have specific career goals that they wish to achieve after they graduate. These goals determine the topics they wish to study and hence the courses.
Degree requirements
Students need to fulfill degree requirements but find it difficult to understand or keep forgetting about them as they complete their degree over a few years.
Time
Being working professionals, students can dedicate limited time to academia. Hence, time required for working on a course is a major consideration.
Career goals
Students have specific career goals that they wish to achieve after they graduate. These goals determine the topics they wish to study and hence the courses.
Degree Requirements
Students need to fulfill degree requirements but find it difficult to understand or keep forgetting about them as they complete their degree over a few years.
Why Streamline Academic Planning?
Students have specific goals
They do not meet their goals
And feel
disappointed in the course
When they take wrong courses
Disappointment in
the courses
leads to
Disappointment in
the program
leads to
Disappointment in
the University
Defining the goals
Empowerment
Empower students to plan their courses without being dependant on others
Reliability
Provide information that is reliable and builds trust
Cohesiveness
Provide a cohesive experience for obtaining information and making decisions
Reduced Workload
Reduce the workload on the Office of Online Education
Empowerment
Empower students to plan courses without being dependant on others
Reliablility
Provide information that is reliable and builds trust
Cohesiveness
Provide a cohesive experience for obtaining information and making decisions
Reduced Workload
Reduce the workload on the Office of Online Education
Concept sketches
The team brainstormed a number of features that could be a part of the academic planner. The course search feature was finalized as it matched the project goals. The team also brainstormed about what information the academic planner should be providing.
Course feedback
Course search
Career tracks
Course and degree FAQs
Testing with low-fidelity prototypes
I created low fidelity prototypes of th academic planner and tested them with 4 participants. The participants were given tasks and asked to 'think aloud'. Based on the feedback, changes were made to the existing design.
Home
Version 1
Version 2
A progress bar was added to convey the progress of course credits
as simply listing courses taken by a student was insufficient to convey it.
A ‘find course’ button was added as users wanted to explore courses
specific to a particular degree requirement.
Course Search
Version 1
Version 2
Search courses was replaced with a button to display all courses
since users preferred the option to view all courses at once.
A dropdown was more suitable for career goals than a text input as
students wanted to enter specific career goals.
Course List
Version 1
Version 2
Going back and forth to change the selection criteria caused frustration
among the users, hence filters were included on the left side.
Wishlist
Version 1
Version 2
The term short-list was replaced with wishlist because it was a
more acceptable and intuitive term for users
Remove button on the course card proved to be distracting for
the users and also added to the content on the cards. A remove
items button was included for the wishlist page
Testing with high-fidelity prototype
The high fidelity prototype was tested with 8 participants. Users were given tasks to complete and had to answer survey questions after the task. The tests were moderated which helped us exactly identify the points of frustration.
Home
Version 1
Version 2
Users confused course streams with course names. The terms
on the home page were re-framed to eliminate this confusion.
Different categories of degree requirements are explained to
help users understand them better.
Course search
Version 1
Version 2
Users wanted to take a look at all available courses first and
then filter them according to their needs, instead of filtering
from the beginning. Hence, the course search page was
redesigned to display all available courses with filters on the side.
Card on course search page
Version 1
Version 2
Users did not add courses to wishlist until they had looked at
the course details. Placing 'add to wishlist' button on the card
was redundant and also distracted the users, hence it was eliminated.
Chips displaying topics were perceived as interactive elements,
by the users. Topics were presented without the use of chips to
eliminate this confusion and also to accommodate larger topic names.
Course details
Version 1
Version 2
Course and class number were placed along with semester,
workload and stream, as the earlier information grouping was
found odd by the users.
Students want to know what topics other than the ones selected
in filters are covered in a course. This information was added to the page.
Card on wishlist page
Version 1
Version 2
Users wanted the option to edit earlier notes, hence this option was added to the cards.
The final design
Home
- Home page allows users to track earlier courses and learn about the degree requirements.
- Degree requirements have been divided into categories for easy understanding.
- Progress bar conveys the progress of credits.
- Find course button for each category facilitates course searching for that category.
Course Search
- Course search allows users to view available courses and also search courses that meet their needs.
- Courses are initially categorized according to different streams like ML, AI Statistics etc.
Filters
- Workload, topics and career goals are given major consideration while selecting courses and hence filtering courses according to this criteria is desired buy the users.
Course details
- Course details provides information like.topics, skills gained, pre-requisites, exams etc. This information is helpful for users to make a decision regarding enrollments in the course.
Wishlist
- Wishlist enables for easy enrollment as users can easily access course information without having to search for them again.
- Adding noted to the wishlisted courses helps students remember what they had liked about the courses.
Reflection
Collaborating with the client
Since this project was sponsored by IU, it was very important to keep the client in loop while designing. Throughout the project I schedule meetings with the leadership during which I would present the progress of the work and provide rationales for the design decisions and directions. This greatly helped in getting their perspective and feedback and the designs. It also helped in obtaining the necessary permissions for using resources.
Collaborating with the developers
Developers should be kept in the loop throughout the design process. Following this strategy greatly helped in getting feedback on the feasibility of our designs. Which further helped us to prioritize the features. Collaborating with developers required me to speak a very different language than I normally speak while collaborating with designers. It became important to learn the terminologies used by developers.
Overview
This is a brief story about my learnings during my summer Internship at Raise. Raise is a startup that aims to provide solutions for employee engagement. Since the product was completely new I got to work on different versions of the product and take up different responsibilities for each version. This resulted in a summer packed with learning , meeting amazing people (of course - online) and taking my research and design skills to the next level.
My contributions during the internship
The product's release had 3 versions - MVP (Version 0), Version 1 and Version 2. My contribution involved testing the MVP, designing user flows, wireframes and mockups for version 1 and conducting research and conceptualizing features for version 2.
User Research
The goal of the research I conducted was to understand how companies look at corporate social responsibility (CSR), what activities are associated with it and how do they support their employees for CSR activities. Based on the goals for the research I created a revised set of questionaire for interviews. I recruited and interviewed 6 HR professionals and 4 employees from different companies. I coded the interviews to identify patterns and pain-points. After generating insights I collaborated with version 2 team to conceptualize a feature set and create a user flow . We finalized the user flow after iterating several times based on the feedback from other teams and the product head.
Usability Testing
I worked alongside the MVP team to establish the goals for usability testing. I then created a guide for moderated usability testing. The guide contained user tasks, what the researchers should observe and what questions to ask the users. I conducted 4 moderated tests .
The usability testing guide created by me was then adapted to suite unmoderated testing by the team. We uploaded the prototype as well as tasks and questions on a platform called maze to conduct the un-moderated testing. The team collaboratively recruited participants and conducted 20 unmoderated tests.
I analyzed the results of both moderated as well as unmoderated testing to identify and suggest UI changes.
Designing wireframes and mockups
I went through the earlier research documentation in order to understand the features I was going to design for version 1 and why to design them. The team collaboratively created the information architecture for the feature set.
I was given the responsibility to design one feature. From creating wireframes to the final mockups, the process involved taking continuous feedback from other designers and other team members and iterating on the designs. The team also conducted an experimental design activity in which we adapted our designs to another comnpany's brand to see if we could customize our user interface for clients in the future.
We adapted our designs to another brand as an experimental design activity.
My learnings from the internship
1. Ask questions at the right time
To be in sync with the team, it was very important for me to understand the company’s product and also understand where the team was in the product cycle. During my first week of the internship I was baffeled while trying to get an understanding of this. I had infinite number of questions and was kind of nervous to ask them. But I realised that if I did not ask those questions then and there, I would never be able to get to where the team was. So I made it a point to ask those questions. I was lucky that my team members were happy to answer questions for me and get me at the same page as them. I also realized that going through the teams’s earlier work would speed up the process of getting on the same page with them. I went and reviewed all the available documentation and I was able to get in tune with the team much sooner than I thought I would.
2. Speak up and go that extra mile
Working at Raise involved working alongside Senior designers, product managers, and product head. When I began the internship I had a lot to say, but was scared to say it since I thought that being an intern my opinion would not be valued. But being the chatter box and the inquisitive person that I am, I shared my opinion anyway. In fact at one point I went ahead and volunteered to create a usability testing plan. When I presented the plan along with user tasks and questions, the team appreciated my work and I was given the responsibility to execute the tests too. I realized that it did not really matter that I was an intern or someone senior. We had to work so fast that it was important for me to stay proactive, take up reponsibilities and not sit ideal waiting for work to be delegated to me. At the end of my internship, during my feedback session, the product head appreciated this quality and it boosted my confidence.
3. Don’t be married to your designs
One of the biggest strenghts for a designer is to be able to accept flaws in their designs and quickly iterate on them. Being a designer, I was always ready to iterate on my designs based on feedback from colleagues. As a user advocate I was able to rapidly iterate on my designs based on the flaws identified during testing. During my intership at Raise the senior management decided to bring about some changes in the product as new market requirements were revealed and they decided to rebrand. Even though the source of these requirements was not user research or user testing, these factors were very important for the success of the product and for providing a good user experience. I had to embrace these changes, iterate on a few of my designs, throw away a few and design something completely new. These not just involved wireframes and mockups, but also involved conceptualized feature sets.
4. Multitasking with multiple hats
Working at a startup requires you to wear many hats. Even though I was a UX reseach intern, I was required to design too. When I was being asked to create wireframes and mockups, I was initially a bit confused since I thought that I was supposed to focus on user research. But the product requirements were such that I was required to design too. I did it happily and it helped me learn one of the biggest lessons of my life — multitasking. The product had 3 versions and the design sprints had been planned such that I was required to test one version, design wireframes and mockups for version two and conduct user research for version three. Since all of this was happening parallelly, my work pace had to be rapid and I learnt to manage time and tasks efficiently. I did not just learn to work at an accelerated speed but also learnt to deliver quality work at an accelerated speed. It was difficult in the beginning, but very soon I developed a zest for it and started enjoying it like joyride.
