WorkCast Webinar Template Redesign
My role as a Digital Designer at WorkCast involved working on a day to day basis branding a clients Online Event Template experience. A WorkCast template consists of a Registration form, which leads to a thanks page which gives the attendee event options and finally an Auditorium where the attendees will view and engage in the online event.
Towards the end of my time in WorkCast, I undertook one of the largest overhauls on these templates which would change the template game forever…
The Challenge
The challenge itself was to take all 10 of WorkCast’s webinar templates and overhaul them to be branded using 3 CSS Variables. The idea behind this was so anyone could brand a template, particularly clients using clear naming conventions so you were able to know what is what. With such a large overhaul, many challenges would present themselves. Both from the requirements to technical constraints which were out of scope for the project. The challenges are listed below: Large Codebase with often unused or duplicate code causing page slowdown Messy code with a lack of comments or documentation so alot of discovery to find out what's what. Out of date libraries which require updating Constraints to certain HTML tags due to the nature of the WorkCast templates being setup to work with the WorkCast platform Finding the best way to to improve the overall look and feel of the WorkCast templates with only 3 key entities.
The Solution
The Results...
Below is an overview of each of the 10 refreshed WorkCast templates, giving an overview of each template and there unique features, plus a supporting link to view them yourself.
Angular
The Angular template earns its name from an Angular background image, with its key features being the background which can be customisable to a client colour pallet, but also the animated splash screen within the auditorium...
Breeze
The Breeze template is by far one of the more popular designs we have on offer, more so due to its sheer versatility. The breeze template offers the key groundwork and structure designed for more custom and versatile layouts making it a popular pick for all clients.
Blur
The Blur template is named after one of its key features, a blur overlay for content. This template is designed more for clients with high quality background imagery and them wanting to use this template as a way to show off the imagery as best as possible, The auditorium also features an accordion to output content.
Evolve
Evolve was a template which kickstarted the next generation of designs hence the name Evolve. This template prooved popular due to the movement and animation of content on page load and slsecting specific content. This template was also one of the more complex to develop and design
Flow
Flow is a unique template in the sense of the audience member being able to define the layout of there event experience. This is done in the auditorium with 'pods' which can be hidden or resized depending on how the user wishes to consume the media.
Fold
Fold features a more neutral colour pallet in comparison to other templates, but has quickly re-established itself as one of the more popular templates since this piece of work was done. Its name via the fold effect going between content within the event auditorium.
Forward
Forward is unique in the sense it allows clients to add an additional banner to there event experience. This in turn has made it one of the most popular templates as clients can again influence there brand, or sponsors brand within the template.
Modular
Modular again offers the audience member the chance to configure there event experience with customisable pods in the event auditorium. This template also offers the user to choose from a set of predefined layouts should they wish not to use the default view.
Twilight
Twilight is one of our darker themed templates and is also one of our more accessible templates. Featuring an animated splash in the auditorium, twilight is a more unique layout and has massive branding potential.
Video
Video offers a similar event experience to that of blur within the event auditorium, the main difference is the addition of a background video which loops within the reg page giving the template an event more dynamic effect.
The Solution