Bespoke Design
Stunning Ecommerce Sites
Professional Wordpress Support
Social Media Marketing

Re-designing the “Lincoln Performing Arts Centre” Website

Share This Post

Re-designing the “Lincoln Performing Arts Centre” Website

A while ago I booked tickets to go see a show via the LPAC website (Lincoln Performing Arts Centre) but found the site somewhat cumbersome to navigate and use. I took a few hours of a weekend to look at the page I found most confusing, and created a working mock-up that shows how I would address some of the issues present in the original design. I did this using assets available to me, and by utilising the design aesthetic of the original website. 

Making Things Clearer

In the original design of the website, certain aspects weren’t clear. There are floating icons that at a glance, don’t seem uniform, and don’t mean much as they are not standardised icons. Notice how the “ticket” and “Information” icons actually sit at the top right of one event, but all others sit at bottom right.

There are other issues here too, such as images not sitting properly above titles, and the lack of spacing between Event Title and Event Description

My Attempt

In my version pictured below, I took all existing images and text, and made them sit more inline. Images are as they were on site, so things like stretched images are because of bad source files.

I removed the strange downward facing “What’s On” text from the original site, and instead opted for a standard heading that is easy to see and read. I’ve made use of theatre mask icons and dividers to make the content easier to digest. The ticket icon now uses the one used on the Header of the original site, and the “I” Icon has been replaced with a high contrast button that fits the Purple and Black used elsewhere on the site.

Event Pages - A Missed Opportunity

The Events page on a website that sells tickets should be engaging to the user and easy to read. Unfortunately on the current site, the content is strangely formatted and features lots of blank / white space.

See Below

I started by fixing alignment, adding in a Dropcap, and making the content slightly wider.

I went to social media to see if I could find any promotional material for this specific event. I managed to find images that I used to create a simple gallery. This is a lot more engaging to a potential event-goer. I added a heading to each section that used more engaging and welcoming language. 

See below 

Other Changes

There are a few other design changes I made to the site.

  • All events display on the “What’s On” page.
  • There’s a Footer with a “You May Also Like” section.
  • Events load in via an animation as you scroll down.
  • The Header has been slightly improved, and only shows what’s relevant to Mobile Users.

Don’t take my word for it though. Take a look at the live mock-up here

More To Explore

How to Use After Effects Templates

Adobe After Effects is a video-based tool that’s used to add elements to moving pictures and animations. Designers use it to create titles, intros, and