Customer Objective
The main goal of the Baking Application project is to create an easy-to-use, multi-tenant platform for enabling training and certification in baking primarily for Intellectually Challenged Young Adults in various recipes (programs) owned by a Baking Company. The platform also provides for tenant organizations to offer their recipes (programs) to their trainees, if their programs adhere to the content framework designed for this application. The Baking Company will be administering all programs offered on the platform. The application will be made available on a web browser for tablets with multiple learning interfaces to suit the cognitive style of the trainee.
Project Details
- The Baking Application project aims to create an easy-to-use, multi-tenant platform for enabling training and certification in baking primarily for Intellectually Challenged Young Adults in various recipes (programs) owned by a Baking Company. This application also provides access to Third-Party Organizations or Tenant Organizations (TPOs) to offer their recipes to the trainees as long as their programs are accepted by the company.
- Baking Application enables efficient scheduling and tracking of Courses and Certificates for each trainee, by allotting the trainees to the respective courses and certificates providing various logins for Trainees, Instructors, Guardians, TPOs (Third Party Organizations – Program Managers), and Project In-charge where each login can be created by using the hyperlink received in the mail.
Other key features are:
- Admin Functionality to onboarding new TPOs, and other users and management.
- User profile and management.
- Play Functionality of the Recipes/Processes in the application.
- Graphical representation of the trainee performance in completion of a Course and Certificate.
- Multi-tenant (TPOs) management.
- Multiple Interfaces to suit the cognitive style of the trainees.
Challenges
- Play/Pause functionality: Enable trainees or guardians to play the recipe (course) details with a play functionality to complete the course and certification of a particular course. Allow users to Play, Resume, and Restart the course as and when needed with a query option provided in case of any queries.
- Data Visualization/ Reports: Graphical representation of data for Data Tracker where the performance by the trainer is calculated using the Data Tracker Form.
- Accessible Interface Development: Maintaining Consistency Across Assistive Technologies where different screen readers interpret ARIA roles differently. Conduct extensive cross-device and cross-browser testing using tools.
- Tablet-Optimized Design: Ensuring Touch Accuracy & Gesture Recognition where Misinterpreted gestures can lead to unintended actions by Implementing gesture detection libraries like Hammer.js and fine-tune touch sensitivity.
Implementation Benefits:
- Implementing Access Restrictions for TPO Management: By restricting user access, sensitive information related to specific TPO is protected, ensuring that only authorized personnel can manage or view data.
- Managing login Functionality: Multiple logins across the application for Trainees, Instructors, Guardians, TPOs (Third Party Organizations – Program Managers), and Project In-charge by managing the data visible for a particular login.
- Data Visualization/ Reports: Graphical representation of data for Data Tracker where the performance by the trainer is calculated using the Data Tracker Form.
Helps Instructor to monitor performance on individual trainee level, and make informed decisions, supporting in attaining certificate for an allotted recipe/process.
Technologies
- Frontend: ReactJS, React Query, HTML, CSS (SASS), Figma Designs
- Backend: Java, Hibernate, and Spring boot.
- Repositories & Data Store: Java, Hibernate, and Spring boot.
Solutions
- Efficient State Management: Utilized Zustand for centralized state management, ensuring smooth synchronization between the main play screen and the thumbnail list. Implemented selective state updates to avoid unnecessary re-renders and improve performance.
- Smooth Thumbnail Navigation: Implemented a combination of scroll event listeners and controlled component states to keep track of the active item. Used scroll into View () and optimized calculations to align the selected thumbnail correctly when navigating with Prev/Next buttons. Used Reacts memorization techniques (e.g., useMemo, useCallback) and virtualized rendering for large lists to reduce re-renders. Optimized animations and transitions for smoother UI interactions while ensuring minimal layout shifts.
- Graphical Report Generation
– Use libraries like MPAndroidChart for Android (Java) and the built-in charting tools for iOS.
– Ensure reports are generated in a user-friendly format, making data interpretation Straight forward. - User onboarding and Role Management
– Involves creating a new user account (TPOs), and assigning roles-based logins.
– Granting the appropriate permissions to ensure compliance and security where the details displayed are confined to those logins. - File Handling
– To develop a robust backend system that can process multiple file formats efficiently while ensuring data integrity, security, and scalability. Handle parsing errors gracefully with meaningful error messages and retry mechanisms.