Project Overview
The YMCA NSW (the Y) is a not-for-profit charity that operates in more than 40 communities across NSW. Through the core divisions of Recreation, Camping and Children’s Services, the Y offers a range of programs that focus on bringing families together, healthy living, developing young people and helping those less fortunate.
The new responsive YMCA website was launched in December 2013 after a four month project period, with a focus on encompassing the core divisions. Key features of this project include:
- A full overhaul of the existing information architecture and primary navigation via a comprehensive planning process
- Brand new site design with up to 20 templates for three different breakpoints (desktop, tablet and mobile – 60 templates total)
- A new, fully-responsive website designed to work across desktop, tablet and mobile
- Up to 40+ individual centre microsites within the main YMCA site where the look and feel can be customised with centre colours all managed within the same back-end.
- Supports publishing of commonly shared information between microsites
- Integrated location services to help users effortlessly find their perfect centre
- Tailored centre directory that supports scalability.
Project Commissioner
Project Creator
Team
The project team bought together a mix of design skills (why we’re here) coupled with front and back end development skills, overseen by Butterfly’s Digital Producer (Brad Masters) and managed by Jasmine Lopez at YMCA NSW who was the main project contact.
Jasmine Lopez – Project Manager (YMCA NSW)
Brad Masters – Digital Producer
Sophie Gulbenkian – Designer
Sean Shi – Team Leader
Bassam Othman – Senior developer
Draco Chan – Developer
Project Brief
A number of reported issues with the existing site were the catalyst for a responsive site build. These issues were considered prior to project commencement, and helped to shape the final project specification. For example, the previous website lacked usability across multiple devices, so responsiveness was crucial in the new site build.
There was a mobile and desktop site, but the mobile version had limited information and functionality. YMCA received feedback that users were frustrated that the functionality on desktop was not available on mobile. The key objective of the redevelopment was to move away from a closed-source CMS (that was difficult for administrators to update) and to incorporate all three YMCA NSW core divisions: Recreation, Camping and Out of School Hours Care, while invigorating YMCA’s visual presence in the online space.
For the face and personality of the website, the branding needed to be consistent across each division to improve user familiarity and experience with the YMCA NSW brand.
Project Innovation/Need
Just the right amount of iconography coupled with consistent design (echoing industry best practice), allowed us to pull off the following innovative features.
Improved location services - allows mobile users to find their nearest YMCA NSW centre without filling in location details information, the outcome is more agile usability. Taking centre search one step further, we added the ability to find a centre close by that has certain programs such as gymnastics & aquatics. This search allows users to filter all locations by service availability.
Simplified content management - was crucial; but designing this was difficult - the website had to be intuitive enough to allow simplified administration for the 100+ centres’ unique content, custom local council branding and some specific domain names.
With the website representing all core divisions of the organisation and 100+ recreational centres the sitemap was massive – but it still had to look great!
Comprehensive centre directory – Graphical banners or menu items allow the centres to promote their content individually. A custom tool deftly handles the management of all centre information including program availability, current promotions, news, contact details, trading hours and social network information.
Design Challenge
The new website had to be responsive to ensure it was compatible across a range of devices, to maximise usability now and in the future to support the changing digital space.
The design challenge became how to pack in all that information – without compromising the look and feel. A single centre includes programs, timetables, opening hours, contact details and the design had to accommodate all of them via a CMS that allowed the administrator to quickly and easily make updates.
Throw into the mix the ability to allow YMCA NSW to publish commonly shared information across all centres, without updating each of these individually, as well as editing each centre’s look and feel, and then design a responsive template solution to support all of that, the design became a challenge in itself, before functionality could even be included.
User Experience
Good user experience requires planning, planning, and yet more planning! The sitemap and architecture of the primary navigation and YMCA centre requirements were fully mapped out at an early stage to ensure we were able to efficiently communicate the full suite of YMCA services and programs to promote engagement.
Designing the site from the beginning with fully integrated features to help users find the perfect centre helped to support the user experience from early on. There is a variety of mechanisms including: advanced search, the ‘Find your nearest Y’ search feature, location search by service, centres by service directory or simply in the location directory. Providing users with different paths to the centre information helps to ensure they find a centre that would work with their location and service needs.
The centre directory architecture was created with scalability of the YMCA NSW centres in mind. The outcome was super flexible, allowing branding to be applied to new centres by simply uploading a supplementary logo and selecting a primary and secondary colour for the centre. This gives administrators the freedom to apply the background, modules, headings, forms and more.
Digital Experience - Website
This award celebrates innovation and creativity in design of a unique user experience in the combination of text, audio, still images, animation, video, and interactivity content for websites. Consideration given to clarity of communication and the matching information style to audience.
More Details