A redesign for a school app
I redesigned an app for the school I work at.
The Problem
I have identified a problem with the current app, where users, particularly older teachers who may be less familiar with technology, have reported difficulties in navigation and understanding the interface. The issues with readability of buttons also adds to the problem.
The solution
I have proposed a solution that aims to simplify the interface and make it more intuitive and easy to use for all users.
Specifically, I plan to create an app that presents all necessary information in a clear and concise manner, without overwhelming the user with excessive information or complicated navigation.
Research
I conducted user research to gather insight on the needs and pain points of the target audience. I selected a diverse group of 5 teachers who had previously used the existing application. The participants were a mix of genders and ages ranging from 24-60. To gather a wider range of perspectives, the interviews were conducted in both Spanish and English.

The user research questions were as follows.

  1. Tell me a bit about yourself?

2. What’s your relationship with technology, especially mobile apps?

3. Do you use Microsoft teams regularly for school meetings and information?

4. How is using teams compared to the school app?

5. When was the last time you used the school and for what purpose?

6. Tell me 3 good things about the school app?

7. Tell me 3 bad things about the school app?

8. What purpose do you mainly use the school app for?

9. Did you prefer the old system of calling into school or calling the janitor/cleaner when you had a problem in class?

10. Finally, do you want to share more about the school app?

I conducted in-person interviews with a diverse group of 5 teachers who had previously used the existing application. Due to time constraints, the interview process was limited to 20 minutes per participant. Although ideal interview duration would have been 25-30 minutes, the teachers were either busy after school or had limited time during school hours, therefore, all interviews were conducted at the school during school hours.
From these interviews I created an empathy map and was able to understand their main pain points.
The pain points.

PP1 ( PP- pain point)
Some of the older users have problems with their site, so seeing the buttons on the first screen was hard. Also the colours were hard to see for some of the colour-blind users.

PP2
Most users use the school app for when they´re absent and some of these users have classes in primary and secondary but there is no selection for both primary and secondary. It's either one or the other.

PP3
Some of the older users who aren’t used to how most phone apps work and had a hard time knowing they had to scroll down on some of the screens for more information/selections.

PP4
Users had trouble navigating through the app having to go back to the home screen and select a different section each time they wanted to move between sections.


Ideation Stage

1. For the first pain point (PP1) I made the buttons on the home screen a lot bigger, so now they stretch across the whole screen and are wider so they're easier to press. I also made the font larger and bold with a variant of black without the need for glaring colours. An Icon was also added to each button to make it clearer what section the user was going to enter.

2. As for the second pain point, toggle buttons were added to the absences screen so the user can select primary classes and secondary classes. An additional screen was added for selecting specific classes the user will not be attending.

3. Non essential options were removed from certain screens so all information was on one screen without the need for the user to scroll down.

4. A fixed navigation was also added to all screens to make it easier for the user to navigate through the app. With the same icons on the home screen to represent each section of the app.
Old App
Usability Test
After
In summary, I have made adjustments to the design based on user feedback, by increasing the button size, text size and removing boxes around icons. These changes resulted in a more user-friendly and intuitive interface for the older users. I am committed to continuing to conduct user testing and gather feedback to validate the design and make further improvements as needed.
Before
During user testing, I discovered that some of the older users still found the home buttons to be a bit too small, despite my previous solutions proposed during the ideation stage to address the pain point of small buttons.
I am committed to continuing to iterate and improve the design based on user feedback, by exploring alternative solutions such as increasing the size of the buttons even further, or adding additional visual cues to improve discoverability of the buttons.
It's important to note that, usability testing with real users is the key to validate the design decisions, and it is an ongoing process, it's not only done once but multiple times throughout the design process.
User Flows
Body
Drop Down
Drop Down Bold
Heading 2
Roboto, Regular, 20
Roboto, Regular, 20
Roboto, Bold, 20
Roboto, Bold, 25
Heading 1
Roboto, Bold, 40
Type Scale
UI KIT
Wireframes
Informática
Averias
Limpieza / Comedor
Ausencias
Home
UI DESIGN
one of the solutions I proposed for the redesigned app is to create a clear and intuitive home screen that allows teachers to easily identify and report problems.

On the home screen, I have added a section where teachers can select the type of problem they are experiencing. The options include: I.T problems, something broken, cleaning and cafeteria and Absences. This allows teachers to quickly and easily report the problem, and ensures that the appropriate department receives the report.
Home Screen
I have designed a solution that allows teachers to easily report broken furniture or fixtures by providing a section on the home screen where teachers can select the type of problem they are experiencing and also choose what furniture or fixture is broken in a class.
Broken Furniture And Fixtures
Absences
On this step, the teacher is able to select when and why they will be absent, and what classes will be affected. It makes it easy for teachers to report absences quickly and efficiently, with specific details, which can lead to better preparation for substituting teachers.
I understand the importance of providing detailed and specific options for reporting issues, in order to ensure that the appropriate department can quickly and efficiently address the problem.
To further improve the solution I proposed earlier, I have added an additional step to the I.T problem reporting process. On this step, the teacher is able to select the specific class and item they are having a technological issue with. This added level of detail enables the IT department to quickly identify the location and nature of the problem, and take appropriate action.
Information Technology
Cleaners And Cafeteria
By providing the option for teachers to select if something in a class or the cafeteria needs cleaning, the app is able to gather detailed and specific information about the problem. This added level of detail enables the cleaning department to quickly identify the location and nature of the problem and take appropriate action, which can lead to faster resolution times and an improved overall experience for the teachers and students.
Conclusion
In conclusion, the redesign of the school app has been successful in addressing the pain points and improving the overall user experience. The end-users, including teachers and students, were happy with the overall look and simplicity of the app. They had less trouble navigating around the app and found it much more user-friendly. The older users were particularly pleased with the changes, as the larger buttons and fonts, as well as the use of more subdued colors, made the app easier for them to use.
This site was made on Tilda — a website builder that helps to create a website without any code
Create a website