The client is a non-commercial organization based in the UK. The company is focused on young parents' education through organizing online and offline events, developing educational courses, and supporting the young parents’ network around the world. The client’s website exists to inform young parents about upcoming courses and events and give them the possibility to sign up for them.
Problem
The client requested a website redesign with the implementation of additional functionalities. The main goal of the website update was to increase user experience and boost up young parents' engagement at company events. New functionality had to allow site visitors to see upcoming events and search for specific ones by applying filters such as event type, date, branch location, and distance to it. The user also had to be able to switch from course to event search and vice versa without losing set filters. The page also had to include:
- short description of each event;
- map with events location;
- button to change the page layout;
- “view more” functionality.
Solutions
To meet the client’s needs, AWG has redesigned the company website content architecture. We have implemented the events and courses search system with a combination of standard Drupal tools and custom modules.
A search form has been implemented with a custom Drupal plugin.
Results filtering feature was implemented with a combination of complementary Drupal plugins. Each plugin ensures proper work of filtering system elements such as date, postal code, branch location, event type, and distance.
The plugin calculates the distance to the event location using Google Maps and the postal code provided by the visitor. Once the distance to all available events has been calculated, the system proceeds to filter the search results using the distance parameter selected.
The search page also has a custom block that displays the closest branches based on the postal code provided by the user.
Each search result has a “see on the map” button redirecting the visitor to the map. A visitor can click on the map block implemented with Google Maps to see a full-size map with events relevant to his/her search. Event locations are displayed on the map thanks to the custom JS code and Google Maps API. Users are also able to see an event description in a slide format.
For visitors' convenience, the AWG team has created a special functionality that allows page layout change. Switching layout will not cause any changes in the search results.
The same way works custom plugin that allows fast quick switching from events to courses search without filtering parameters lost.
As mobile-friendly is the main requirement for a successful website at the time being, we have created a 100% functional mobile website version that is perfectly displayed on various sized devices.
Results
The client has received a fully functioning redesigned website. With the new website functionalities, visitors have gotten the possibility to follow company courses and events; search for the most convenient option by location, type, date, and other criteria. Website update has positively affected user satisfaction, increased engagement, and boosted site traffic by 50%.