
International Research Journal of Engineering and Technology (IRJET) e-ISSN:2395-0056
Volume:12Issue:04|Apr2025 www.irjet.net p-ISSN:2395-0072
International Research Journal of Engineering and Technology (IRJET) e-ISSN:2395-0056
Volume:12Issue:04|Apr2025 www.irjet.net p-ISSN:2395-0072
Dr.G.L. Lakshmi
Dept of AI&DS, VVIT, Andhra Pradesh, India
Dept of AI&DS, VVIT, Andhra Pradesh, India
Dept of AI&DS, VVIT, Andhra Pradesh, India
Dept of AI&DS, VVIT, Andhra Pradesh, India
Dept of AI&DS, VVIT, Andhra Pradesh, India
Dept of AI&DS, VVIT, Andhra Pradesh, India
Abstract - In today's hectic academic environment, students frequently find it challenging to manage their time, assign priorities, and complete tasks within deadlines efficiently. Focus Flare is an online study tool intended to offer a well-organized academic planning technique using personalized study calendars, intelligent reminders,andprogressmonitoring.Byenablingstudents to properly juggle their studies, projects, and examinations, Focus Flare increases productivity and prevents any significant task from being forgotten .The platform enables students to create custom study plans tailored to their workload, study time, and deadlines. Performance monitoring and habit tracking also help students monitor their study habits and spot areas for improvement. In addition to task scheduling, Focus Flare provides goal setting, prioritization strategies, and visualization of progress so that the student stays motivated and focused. The interactive and intuitive user interface enables smooth transition, making planning academic easier and efficient. Focus Flare has been built with Node.js, TypeScript, JavaScript, and Express to provide a scalable, efficient, and responsive user experience. With the integration of structured scheduling, and performance analytics, the platform keeps students organized, mitigates academic stress, and maximizes productivity. Whether one is juggling multiple assignments,orbalancingextracurricularactivities,Focus Flarebecomesthego-toassistantforacademicsuccess..
Key Words: Study Assistant, Time Management, Personalized Study Plans, Automated Reminders, Academic Productivity, Progress Tracking, Task Prioritization
Handling academic work effectively is a challenge for students balancing assignments, deadlines, and exams. Without an organized system, staying organized is impossible, and it results in stress and missed deadlines. Current productivity tools are not flexible
enough to handle academic planning, and thus students havetousemultipleplatforms
Focus Flare streamlines studying by providing task organization, time management, and automatic reminders under one roof. Students can organize study plans in a structured way, set priorities, and monitor progress in real time. Pomodoro-inspired Focus Mode increases focus, and performance insights make study habitsbetter.
Focus Flare addresses the issues of study task management by offering a centralized platform for structuring, monitoring, and optimizing study timetables. With real-time progress monitoring and task analysis, students are able to track their study habits and enhance productivity. Developed using Node.js, TypeScript, React, Express, and ShadCN, Focus Flare provides user-friendly experience. With scheduling, it helps students stay organized,reducestress,andimproveperformance.
Conventional study management is usually based on staticto-dolistsandbroken schedulingtools,whichmake it hard for students to follow assignments, set priorities, andallocatetimeproperly.Mostcurrentplatformsdo not have dynamic scheduling, real-time monitoring, and coherent study feedback, resulting in inefficiencies and last-minutepressures.
Yet,themajorityofcurrentstudymanagementtools do not offer an adaptive and dynamic means of academic planning. They don't frequently include real-timeprogresstracking,smarttaskprioritization, and automated adjustment of schedules, which complicates the process for students to effectively managetheirworkload.
International Research Journal of Engineering and Technology (IRJET) e-ISSN:2395-0056
Volume:12Issue:04|Apr2025 www.irjet.net p-ISSN:2395-0072
Personalized Study Plans: Allows students to create customized schedules based on workload, deadlines,andpriorities
Automated Reminders: Sends notifications for assignments,exams,andpendingtaskstoprevent misseddeadlines.
Task Progress Analytics: Provides insights into study patterns, helping students track progress andoptimizetimemanagement.
Limitations of Traditional Tools: Highlights the lack of real-time adaptability, progress tracking, andautomatedprioritizationinconventionaltask managementmethods.
Increased Efficiency Using Focus Flare: Provides intelligent scheduling, interactive dashboard,andnon-intrusivetasktracking
Successful task management needs a solid and flexible system. FocusFlare is designed on a modular architecturethatallowsforsmoothfunctioning,makingit possible for users to manage tasks effectively, monitor progress, and boost productivity using proper categorizingandmanagingtasks
Independent Modules: The architecture is such that it allows essential modules like UI, task categorization, tracking of progress, notifications, and analytics to function independently while allowingsmoothcommunicationbetweenthem.
Strong BackendProcessing:Thebackend,driven by Node.js and Express, processes task creation, updates, and user authentication effectively. Microservices architecture guarantees scalability andflexibility.
Real-Time Analytics: The platform constantly monitors task completion and employs intelligent algorithms to underscore outstanding tasks, recommend priority plans, and streamline workfloweffectiveness.
Interactive User Interface: The React frontend, developedusingShadCNandTypeScript,offersan intuitive, smooth, and responsive experience, where users can manage and visualize tasks with ease.
Scalability & Performance Optimization: The highly modular architecture means that the system is extremely scalable, able to handle increasinguserloadswithouthindrancesinterms ofperformance.
With guided workflows, and real-time adjustability, FocusFlare delivers a sophisticated task management experience customized for optimalproductivity.
Fig2.3Architecture
The User Interface (UI) is the focal point of user interaction, providing a clean, organized platform for task management, monitoring productivity, and measuring performance. Developed with React, ShadCN, and TypeScript, it provides seamless, visually pleasant, and responsive operations. Simple, efficient, and usable indesign,itkeepsusersorganizedandmoreproductive insights.
Structured Navigation: Clearly defined sections like "Dashboard," "Task List," "Focus Mode," and "Analytics" provide easy and intuitive navigation makingitsimpleforaccessing.
Aesthetic Visual Design: Minimalist interactive design with smooth transitions and unambiguous task categories optimizes accessibility and usability.
On-time Task Reminders: Offers real-time reminders, updates, and notifications for tasks, keepingusersinformedandontime.
Flexibility Across Devices: Built for desktop, tablet,andmobile,withthesameuserexperience acrossallscreensizes.
Integrated File Management: Users can *attach, edit, and work on files directly within tasks, streamliningworkflowandboostingproductivity.
Performance Insights: Provides graphical representations, such as charts and progress monitors, to allow users to view trends, track progress,andautomatetheirworkflows.
International Research Journal of Engineering and Technology (IRJET) e-ISSN:2395-0056
Volume:12Issue:04|Apr2025 www.irjet.net p-ISSN:2395-0072
Theinterfaceisorganizedintofiveprimary sections,each offeringfunctionalitiestoenhanceusertaskdetails:
Section1: Task command Center Organizes activities into "Today's Tasks," "Upcoming Tasks," and "Overdue Tasks." People utilize it well for creating, viewing, rearranging, and executing activities while remaining on schedule.
Section 2: Performance Dashboard Offersinstantfeedbackontaskcompletionspeed, productivity patterns, and individual accomplishment. Charts and graphs give a clear, visualrecordofprogress.
Section 3: User Navigation and Access Control
Integratedintothenavigationbarforeasyaccess to user security and authentication functionality. Userscanviewtheirnameandsafelylogoutafter successfullogin.
Section 4: File Management System
Enables uploading, attachment, and file management relevant to activities on the platform. The feature offers easy document handling,thusenhancingeffectivetaskexecution.
Section 5: Achievement Hub and Rewards : Displays reward points and milestones to encourage productivity and increase participation. Members can track their progress and indicate milestones in their work processes.
Login / Sign Up System: The authentication module ensures secure user login and account creation,seamlesslyintegratedintothenavigation bar. Upon successful login, users can view their name and access a "Logout" option for effortless accountmanagement
3.3 Implementation Details:
Theplatform'sarchitectureisfoundedonastable and scalable technological foundation, which ensures smooth management of tasks, enhanced performance analysis, and easy By leveraging modernfrontendandbackendtechnologies,Focus Flare increases productivity while maintaining efficiency and responsiveness on different devices.
React with TypeScript: Uses a typed, component-based structure to improve maintainabilityandscalabilityandguaranteetype safetytoavoidruntimeerrors.
ShadCN: ShadCN Components provide a consistent and visually appealing user interface by using reusable design components, such as buttons, modals, and input fields, thus ensuring a responsiveandaccessibleinteractionstructure.
Redux with Redux-Thunk: Effectively handles globalstate,includingauthentication,taskdetails, and rewards, and simplifies complex asynchronousAPIcalls.
Axios for API Integration: Enablesseamlessand effective communication between the backend and frontend, such as real-time authentication, task synchronization, and performance monitoring.
Fig3.3.1OutputofSignupandLogin
Fig3.3.2Dashboardpreview
International Research Journal of Engineering and Technology (IRJET) e-ISSN:2395-0056
Volume:12Issue:04|Apr2025 www.irjet.net p-ISSN:2395-0072
This module is designed to enhance task organization, improve productivity tracking, and enhance file management in Focus Flare. It provides structured task management, real-time tracking of progress, and seamless file operation, enabling users to effectively manage their work while keeping related documents withineasyreach..
The Productivity Tracking and Task Management featureisdesignedtoassistusersinplanning,monitoring, and accomplishing their tasks as well as tracking productivitylevels.Thesystemoffersaformalizedmethod through the classification of tasks into various states, thereby enabling real-time monitoring of progress and providingfeedbackonperformance
The process begins with the creation of tasks, wherein users provide crucial information such as title, description, priority, deadline, and category. Each task is uniquely assigned to the user, thus making it responsible and easy to maintain tasks. The system tracks task progress in real-time, tracking transitions between Pending, In Progress, Completed, and Overdue states. Whenataskispastitsdeadlineandnotyetcompleted,itis designated as Overdue, enabling users to easily identify prioritytasks
Thetaskmonitoringprocessissimple.Thesystem records each change of status, and users can use metrics such as completion rate, average duration, and overdue items to gauge productivity. Each transition of tasks is monitored, creating a timeline that produces meaningful information about the effectiveness of users.The backend usesNode.jsandExpress,whereCRUDoperationsoftasks arecarriedout.InMongoDB,thereare fieldstostoretask information such as title, description, status, priority, deadline, and assignee in each record. The frontend uses ReactthatcallsAPIstothebackend,andtheReduxisused globallytomanagestateforconsistencyacrosstheapp.
The Task Management and Productivity Tracking feature helps individuals stay organized, prioritize, and effectively perform tasks that are urgent. Through the synergy of real-time tracking, workflow systematization, and analytical insights, Focus Flare helps individuals streamline their task management process and maximize theirproductivityeffectively.
The File Handling facility in Focus Flare supports uploading, managing, and accessing files within the task management system. This helps to ensure that taskrelatedcontentremainsinasystematicformatandcanbe accessed easily without relying on external storage systems. Various file types, such as PDFs, Word documents, images, and others, can be added by users withtherestrictionoffivefilespertaskanda5MBupload capacity. Attachments are also available along with task information, and completed tasks also retain the linked filesforfutureuse,ifneeded
The file system is integrated with task management sosmoothlythatuserscanaddafileoreditataskwiththe ability to attach files. Upload fields, drag-and-drop functionality, and preview and download attachment functionalities are included in the user interface. Uploading files is done on the server side by Express.js, and metadata in terms of filenames and timestamps is saved in MongoDB. The uploaded files are saved in a
International Research Journal of Engineering and Technology (IRJET) e-ISSN:2395-0056
Volume:12Issue:04|Apr2025 www.irjet.net p-ISSN:2395-0072
specificstoragefolderwithpathslinkedtotheirrespective tasks,sodatamanagementisproper.
The system improves the user experience with the inclusion of attached files' preview in each task, hence enabling easy and fast access. All files are shown with a downloadable button that is clickable, and users are affordedtheluxuryofpreviewingfileswithoutexitingthe task interface. Such file management functionality aids in tracing significant files, hence minimizing manual file management. Moreover, with ongoing access to the attached files, users can refer to completed tasks whenevernecessary.
To provide error-free management and seamless operation, Focus Flare verifies file uploads, limiting unsupported file types and oversized files. When uploads areunsuccessful,usersareprovidedwithimmediateerror messagesandretryrequests.Thisfunctionalitymaximizes task management effectiveness by enabling users to save, retrieve, and manage vital documents in an integrated workflow,enhancingproductivityandorganization
The Calendar and Focus Mode feature of Focus Flare optimizesproductivitybyscheduledtaskorganizationand avoidance of distractions. The Calendar module allows userstoscheduletasks,setdeadlines,andtrackpriorities, with an easy view of upcoming tasks. Tasks are visually arrangedbyurgency,project,orcategorysothatuserscan stay in charge of their work. Performance analysis provides information about task completion and productivity patterns so that users can streamline their workflow.
5.1 Focus Mode :
The Focus Mode is designed to minimize distractions and promote deep work. It comes withDistractionAlerts,whichreminduserswhen they're off track, keeping them on their toes. Pomodoro Insights guide users through timed work sessions, with scheduled breaks for maximum concentration and avoiding burnout.
Optimal Work Periods also analyze productivity patterns and recommend the best times for highefficiencywork.
formedcareerdecisionsbasedontailoredadvice.
Notifications System maintains the users in the loop with timely reminders of the upcoming deadlines, overdue tasks, and milestone achievements. It provides real-time tracking of the tasks, reflecting the outstanding actions and completion. The notifications allow the users not to miss a deadline and provide a consistent work flow.
By combining Calendar, Focus Mode, and Notifications, Focus Flare creates a distractionfree,well-organizedworkenvironment.Userscan plan their tasks effectively, stay accountable, and optimizetheirproductivityusingstructuredwork sessionsandinsightfulanalytics.
Fig5.1Pomodoro
Fig5.2CalenderOutput
6 . Module Interaction & Sample Test Cases
6.1
In Focus Flare, inter-module communication is designed to provide a seamless and user-friendly task management experience. Focus Flare is built with React, TypeScript, Express.js, and MongoDB, with microservices
International Research Journal of Engineering and Technology (IRJET)
Volume:12Issue:04|Apr2025 www.irjet.net
architecture to ensure scalability as well as maintainability.
The platform consists of three core functionalities: User Interface, Task Management & File Handling, and Focus Mode & Calendar Integration. All the featuresofeachofthemshareefficientlyusingRESTAPIs, Reduxforstatemanagement,and WebSocketstofacilitate real-time updating of tasks. The User Interface module offers an interactive and dynamic front-end experience, the Task Management & File Handling module facilitates efficient task organization along with file attachment, and theFocusMode&Calendarmodulefacilitatesproductivity throughdeadlinetracking,worksessionmanagement,and minimizingdistractions.
Centraltothisunificationisthetaskmanagement system that ties all the modules together. The React frontend dynamically displays tasks, file attachments, and focus mode insights, and Express.js APIs control task creation, updating, and scheduling. Task metadata, file references, and user preferences are stored in the MongoDBdatabase,anddataispassedefficientlybetween modules. appropriate model methods and rendering the templates.
The platform follows a modular architecture, integrating different functionalities into the main React application and maintaining separate microservices for activities like handling, file storage, and productivity tracking. This architecture helps maintain a smooth and consistentflowofactivitiesfortheusers.
Module 1 (User Interface) is developed in React and CSS , ShadCN components and offers a dynamic and user-friendlyinterface.The UIisdynamicallyrefreshed as per Redux state change, and the interface is smooth and responsive for task management. Users can browse throughtasklists,seefileattachments,andseefocusmode insights.
Module 2 (Task Management & File Handling) optimizes task organization through the creation, editing, andmanagementoftaskswithinbuiltfileuploadfeatures. File uploading is securely processed by Express.js, and taskdataaswellasfiledataarestoredinMongoDB.There issupportfordifferenttypesofattachmentsfortheusers, which include document previewing and inline downloadingofattachmentsintheirtasks.
Module 3 (Calendar Integration & Focus Mode) This increases productivity through the integration of Pomodoro sessions, distraction alerts, and best time to work analysis. The Calendar module integrates deadline tasks, allowing users to schedule and visualize their workload efficiently. Reminders and alerts keep users in
p-ISSN:2395-0072
check, optimizing their workflow.experience that encouragesuserinteraction.
By utilizing React, Redux, Express.js, and MongoDB, Focus Flare provides each module with independence in function while retaining flawless integration, with an easy, streamlined, and highly productivetaskmanagementexperiencesspecifictasks.
With its integrated system and modular design, Focus Flare provides an easy, effective, and allencompassing task management experience. With React, Redux,Express.js,andMongoDB,usersarepresentedwith ahigh-performanceandscalablesolutionthatallowsthem to remain organized, monitor tasks effectively, and increaseproductivity.
With advanced focus-driven technology and computer-aided planning tools, Focus Flare helps people build better work habits, maintain consistency, and optimizedailyroutinesforlong-termsuccess.
Testing is an important phase to check that Focus Flare operates as expected and provides users with an efficient and hassle-free task management procedure. The test casesaredeterminedtocheck significantfeaturessuchas authentication, task management, file handling, focus mode,andcalendarsynchronization.
In this test, the site verifies user login. When a userentersvalidemailandpassword,theyshould be redirected to the dashboard with a welcome message. When invalid credentials are entered, a message ("Invalid credentials, please try again") should be shown. This ensures that the authentication process is secure and only valid userscanseetheirpersonalizedworkspace.
International Research Journal of Engineering and Technology (IRJET)
Volume:12Issue:04|Apr2025 www.irjet.net p-ISSN:2395-0072
TestCase2:TaskManagement&Creation
This test evaluates the users' capability to efficiently create and manage tasks. The users shouldbeabletocreatea task byentering a title, description, due date, and priority level. Once saved,thetaskneedstobevisibleonthetasklist. The users should also be able to modify the task, change the priority, and mark it as done. This offersasmoothandresponsivetaskmanagement.
TestCase3:FileUploadingandDownloading
This test checks the functionality of the platform inmanagingfileattachmentsontasks.Theuseris expected to upload a file (e.g., PDF, image, document)ontoatask,getnotified,anddownload orview the attachedfilelater.Iftheuseruploads anunsupportedfiletype,thesystemisrequiredto notifywithanerrormessage.Thischecksthatfile managementisworkingandsecure.
TestCase4:PomodoroTimer&FocusMode
Thefocusmodefeatureisevaluatedbyinitiatinga Pomodoro session. The user must be able to initiate a 25-minute work session, be alerted of a break upon completion, and pause or stop the timer as needed. This enables the Focus Mode to run effectively, reminding users to remain productive.
TestCase5:SchedulingCalendar
Thistestensuresthatdeadlinetasksarecorrectly integrated into the calendar module. If a task is added against a deadline, it should automatically bereflectedonthecalendar.Usersshouldreceive reminder messages prior to the deadline. Rescheduling a task should also be reflected on the calendar. This is to effectively schedule tasks andtrackdeadlines.
Test Case 6: Reward System after Task Completion
This test calculates the reward system triggered after the completion of a task by a user. On completion of a task and marking it as done, points must be awarded based on the task priority. The updated point score must be displayed on the user dashboard. Several task completions must correctly accumulate points, and in case of redemption, users must be able to trade rewards. This ensures that the platform effectively encourages productivity through incentivization.
These test cases validate that the core functionalities of the platform are working as intendedandprovideaseamlessexperienceforthe users.Throughunittesting, integrationtesting,and
user acceptance testing, the platform validates that all the components of the system are interacting in the right way and delivering the intended functionality.
Focus Flare is a next-generation productivity platform engineered to revolutionize task management and performance tracking, using the harmonious integration of user-friendly functionality, workflowfriendly interfaces, and automation. With its User-Centric Interface, the platform organizes tasks using a workflowfriendlysetoftoolsincludingtaskcategorization,priority, and voice-activated creation of tasks to make them enjoyableandseamlessfortheuser.
The platform's central modules Notifications, Focus Mode, and Calendar Integration are combined to allow users to manage their work efficiently. Focus Mode minimizes distractions through Pomodoro-based focus intervals, while Calendar Integration optimizes deadlines and keeps them visible. Reminders and distraction alerts attheappropriatetimealsoboostproductivitybykeeping usersontrack.
With Task Automation, Focus Flare simplifies operations through intelligent scheduling, real-time reminders, and auto-syncing. Furthermore, the Rewards System motivates users with points on task completion, buildingconsistencyandgoalachievement.
In essence, Focus Flare is not only a task management system but also a productivity companion that enhances focus, streamlines processes, and ignites motivation. With more future updates such as more rewards, collaboration, and more detailed tasks, Focus Flare is poised to always empower users to attain productivityeasilyandefficiently.
1. Node.js Foundation, “Node.js v20.0.0 Documentation,” [Online].https://nodejs.org/en/docs/
2 ReactDocumentation,“React:AJavaScriptLibraryfor Building User Interfaces,” [Online]. Available: https://react.dev/.
3 TypeScript Handbook, “TypeScript: JavaScript That Scales,”[Online].https://www.typescriptlang.org/docs/
4. Express.js, “Express: Fast, Unopinionated Web Framework for Node.js,” [Online]. Available: https://expressjs.com/
International Research Journal of Engineering and Technology (IRJET) e-ISSN:2395-0056
5. ShadCN UI, “ShadCN: Accessible and Customizable UI Components for React,” [Online]. Available: https://ui.shadcn.com/.
6 Zammetti,F. Modern Full-Stack Development: Using TypeScript,React,Node.js,Webpack,
7..Hoque,S.Full-StackReactProjects:LearnMERNStack Development by Building Modern Web Apps Using MongoDB,Express,React,andNode.js,2ndEdition.United Kingdom:Packt Publishing,March2020.
8 TienPham, “Buildingan onlineshopapplicationwith MERNstack”,Bachelor’sThesis,November2020.
Volume:12Issue:04|Apr2025 www.irjet.net p-ISSN:2395-0072 © 2025, IRJET | Impact Factor value: 8.315 | ISO 9001:2008