MUSA

ROLE

Development, Technical SEO

TIMELINE

June '25 - Aug '25

Overview

MUSA (Museums for All) is an accessible digital museum platform designed to help Deaf visitors engage with cultural experiences through Irish Sign Language (ISL) interpretation, interactive games, and digital artefacts.

It was developed as the final project of the Interactive Digital Media MSc at Trinity College Dublin, where I worked as part of a five-person team in ongoing collaboration with The Hunt Museum in Limerick.

My role

I was responsible for the full-stack development of the website, including:

frontend development (Vue.js, JavaScript, CSS3, HTML5);
backend development (Nuxt - Nitro server routes);
database design and integration (MySQL);
accessibility, performance and technical SEO;
deployment.

Development

Scalability was a key consideration from the start, as MUSA was developed with The Hunt Museum as the first partner while keeping future expansion to other museums in mind.

Using Vue's component and template system, I created reusable layouts and page templates for museum pages, artefact pages, and interactive games. This meant that the same page structures could be reused across different museums and collections, while changes to a shared template could be made in one place rather than across individual pages.

The same principle applied to the database: rather than duplicating tables for each museum, I designed a relational MySQL schema where museums, artefacts, categories, materials, and games are all connected through shared tables. Artefacts link to their categories and materials through join tables, support multiple images through a dedicated table, and every game type belongs to a specific museum.

Nuxt's server engine (Nitro) provided the API layer, retrieving and serving the appropriate content based on the requested museum and content type, which kept the platform's interface structures fully decoupled from its content.

Accessibility, Performance & Technical SEO

I followed the Web Content Accessibility Guidelines (WCAG) when developing the platform, testing the site with the Web Accessibility Evaluation tool (WAVE) and Google Lighthouse to identify and fix accessibility issues including heading structure, colour contrast, alt text, ARIA labels, and keyboard operability across interactive components such as navigation menus, dropdowns, sliders, and buttons.

Each artefact page relies on high-resolution photography so visitors can examine objects closely. To prevent this from affecting page load times, I compressed image assets and converted them to WebP, reducing file sizes with little to no visible quality loss. I also prioritised loading content that was immediately visible. For instance, on each artefact page, the image carousel eagerly loads its first image while the remaining images load lazily as visitors browse through them, keeping the initial page load lighter.

Even with these optimisations, slower connections or heavier pages could still result in a blank interface while data was being fetched. Skeleton loading states were therefore added to content-heavy views such as the Museums page, allowing the layout to render before the content arrives. This provides a safeguard as the platform grows and more museums are added.

Finally, I layered caching across the stack to avoid repeatedly fetching content that has not changed. The application sets different cache durations depending on the content: short for API responses that can change and long, immutable durations for build assets. A CDN also caches static content, including artefact images, at the edge, while browser caching allows visitors to reuse files locally on repeat visits.