Newable Events

Newable helps businesses thrive through funding, professional support and premises. Unleashing potential, building resilience & championing growth.

Project Overview

With the lack of events taking place in 2020, the events team at Newable saw an opportunity to completely re-vamp the Newable events portal. As well as the customer facing website, which took a cleaner approach and focusing on virtual events & webinars, the admin area was also improved to simplify the management of events for the team.

Platform

Web

Tools
  • Figma
  • Laravel
  • Vue
  • MySQL
  • HTML & CSS
  • JS
  • Role

    UI Designer & Web Developer

    Duration

    5 Months | May-Oct 2020

    The Problem

    The old Newable events website lacked filtering options, as more events were taking place this made it tougher for users to search. The website’s user interface was not cohesive with the new corporate Newable website branding. The administration area also lacked organisation, as the events department needed to be able to manage events more efficiently.

    The Solution

    The aim is an updated and modern UI website design fitting the company branding and other web applications for Newable. Filtering options by topics and organisations to ensure searching for an event is more streamlined, as well as an updated administration CMS area, so the team will be able to manage events and registrations.

    Design

    Style Guide

    A style guide was created to highlight the importance of the Newable branding that had to be consistent throughout the events portal.

    Low-fidelity Wireframes

    Low-fidelity wireframes have been created for the Newable events home page and the individual events pages.

    Home Page
    Events Page

    Mid-fidelity Prototypes

    Based on the wireframes, mid-fidelity prototypes have been created using Figma to approximate what the final webiste will look like.

    Desktop
    Mobile

    Product

    The events website was developed be myself and the rest of the web development team. The website has been developed using mainly Laravel, Vue.js and PHP

    Search & Filters

    From a customer’s perspective, the key innovation that has been introduced is the possibility to search events by keywords and to filter them by topic and/or organisation/programme simultaneously – something that was not possible in the previous website, where events were only searchable by date.

    These new features will make it easier for customers to find the right events for their business.

    Branding and UI

    The portal layout is much more in line with the look and feel of the Newable website and its home page has been designed to facilitate access to the live events across all programmes in a simpler and more intuitive way. Vue.js was used to develop the slick filter and search events area

    Tagging

    Tagging the events help advisers to quickly identify the live activities organised under their programme and, as events pull through the individual Advice business solution pages based on tags. Tags are managed in the events admin area.

    Admin Dashboard

    At an operational level, the portal is packed with new functionalities that will help the events team to be more efficient in setting up and manging events and registrations across all supported programmes.

    The dashboard has been customised to make sure all features are easily accessible and admins are able to view, at a glance, important data on events and registrations.

    Managing Events

    The improved events creation system has saved time with repetitive tasks and facilitates the overall customer journey i.e. enabling waitlists for oversubscribed activities and adding user-friendly event specific questions with dropdowns and checkboxes, not just open text as before.

    Summary

    Overall this project was a success, with positive feedback from both the events team and other employees. The events team managed to run more events in the first three quarters of the current financial year than in the entire FY 2019/2020. The collaboration between the web and events team was fairly straight forward and communication was streamlined.

    My involvement in this project was vital as I was both UI designer and a major part of the development process.

    Challenges

    The biggest challenge was when to put a pause on the project, as there were many more ideas the events team suggested during the development process. We came to an agreement to having a cooling off period of 10 days after launch to go through any issues or improvements that needed to be made.

    Future Improvements

    One aspect of the portal website that was discussed with the events teams was not having a Newable logo on the events pages. Unfortunately, it was a key requirement for the team to continue organising events for some external clients.

    The lack of logo means the navigation on mobile is redundant, as there is not a default way to go back to the home page, effectively trapping the user on the page they’re currently on and is damaging to the overall user experience.

    There are a few options that have been mentioned such as incorporating organisations' logos in the header of each event page or having a CTA button ‘Event Home’ at the bottom of each page to make this step clearer.