Interactive Floorplans


  • Concept Design
  • Prototyping
  • User Testing
  • Development
  • Entrepreneur?


6 months


The Brief

To create a webapp tool that allows for improved management of exhibitions by visualising the layout and linking exhibitor data to the the visualisations.  This needed to be used as a CMS by the events team and as a useful tool for visitors at the exhibition to navigate around the show.

The Outcome

Once the project had been fully scoped and researched REACT app was produced with data from a WordPress CMS. The data is provided by a custom API and linked to an SVG image of the floorplan with interactivity integrated with the D3.js library.

As this had to be able to work at an event which might have no internet connection the app was designed as a fully downloadable PWA.

Key functionality included

  • Searchable – locate where a company is based
  • Interactive click and drag – identify who is on a specific stand
  • Front-end adding and editing of exhibitors
  • Image cropping interface

Event Management and Navigation

Exhibition Management

By allowing the team to directly add exhibitors to the platform through the floorplan (reserving or confirming stands) spreadsheets can be eliminated and everyone on the team is always dealing with the most up to date information. The system can even do basic error reporting e.g if someone is assigned a stand that doesn’t exist or is double booked.

When turned on the sales team can use the “show taken” option to help potential customers identify the stands they want.

Attendee Perspective

Attendees in the meantime wanted to be able to easily and quickly navigate an exhibition hall but were reduced to looking up exhibitors in a list and searching for a corresponding stand number. Once the event decide to turn this tool on, attendees can easily search a list of exhibitors and highlight them on the interactive map.

Front-end Editing

As well as being a more intuitive way to interact with the exhibitor data a front-end editing experience allows sale staff to take mobile devices around the exhibition and have access to all the latest data. As stands are sold they can visually see what areas are still available and reserve them for themselves. This prevents stands being double booked and allows the team to work together with the most up to date information.

Full exhibitor details can be added including a logo, bio and all contact details without leaving the floorplan page.

Quick Crop Images

All logos need to be uploaded in the same format to maintain the design format. To save time cropping and editing photos in external software a cropping interface was created.