About the Project
The client came with an ambitious but very relatable vision: make internal knowledge sharing feel less like “mandatory training” and more like a social, game-inspired experience that people actually want to come back to. Instead of traditional static courses, they wanted something dynamic, with clear feedback and progress you can really feel.
The result is a gamified EdTech platform designed for teams across departments and even across different companies. It encourages employees to learn, share expertise, and collaborate in a space that feels more like a game than a rigid LMS. Being a true knowledge-sharing platform, it brings together content, collaboration, and progress tracking in one place. Points, leaderboards, badges, and team challenges turn everyday learning and process reinforcement into a game-like learning experience.
In addition, the system supports use cases like onboarding new hires, strengthening internal processes, and circulating internal know‑how. Instead of just “reading and forgetting,” employees are rewarded for their activity, which helps turn passive content consumption into an active, continuous learning loop inside a corporate learning platform.
Interesting Facts
Before Lumitech stepped in, the client already had a live web platform used by companies to manage tasks, goals, roadmaps, and progress. It was not a greenfield project; it was a living system that needed a second life.
The platform was doing more than just learning: it combined productivity tools with a growing employee learning platform, making it an unusual but powerful mix of work and education in one interface.
French was the main interface language, but the rebuilt version now supports full i18n, with localized routes like /fr, /en, and /es, making language expansion much easier.
Just three months after the launch of the new frontend, the platform had 3,000+ active users across more than 10 companies, which showed that the new UX and performance were working in the real world.
Client Request
The business problem was quite typical for growing products. The existing frontend did its job for a while but over time it became outdated, hard to maintain, and visually behind modern standards. The design no longer matched expectations, the codebase was blocking new features, and the project structure made scaling complicated.
The client asked Lumitech to:
Fully rework the frontend for two web apps (client and admin) on a modern stack.
Keep the existing backend and business logic untouched, while giving the product a fresh UI and a truly interactive learning platform experience.
Ensure stable work even on low connections, with high responsiveness and smooth animations.
Add proper security for routes and data, and deliver full multi-language support from the start.
So the real request was to turn an old interface into a modern corporate learning system and workspace without breaking what already works in production. While this sounds simple on paper, in practice it required careful and respectful refactoring.
Approach
Being aware that real customers were already using the platform, Lumitech chose an iterative and pragmatic approach. There was no big-bang rewrite thrown over the wall. Instead, we first agreed on the technological foundation and then moved step by step.
We started by choosing a modern stack: Nuxt 3 (Vue 3), TypeScript, Pinia for state, Vue Router for navigation, Tailwind CSS for styling, plus supporting tools like Zod, i18n, GSAP, VueUse, Color.js, Swiper, vue-sonner, and vaul-vue.
The first months were dedicated mostly to UI: building a reusable component library, shaping the visual system, and making sure the new design was responsive and accessible.
Only after the UI system felt stable, we connected APIs, integrated external services like Stripe, Google Maps, ImageKit, GTM, and wired the new frontend to the client’s backend.
Work was done in short iterations, with regular demos, quick bug fixing, and direct feedback from the client’s team. While the client handled backend refactoring on their side, Lumitech focused on frontend architecture, learning gamification features, and usability. Nevertheless, communication between teams stayed tight, so changes on one side did not surprise the other.
Challenges
Even with a clear plan, there were several important challenges to solve along the way:
Rewriting old logic for a new design. We had to keep the same business rules but express them in a different UI and code structure. This meant carefully mapping existing flows and making sure nothing got “lost in translation.”
Keeping layouts stable across devices. The new platform had to look and behave correctly on many screen sizes. Responsive design sounds standard, but with complex modules and team-based learning platform features, it required extra attention.
Creating animations that feel smooth but still fast. The client wanted the platform to feel modern and lively, with animated transitions and motion. At the same time, performance had to stay strong, even under weaker connections.
Managing colors and branding. The product used a detailed color palette, handled via Color.js, where different shades matter a lot. Ensuring consistency here was not trivial.
Integrating with the existing backend. Since the backend logic remained, we had to adapt the frontend carefully to current APIs, including edge cases and legacy behavior.
Synchronizing many modules. With more than 30 isolated modules and shared state in Pinia, keeping everything in sync and predictable required solid architecture and disciplined coding.
Still, using SPA architecture, composables, and type-safe forms with Zod helped keep the project maintainable and easier to extend over time.
Features
Over the course of development, the solution evolved into a flexible employee training platform and workspace, covering both learning and daily operations. Some of the most important areas include:
Gamified Learning and Collaboration
At its core, the product is a gamified learning platform. Users receive points, collect badges, compete on leaderboards, and join team challenges. These gamification in learning mechanics are not only cosmetic — they also directly support:
Higher employee engagement in learning, as people see their progress and recognition.
Group missions and challenges that make training feel more social and like a team-based learning platform.
A collaborative learning platform culture, where users are encouraged to contribute to the knowledge base, not just read it.
Together, these features turn the system into something closer to a game hub than a classic LMS, while still aligned with real business goals.
Business Tools for Companies
The platform is more than a training portal. It brings many corporate tools into one corporate training solution and work environment, including:
Customer Management
Documents (file and document workflows)
Chat (built‑in communication)
Quotes (commercial offers and pricing)
Goals & Accomplishments
Missions (task and mission management)
Marketplace (internal marketplace)
Roadmap (planning and task evolution)
Knowledge Base
Notes
Partner Management
Portfolio (cases and projects)
Subscriptions (billing and plans)
This way, learning lives close to daily work, making the software a real employee learning platform and not just a side system.
Authentication, Security, and Roles
Security and access control were treated as must‑have, not nice‑to‑have:
Login and registration support two‑factor authentication (2FA) for extra safety.
A double opt‑in email system ensures accounts are verified before they gain access.
Password recovery flows are in place.
Auth middleware protects private routes and sensitive data.
An admin panel lets organizations configure their modules, manage users, and tailor the experience per company.
Being a corporate learning system, this level of protection was essential for trust.
Multi-language Experience
The rebuilt frontend now offers full i18n support. While French is the default language, the platform is ready for other locales through:
Prefixed routes like /fr, /en, /es for clean separation.
All texts moved into localization files, which makes translation and future expansion much easier.
This makes it simpler to offer a consistent employee training platform experience in multiple regions.
Modern UI/UX and Interactions
To align with the “feels more like a game” vision, UX and visuals play a central role:
Responsive design ensures usability on laptops, tablets, and phones.
Animated transitions built on GSAP and Vue transitions create a smooth, modern feel between screens.
Toast notifications via vue‑sonner and modal windows via vaul‑vue keep interactions lightweight and clear.
Drag & drop interfaces allow intuitive rearranging and interaction with content.
Data visualization components help teams see KPIs, progress, and other important indicators at a glance.
Altogether, these elements support a corporate learning platform that feels fresh instead of heavy.
Architecture and Integrations
Under the hood, the platform is a SPA built with:
Nuxt.js (Vue 3), TypeScript, Tailwind CSS, Shadcn Vue.
Pinia for centralized state management, Vue Router for routing, VueUse and composables for reusable logic.
Zod for type-safe forms and validation, Day.js for time handling, Color.js for palette logic.
Stripe for payments and subscriptions, Google Maps API for location features, FontAwesome, ImageKit for image handling, and Google Tag Manager for analytics.
This stack enables a robust corporate training solution that can grow with new modules and features without constant rewrites.
Summary
In around six months, Lumitech delivered a new frontend for both user-facing and admin applications, while the client refactored their backend in parallel. Once both sides were aligned, the MVP went live and started serving real companies and their teams.
The outcomes are clear:
The platform became more stable, more adaptive, and visually aligned with modern expectations.
A modular architecture made it easier to maintain and extend new functionality over time.
The admin panel gave companies more control over what features they use and how they manage their content and users.
In just three months after launch, the system already had 3,000+ active users across more than 10 companies, which is a strong signal that users accepted and enjoyed the new experience.
What’s more, the platform now truly reflects the original idea: a gamified corporate training and work environment where internal processes, knowledge, and learning come together in a single, engaging place.
