The Abbeyfield project involved building the front-end for a website designed to showcase retirement homes and care options for older adults. The primary goal was to create a site that is accessible, responsive, and user-friendly, reflecting Abbeyfield’s commitment to social connection, independence, and person-centred care.
Using Umbraco CMS for the backend, I developed each frontend component individually with Fractal, a component library system that allowed for modular, reusable design elements. This ensured consistency across the site and simplified maintenance and future updates.
For styling and interactivity, I implemented SCSS for scalable, maintainable styles, and JavaScript to add dynamic features, including a postcode lookup and geolocation-enabled search bar. These features allow users to quickly find nearby Abbeyfield homes and care options, improving the site’s usability and aligning with the needs of older adults and their families.
The project also utilized NPM for package management and build processes, ensuring a modern, efficient development workflow. All HTML was crafted with semantic, accessible HTML5, prioritizing usability for older adults and following best practices for accessibility.
Key highlights of this project include:
- Modular, reusable components built with Fractal.
- Responsive, accessible design for older users.
- Dynamic search functionality, including postcode lookup and geolocation features.
- Modern front-end workflow using SCSS, JavaScript, NPM, and HTML5.
- Translating a client’s vision into a functional, maintainable, and user-centered web experience.
This project demonstrates my ability to combine technical expertise with thoughtful user experience design, creating an interactive, real-world website that meets both client and end-user needs. It serves as a strong example of my work in building high-quality, modern front-end applications for real-world clients.