Idea Store - IRIS
2023
2023
An interactive system that allows users to improve their language skills, read books in their preferred language and connect with the community
My Role
Main activities
User Research
Interview, Affinity Mapping, Persona, User Journey, SCAMPER
IDEATION
User Journey, Story Boarding, User Flow, Sketching
Design
Wireframe, Prototype, Design System
Usability Testing
First Click Testing, Interview, Data Analysis
IRIS is a product designed for a local library -- Idea Store by a team of 4 designers. In modern life, libraries not only provide books for readers, it can also be a platform to study and socialize with others. In order to find the opportunities which IDEA STORE could bring to users, we researched and created a brand new system called IRIS, which stands for ‘Innovation in Reading and Information System’. It consists of an interactive desk and Augmented Reality (AR) glasses with an Artificial Intelligence (AI) driven naturalistic translation function.
In order to solve these problems with limited resources, we decided to start with some user research quickly and publish the initial version, and then iterate the product based on users' feedback.
Empathizing with Users
"I want to get personalized experience during the interview, so that I can improve and learn from previous practice."
"The interview should be useful for me, but doesn't make me feel stressful."
"One-on-one interview practice is very expensive. As a student, I can't afford it. So I want to spend less money but get the same practice."
Users are able to sign in to the app with the phone number and verification code seamlessly.
AI interview is the most important feature in this app. After setting up the roles and industries, users can start the mock interview, After the interview, a report is available to review.
Users can manage their account information and make payments via the app. Marketing campaigns are also available.
Mobile mini apps can help the product be available everywhere, while from user research, some users prefer using laptop to conduct interviews for best experience. Therefore, we also designed website for Cedars AI.
🎉 The number of users increased 200% in 3 months!🎉
The Process
Firstly, I conducted expert interviews and competitor analysis. Based on the knowledge, I built a domain model. Following with the domain model, I grouped information into different groups and hierarchies. Together with user research by using card sorting and tree testing, I created the sitemap and user journey. Finally, wireframes of key pages were designed.
I conducted two semi-structured interviews with childcare experts, who have more than ten years’ experience of taking care of over 20 babies. From the interviews, I found that several topics are significant in this domain, including health, baby’s development, safety and activities. Additionally, all the topics are closely connected with each other, with participants of both babies and parents.
Following the interviews which provided a holistic picture about issues to consider about childcare, I conducted two more interviews with two experienced parents who have experience of looking after both baby girls and boys. From the interviews, I obtained deeper information on each topic. Moreover, both parents empathised with the significance of accompanying and bonding with their babies, as well as their willingness to share thoughts and experience with other parents. These findings helped me enrich the relationships and nodes in my domain.
Competitor analysis were also conducted reviewed several similar websites, including NHS, Baby Centre, NCT, etc. Although those websites are related to childcare, they focus on more specific aspects for children with wider age ranges. I need to combine different topics and rearrange them for children under 2.
Based on the previous research, I created a domain model, trying to solve those challenges.
I used the common terms from both the websites and my domain model for an unmoderated open card sorting with 5 participants. From the result, I found that although most of the terms were categorised as what was expected, there were still some problems, for example, the word “supplements” caused confusion for some participants because they didn’t know the exact meaning of it. Based on the feedback, I changed the term to “nutrition supplements” to further clarify the meaning.
After sitemap completion, I conducted a tree test with 5 participants to evaluate my hierarchical category structure. Around 80% of the results were correct, except for a question about looking for the information about fever. Some participants were unsure if it refers to a disease or symptom. Therefore, I refined my sitemap by adding a controlled vocabulary search feature as well as faceted navigation in the Discomforts & Illness section.
The interviews revealed that babies’ developments and their activities have a close connection. Therefore, I designed internal links between the two topics (See annotations 2 and 3) to make it more convenient to browse salient information for potential users.
To figure out how the elements of the site flow together, I created the user journey. I tried to find a balance between flexibility and specificity for the user goal. I initially created two paths, including global search and browsing, for users to identify information, and users could also either enter from the development topic or the activities topic to find the information from internal links. On activities results pages, I added faceted navigation to help users narrow down their choices.
Upon completion of the first version, I evaluated it with two potential users. The feedback was generally positive and I discovered further insights. For example, users tend to prefer tailored information that is more relevant for their situations. Therefore, I added another path for the user journey which is logging into “My Account” to see “Recommended Activities” especially for “My Baby”, based on the baby’s age that users saved in the system.
Either too many paths or too few paths might cause confusion for users. Therefore, Idecided to create wireframes with balanced pathways. I created breadcrumbs for each page to help users orient themselves in the site, which makes it more convenient for users to go back to the previous topic pages.
Because of the characteristics of this domain, the information is broad and each topic varies significantly, even though they are all related to how to take care of babies. This makes it more difficult to create appropriate filters, faceted navigation, and search features on each page. Therefore, I tried to use different facets and controlled vocabulary filters to help users find information quickly.
This page is designed under the topic of health, and it is mainly aimed at helping parents choose food for their babies in light of nutritions. Therefore, I added faceted navigation on this page to help users choose suitable age, food types they want to find and the main nutritions the food contains. I also added a sorting feature to help users find the most popular items.
This page is mainly focused on how to enhance babies’ communication development. Because of thecharacteristics of the information, it’s not applicable to have many facets as navigation elements, therefore, Ionly added the facet of baby’s age to help users navigate to development suggestions of their babies’ age. Onthe right side, there are also internal links navigated to suggested activities and toys which help enhance babies’abilities, which could help users find practical knowledge quickly.
This is an activity introduction page, which shows detailed information about what the activity is, the benefits of the activity and recommended resources for this activity. On the right side of the page, I built an area which isconnected with development topics with internal links to help users directly go to development topics to explore more. I also created a section for similar activities recommendation, providing more inspiration for users when they browse the information.
Through this page, users are able to search for activity recommendations suitable to different circumstances.Users might want to narrow down the results from different facets, therefore, I added faceted navigation as wellas a sorting feature on this page to help users find activities.
I conducted the evaluation with three potential users. I observed them complete the user journey tasks, to find a kind of food full of vitamin C as a second task.
Generally the tasks were completed smoothly, however, there were also some findings to help me improve my wireframes.
Understanding users' needs: A seamless journey of reading and socialising in all languages
The physical space
We conducted several observation sessions at Idea Store to obtain a better knowledge of the physical space. We found that a majority of both visitors and staff were ethnic minorities. The library was equipped with several meeting rooms which were ideal for activities. In addition to that, there were many books in different languages on different shelves.
The readers' needs
We conducted semi-structured interviews and surveys in order to understand visitors' needs. The result showed that over half of the participants were interested in language skills and employment up-skilling courses. They were also interested in sharing their interests with others. We further discovered that over 59% of the participants mentioned trying books in a number of foreign languages.
An Affinity Diagram was used to analyse and summarise the interviews. As a result, we found five key themes with respect to people’s interactions with the Idea Store:
- Interaction with physical sources
- Interaction with digital resources
- Interaction with people
- Interaction with library events
- Purpose of visit
Based on the user research, 2 personas were created as representatives of users of Idea Store.
Carlos is a 24-year-old master student. He always spends time in Idea Store reading books in different languages.
Ilma is a mother with a 5-year-old daughter. She wants to learn English and helps her daughter with her studies at Idea Store.
Point of View Statement
Carlos needs to find good quality translation for many books as he is keen on reading in another language without losing meaning. It is important to him to maintain accuracy and the right message in a different language.
Ilma needs to study English from the community she lives in since she wishes to immerse herself and her daughter within UK life.
What is the core of the research results? The Point of View Statement helped us define opportunities.
SCAMPER and brainstormings were used to explore as many possibilities as possible for enhancing users' experience. At last, three main ideas were reached as the solution.
1. Interactive Desk
2. AI based language translation and learning
3. AR glasses for translation
With the new design, Carlos and Ilma will have a completely different and pleased experience in Idea Store. The storyboard demonstrates how they would interact with the product and how they feel about it.
We used Paper prototype, digital sketches and "crazy 8" to explore as many product ideas as possible. Each team member voted for and discussed about potential solutions. Finally, the main focus of the design lead to a seamless and real-time translation experience for readers using AR glasses, a conversational styled interface of the translation and language learning system built in the interactive desk which aims to provide users with a natural learning experience, and a community section with reviews and events.
Based on the ideation, wireframes and high fidelity prototypes were created.
To translate: Using and interactive desk, users can search translated versions from resources within the library or through an AI empowered translation. Using the AR glasses, users can read physical books and enjoy the real-time translation effortlessly.
To learn language: While reading books, users can learn grammar, vocabulary, idioms and expressions and have a takeaway summary analysed and offered by the AI.
To join the community, users are able to search and book for all events held by the Idea Store. We further designed a community section for users to communicate and share their thoughts and feelings. To build a more active community, if users share thoughts or answer questions in the community section, they can earn tokens which can be used when booking events and subsidise or waive event fees.
Interactive Desk screen
AR Glasses
We carried out in-person usabilitytesting with five participants for a prototype containing two main task flows. Most of the participants provided positive feedback for the experience, however, there were also some opportunities for improvement.
😊 We considered incorporating the cutting-edge technology with our product.
💪 Because of the "5-user guideline", five participants are recommended to identify 85% of usability issues. However, more participants may reveal more issues.
😊 We combined the digital experience with physical books, therefore readers could choose their own preference of reading.
💪 We may add more features to the AR glasses to leverage their power, such as showing captions during library events.
😊 We designed IRIS as a product which people can not only borrowing and reading books, but also learning language and building community with others.
💪 Taking business feasibility into account is also important. In the future, the real cost of building IRIS system may also need to be considered.
Thank you for watching!
