LockedIn

Inspiration

We struggled with staying focused.
We studied only one day before big exams leading to cramming and staying up late.
Our phones always distracted us while studying.
Existing apps didn’t have studying and app-blocking features together.
We wanted to address the problem teens face with academic pressure and heavy workloads, difficulty staying focused while studying, distractions from phones and social media, and poor time management.

It is a study app that locks distracting apps until the user completes their daily learning session.
It uses daily check-ins to keep user on-track and accountable for progress.
It first teaches you the material, then quizzes you on it, building a streak every day the user completes it in a row.
The Focus Zone starts a timer that persists throughout their phone and locks all distracting apps.
The Calendar/Analytics shows the user their past scores and stats for daily check-ins as well as future planned check-ins, and shows the user a indicator of their proficiency in a topic.

First, we decided to use React Native as we created a Swift project in the past which was very difficult to work with, and React Native is easier to port to different platforms.
We set up one repository for the API and one for the React Native App on Github and created staging branches for both.
We did the onboarding screens where we set up the overall flow of the user’s setup while another team member worked on backend functionality.
We set up the API for authentication and deployed our API to a domain with a production and staging subdomain.
We set up our backend services (MongoDB, Redis, S3, and Heroku).
We started scraping data for MCQ Questions and learning materials such as flashcards, fill-in-the-blank, etc..
We designed the rest of the UI such as the Home Page, Focus Zone, Study Hub, Settings, and Quiz-related UI to make the user experience seamless.
We fine-tuned our roadmap generation algorithm based on the user inputs to ensure that the plan will cover an adequate amount of topics for the courses the user selects.
We linked the backend with the frontend and uploaded to our backend services.

We faced challenges making the custom UI for the screen time lock and custom screen-time picker as it forced us to use react and swift simultaneously due to Apple’s restrictions on these features.
We ran into a lot of issues with merging conflicts in Github.
We faced challenges finding and scraping data.
It was difficult to make the UI standardized throughout the app and user-friendly.

We found a way to scrape problems from Collegeboard using a JavaScript console command in a web browser to automate the selection of questions.
We created our logo and decided on a 3-color scheme of black, white, and blue.
We made finishing touches to the UI and fixed bugs in the backend.

We learned how to work with 2 coding languages simultaneously (Swift & React).
We learned to organize our work on Notion, and to have each member assigned to work on a different section of the app to maximize efficiency and productivity.
We learned that picking a standardized font and color scheme to standardize the UI would help us design the UI.
We learned to make a main and staging branch for when we publish the app, so we can make changes without breaking the production app.