Live Nation

A search engine for music industry professionals.

www.lnvenues.com

Overview

Live Nation is a global, industry-leading live entertainment company boasting the production of over 40,000 live events each year.

At the time of this project, Live Nation had trouble connecting industry professionals to accurate and comprehensive resources needed to research venues across the country.

In solving for this, I designed a venue database that connects music professionals to Live Nation venue information easily.

Role

UX/UI Designer
Project Manager

Tools

Figma
Adobe Illustrator
Github
Sanity

Using Research to Guide Filter and Search Functionality

5 music industry professionals were interviewed to determine which venue features and characteristics were most important in performing research.

I used interviewees’ prioritizations in searching for venues by capacity, artist lineup, whether the venue is owned & operated by Live Nation, restrictions, environment, and amenities in creating a filter system for the site.

Finessing Map & Search Results Logic

The relationship between the map and the filters is the crux of this search engine because they work together as the main visual tool in performing venue research.

As the filters are applied, the map adjusts its zoom level to reflect the search query. Conversely, if a user decides to search via the map, the venue card results reorganize to reflect the venue pins displayed.

It was important to allow for users to quickly scan across both sets of data, so I designed a red card active state that appears if the corresponding venue pin is being hovered on.

Mobile Design

In accommodating the large number of filter options, filters are stored within distinct modals, and there is both a “map view” and a “list view” toggle.

Responsive Design on Content Heavy Pages

One of the most challenging parts of this project was determining how all components should respond at various screensizes.

Collaborating with two developers and utilizing devtools, I laid out the framework for combining both mobile and desktop elements to create a responsive design that was friendly to all viewport sizes.

For example, although originally intended to be a solely mobile feature, the floating tech pack modal on desktop began cramming the left side content as the user decreased the browser size. By incorporating the mobile styled Tech Pack tool bar at about 600px on desktop, the issue was eliminated.

Planning for Edge Cases With a Custom CMS

The venue detail pages are saturated with content, so this page needed to be scannable and easy to read. Furthermore, because all content blocks are fully customizable via a Sanity CMS, I assessed all edge cases for instances in which information which might be missing and ensure that the page still felt complete even if "missing" information.

I also had the pleasure in testing our CMS system, working with developers to make sure specific tools were in place, such as a preview function, and onboarding the client.

In order to test venue content blocks as we were in development, I made several test venues to represent edge cases. I also advised the client about these venues so they could QA properly.