Hoopooh App
Hoopooh App was my final project for the Ironhack UX/UI Design Bootcamp. The project brought us a title of the best UX/UI project in the January cohort.
Every parent is curious to know how their child's day went, whether they slept long, ate well, played, or if there were any daytime problems. However, as we all know, every kindergarten teacher has a lot of work to do, and does not always have the time to exchange a few words with the parent who picks up the child. With help in this case comes Hoopooh - an application through which the teacher can give parents immediate feedback on their child.
Hoopooh was created in 2020 by Amir Matallaoui and Ahmed Jemaa and its main purpose is to improve communication between parents and caregivers in the kindergarten.
Project summary
In the following case study I would like to present my work on this application. Our team consisted of three people, me, Sum and Sara. Our task was to create the ux and ui of the application from scratch, starting with research, competitive analysis, creation of ui elements, illustrations and ending with a finished prototype for teachers and parents.
Hi - fi
Hi - fi Prototypes
(turn on subtitles to see my comments)
When opening the app, the teacher first adds information about next week's library visiting, and publishes it on the sticky board - parents can see this sticky board in their version of the app. Then the teacher wants to give feedback to the parents of his pupils, starting with Alex. When viewing Alex's profile, he marks on Alex's board how his day went, how he ate, slept, what he played, what his mood was. After pressing the post button, automatically opens the profile of the next child. This allows the teacher to quickly send information to parents with a minimum number of clicks. In the meantime, he checks the chat, after adding to the message from parents, he returns to his previous activity, i.e. give parents feedback about their child.
(turn on subtitles to see my comments)
The parent opens the application and sees his/her child's profile. He can easily check the weekly overview, he can make an appointment for a private conversation with one of the teachers. They can also see if there is any new information from the teacher on the sticky board. He can see the feedback the teacher has sent him and see how his child is getting on in the nursery. He can also go into a chat room to talk to other parents or ask a teacher a question.
Competitor Analysis
First we analysed the competitors on the market. On the American market there are already several such applications with great success (Bright wheel, ClassDojo). On the European market it is not yet so popular, which gives Hoopooh a lot of opportunities.
Survey
Then we surveyed parents and teachers. From the 30 or so respondents we found pain points. For parents it was the lack of communication with teachers, for teachers it was the lack of time to talk to parents. Both groups of users said that such an application would definitely facilitate communication between them, but with the possibility of direct interaction with the teacher/parent.
User Persona
With all the knowledge we gained from the surveys, we were able to create a user persona. User persona is a way to make the process of ideation easier, to feel more in touch with the problems of our future user. We created two user personas, one for parents: Marie and one for teachers: Anna.
Problem Statement & Hypothesis Statement
What is the biggest problem?
How can this problem be solved?
Moscow Method
On the basis of the knowledge we have gathered so far, we have started to plan how the application will look like with Moscow Method: what functions it must have, what it should have, what it could have and what it won't have.
What functions will our application have?
function of chat with teachers
option to arrange a personal meeting with the teacher
options to get feedback from the teacher
Sticky board - a digital version of a notice board where the teacher can publish any information
tracking - overview showing the child's week
Lo-Fi
Once we knew what features the app would have, we started drawing a lo fidelity prototype. This technique helps to create the first outline of the prototype, planning the number of screens, the location of various functions and buttons on the screens.
Mid-Fi & Testing
After working on lo-fi, I started working on mid-fi prototypes, which allowed me to do user testing. I created two prototypes - one for teachers and one for parents. The results of the tests were very fruitful. Some people thought that it took too long to give feedback from the teacher, which I had to correct. Others wanted a week's supervision of the child, not only by the parent but also by the teacher. However, all users found the app easy to use and intuitive. Taking into account the feedback, I changed the prototype.
Moodboard
The next stage should be to create a Hi-fi prototype, but in order to do this it is necessary to establish the style in which the application will be developed. There are many techniques for this, including moodboard. Based on 5 brand attributes: friendly, playful, conversational, trustworthy and caring, we created 3 moodboards. Then, we conducted a survey in which respondents answered which of these moodboards most closely matched these attributes. The choice of moodboard helped to define the style, colour scheme and general mood of the application, so we could start working on the illustrations for the application.
Mix & Match
In the Hoopooh every child whose kindergarten uses this app has its own profile. But instead of a profile picture of a child, has its own personalised avatar. The avatar is created using a mix & match system, i.e. from a database of elements you choose the colour of the skin, the colour of the hair, the hairstyle, the accessories and you choose the background. The teacher can also choose an avatar for his/her group: e.g. a group of bears, foxes or ladybirds.
Style Tile
In parallel with the illustrations we created other UI elements: buttons, tabs, stickers on which the teachers write information to parents, icons, we chose the font and built the nav bar and tab bar elements. With all these pieces we were able to start working on the Hi-fi prototype.
Conclusions
Working on this app has shown me once again how important UX research is. Some people may think they have an idea of the perfect app, but the process always shows what people really need. It showed me once again how significant the role of the designer is, and that sometimes you have to fight to do your job well.
…