Lingoto demanded a comprehensive solution encompassing design, UX-design, front-end development, and a robust backend infrastructure for both the website and the platform.

Right from the outset, we recognized that the platform's simplicity was paramount to its success in facilitating user engagement. The design needed to be welcoming and visually appealing, leveraging artwork to create a comfortable environment for students. We aimed for an easy and intuitive menu and booking process to enhance user experience.

Our goal was to develop a class with rich features catering to both students and teachers. This class would offer:

• Voice and video calls between students and teachers.
• Real-time chat with voice messages for teacher notes.
• Various note types, student history, and class guidelines.

Additionally, the platform would incorporate quizzes, tests, and other activities related to the classes.

To further enrich the user experience, the platform would integrate an e-commerce section allowing students to purchase new courses.

Front-end

The front-end of the platform is delivered to the end user as a Progressive Web App, embodying a sophisticated fusion of diverse technologies and innovative approaches. From responsive design principles to intuitive navigation elements, every aspect of the front-end architecture is meticulously engineered to deliver optimal performance and user engagement.

Technologies: 

• Javasript
• Sockets
• WebRTC
• HTML
• CSS
• Google Authentification, ChartJS, Opus, Moment etc

Back-end

The backbone of the platform's is built with Node.js, known for its scalability. The website and CMS are developed using PHP and other libraries.

Technologies: 

• Node.JS
• PHP
• Sockets
• CoTURN
• Mysql
• FFmpeg
• AWS sdk, Cloudfront, S3, SES, EC2 etc
• PayPal sdk
• Google Authentification
• webTokens

Amazon Web Services solutions tie everything together, ensuring smooth communication and optimal performance.

The platform operates as a Progressive Web App (PWA), simulating an app experience through service workers that cache the app on the user’s device and update it when a new version is available. This ensures exceptional responsiveness and speed, as the code is pre-downloaded onto the user’s device, requiring only data retrieval to display personalized content for logged-in users.

We distribute the app through AWS's Content Delivery Network, CloudFront, which caches app files from S3 buckets, enhancing the speed, particularly during initial launch.

All user-requested information is served through our API hosted on AWS EC2 servers, supported by a load balancer for scalable performance based on demand.

Our strategy of leveraging PWA standards and AWS resources has yielded significant benefits for both end users and the company. Key achievements include:

• Rapid Loading Times

Our platform consistently achieves first-load times of under 500 milliseconds, surpassing Google's recommended loading time of under 2 seconds. This swift loading is crucial for enhancing user experience and reducing bounce rates.

• Scalability

By utilizing S3 buckets for the platform, we ensure a secure and reliable system that can accommodate a large volume of voice recordings and content generated daily.

Additionally, employing elastic load balancers for EC2 servers guarantees prompt responses to API requests, regardless of the platform's traffic load or the number of concurrent users.

• Cost Efficiency

Through the strategic use of service workers to cache data on users' devices, we significantly reduce the load on the CloudFront service, resulting in lower costs associated with data transmission and storage.

This cost-effective approach enhances our overall operational efficiency while maintaining high performance standards.

Class & Home

Phone & laptop view.

Booking screens

Laptop & Phone view.

Flow Steps

Select course, book class, take class & practise on activites.

Quiz for Process Inovation

Quiz view on Tablet.

Courses preview screens 

Different course preview on phone screens.

Performace cards

Performnce cards from home screen from the last class.