The Royal British Legion: Events

BPL Marketing was briefed by the Royal British Legion to produce a new events section within the main website, to replace a legacy events-listing and search feature and improve usability, performance, and engagement. The brief prioritised mobile compatibility, and detailed filtering options, to enable users to find events within certain distances or time frames relative to them. My role in this project involved specification of design and technical requirements from the initial brief, subsequent wireframes and UI design work, and front end development in Vue.js. 

In response to the initial brief, I put forward a number of suggestions to the client to improve the overall experience, including the use of the Google Maps API, to provide a visual representation of users' filter and search settings, in addition to a list of results, so as to create a more engaging user experience with clear visual cues. I additionally suggested implementing the feature in Vue.js, and accessing data via a JSON API to improve upon the previous, server-side implementation, eliminating page reloads and providing a seamless, reactive interface. The UI was designed and prototyped using a mobile-first, methodology in Adobe XD.