Mid Sweden University

The goal of this project was to develop a technically sustainable, editor-friendly, and user-centered solution for displaying and searching courses on SSG’s external website. The project is part of a larger transition in which the company has chosen to implement Optimizely CMS 12 to increase control, scalability, and flexibility. The work included both backend and frontend development and was based on a design prototype provided by the company's UX designer. The technical implementation was carried out using C# in a traditional MVC architecture, along with TypeScript and Tailwind CSS for the frontend. Two main features were developed: a page type for individual course pages and a reusable course search block with functionality for filtering, searching, and pagination. An API endpoint was implemented to enable dynamic data loading in the frontend without page reloads. The functionality was manually tested both locally and in a staging environment in collaboration with editors. The results show that all project objectives have been achieved. The final solution offers a responsive and flexible structure that is easy to use for editors and improves the user experience. The conclusions highlight the importance of accessibility, multilingual support, and editor usability, as well as opportunities for future development such as performance optimization and extended filtering options.

Målet med detta projekt har varit att utveckla en tekniskt hållbar, redaktörsvänlig och användarcentrerad lösning för att visa och söka bland kurser på SSG:s externa webbplats. Projektet är en del av en större omställning där företaget valt att implementera Optimizely CMS 12 för ökad kontroll, skalbarhet och flexibilitet. Arbetet har omfattat både backend- och frontendutveckling och baserats på en färdig prototyp framtagen av företagets UX-designer. Den tekniska implementationen har genomförts med C# i en klassisk MVC-struktur samt TypeScript och Tailwind CSS för frontend. I projektet har två huvudsakliga funktioner utvecklats: en sidtyp för kurssidor och ett återanvändbart block för kursöversikt med sök-, filter- och pagineringsfunktionalitet. En API-endpoint har implementerats för att möjliggöra dynamisk dataladdning i frontend utan sidomladdning. Funktionaliteten har testats manuellt både lokalt och i stagingmiljö i samverkan med redaktörer. Resultatet visar att samtliga projektmål har uppnåtts. Den färdiga lösningen erbjuder en responsiv och flexibel struktur som är lätt att använda för redaktörer och ger en förbättrad användarupplevelse. I slutsatserna betonas vikten av tillgänglighet, språkstöd och redaktörsvänlighet, samt möjligheter till vidareutveckling såsom prestandaanpassningar och utökade filterfunktioner.