Connected For School
Platform

Web

Mobile

Technologies Used

Frontend- React Native Video Player Integration

Push notifications- Firebase

Video Player integration- Vimeo, Wistia

Project management- Jira

Helping students’ mental health

Connectd for School is a digital wellbeing assistance application for school students in Los Angeles. We gave a new face to the app along with optimizing it through dedicated software development and assistance.

Our association with Connectd for School

The mental wellness of school students is a prime concern that mostly goes unnoticed. Connectd for School targets this issue with its wellbeing assistance application that can be used by teachers, parents, and students of around 15 schools in Los Angeles. This application would also serve as a companion to the outreach program carried out by schools on mental health for students and related topics.

This project started in April 2022 as we were approached by the client for the Frontend Development and API Integration of the mobile app. The backend was already developed and our team had to majorly work on frontend development and API integration.

Key Milestones of the Project

The project had the following major requirements and we met them effectively with dedicated technology usage and appropriate management.

Mobile application

We developed a role-based cross-platform mobile application using React Native. This app can be used by students, teachers, and parents whereby the functionalities would be different for each role. The essence of this application has been its simplicity, as the client required, companioned by high user-friendliness. We used gamification along with creative animations that uplifted the user experience of the app manifolds.

We created the signup/login functionality for the app (a separate section for this due to the complicated nature of the task).

The check-ins feature of this app contains several questions that users can answer to check their wellness status. We integrated APIs to create a set of standard check-ins.

The app includes a separate section of "saved items" that users can view later.

We integrated Google Maps in the resources section that would help the users to locate help centers easily.

The users can view informative videos in the app. We embedded the video functionality using Vimeo software and Wistia software.

In the resources and saved items sections, we implemented the search functionality. This will help users in finding relevant information faster.

While navigating inside the resources section, the users can find various links to check out more information about them. We integrated the API for an in-app browser through which the users can open those web links.

We integrated the feature of music in the app which users can access for listening to different kinds of healing and calming sounds.

We implemented gamification in the performance section of the app. As the users undertake the check-ins, they gain experience points and win several badges that collectively contribute to their performance and well-being index. The rising scores stir creative animations in the app, making it more appealing to young students.

App widgets

To make the app more interactive and user-friendly, we developed and implemented two exclusive widgets or static functionalities.

The first widget is a ‘Feeling Thermometer’ that includes blocks of different colors representing various feelings and moods. Students can scroll on this thermometer to analyze their moods and get relevant help as required. This mood check activity also affects the experience points and badges.

The second widget is 'Map my network' which includes a set of cards containing several questions about the well-being of students. The answers entered by the students allow the app to collect relative data. It then presents information about the helpful personals and points of contact in the students' social networks that they have connected with previously.

User signup/login

This was the prime and most comprehensive API integration task in this project. The signup and login process for this app had many authentications and identity verification complexities. Thereby, our engineers had to brainstorm on integrating the complex signup/login APIs. We created separate signup functionalities for the three users, i.e., students, teachers, and parents as per the requirements laid out by the client. This included passcode functionality for student signup and email/password functionality for teacher and parent signup.

We implemented the authentication factor of the school code that must be entered by all the users to use the app. After entering the school code, the app will run as per the role chosen by the user. Student login needed further verification factors. The students permitted by their respective schools can use the app with school codes and other students will have to sign up each time for using the app. The app will never log out users unless they are attempting to log in from a new or second device.

App localization

We implemented a language conversion functionality for this app for the requirement of app localization. The app operates in the Los Angeles area where Spanish is the native language. To make the app more inclusive, the client required a dual-language version for parents that can only understand the native language. Thereby, we integrated an API that would convert the app data into Spanish after detecting a parent login.

Push notifications

Connectd for school app includes the feature of Push notifications. These notifications aim to increase app usage by displaying relevant content to the users and encouraging them to explore more about the app. We integrated APIs for three types of push notifications - check-ins, new content, or announcement. We implemented the functionality for push notifications using Firebase.

Major Challenges

We received the Connectd for School app without a frontend. The client provided the UI/UX design and the challenge for the developers was to analyze the XD flow independently. This would call for discussions with the client many times as the flow would get complicated. However, our developers were able to overcome the communication issues and put things in place for a great front end.

The backend for the app was already developed and it was challenging to integrate it with the frontend our developers were developing. This issue primarily happened because our frontend team had to constantly communicate with the client’s backend team to implement the API calls.

As mentioned above already, the signup/login functionalities posed the biggest challenge of this project. The flows for some of the features and screens were missing which led to further hitches.

Final Results

  • Efficient mental health monitoring
  • Ease of reaching out for help and resources
  • Bridge of communication between teachers, parents, and students
  • Increased awareness about the mental health of school children

Need help for your project?

Yep