Camilo the Magician // UX Design

When Camilo approached our UX team with the idea of improving his online presence we weren’t sure which side of him we were going to get at the initial meeting. The kind, gentle, child friendly magician, or the mysterious, charismatic figure you’d see on stage at a corporate event. Our prior research had indicated that he was a man of many crowds and with that came the necessity for multiple personalities.

The Goal

Create a website that caters to the diverse types of people looking at hiring Camilo for an event or signing their child up for magic lessons and camps.

Research

Content Audit & Information Architecture

We immediately conducted some simple user tests based around the main functions of his current website.

  • Booking a corporate event
  • Purchasing a ticket for a live performance
  • Enrolling a child in Magic Camp

This gave us our first overview of the current pain points and struggles that users were having as a number of tasks came back incomplete. While running through the scenarios it was also apparent that nearly every link on the site directed a user to just two places. Booking and Magic Camp.

User Interviews & Survey Insights

The contact list we received from Camilo for interviews was quite biased as a number of them were friends of the magician. If we were going to reach out to these people we had to be very clear in what we were hoping to gain from this type of user. Questions were largely based around what makes him different than other entertainers and what frustrations they had with the current site.

After exhausting the initial list we reached out to event planners and also parents looking to sign-up a child in any form of summer camp.

A survey was also published that had a number of short form answer questions aimed towards gaining more qualitative data to make up for the lack of interviewees.

Key Insights

  • Testimonials are a Must Have
  • Initial event information needs to be in point form
  • Talent recruiters want a downloadable PDF
  • Parents want to know the soft skills a child will learn
  • Place associated media with the work in question
  • “About Me” should be the home as each user considers that first
  • Website should reflect what he’s being hired for i.e “tailored content like a resume.”

One thing that continually came up in the research conducted was the notion of potentially creating more than one site. Again breaking everything down like the content audit and separating learning magic from hiring Camilo

Primary & Secondary Persona

As the multi-site idea came through in our data it also pushed our findings towards two distinct personas. The deciding factor between which one would become our primary was based around the persona that best met both the business goals and user goals. A primary that was hoping to hire Camilo for a corporate event and a secondary that wanted a positive, creative experience for their child to learn new skills.

Primary

Julia works as a recruiter for an event planning agency in town and is often looking for new entertainment through industry recommendations.

Frustrations

  • Events page is too heavy and cluttered
  • No testimonials

Goals

  • Gather information quickly
  • Download a PDF of event details to show hiring team

Secondary

Hailey was then created as the secondary persona because the user flow of a parent landing on the web site was different enough that it required it’s own time and focus. The research data called for similar layout hierarchy to the corporate side but with a focus on soft skills instead of event type.

Frustrations

  • Can’t find where lessons take place
  • No information on the skills they’ll learn

Goals

  • Find out the expectations from a Magic Camp
  • Sign her children up for camp with confidence

Design Studio

Being guided by our research we built a feature list for our design studio session. The format was to do 2 minute sketch sprints, critique, then re-iterate until we felt comfortable that all features were being showcased in a way that represented our earlier insights.

Paper Prototyping & Low-fi User Testing

With our design direction sorted we each took one side of the site to work on and followed the same principles and hierarchy so that the two designs were consistent with each other. The only difference was the top navigation as we each utilized a different way to navigate between the two sides of the site. This way we could find out straight from the users which option was easier to use.

Feature List for Design Studio & Prototypes

  • Testimonials
  • E-mail subscription
  • “About” moved to home page
  • Two separate sides of the site

User Testing

A testing protocol list was created to make it easier when comparing the results from each test. Despite being low-fi, the first tests were already yielding higher success rates with users accomplishing every task we challenged them to.

Testing Insights

  • Add descriptions to Media
  • Keep site content balanced
  • Move forward with dual sided navigation
  • Make sure CTA’s are paired with proper text

Mid-Fi Prototype

There was some slight confusion during the paper prototyping phase that once explained, made a lot of sense to the user testers. We were excited to move to our first digital iteration in hopes that having it on a screen would give some of the interactions the life and clarity they needed to be properly translated. Within the first few mid-fi tests this proved to be the case.

Even without any of the digital assets that accompany a finished site, users found navigating the new prototype fun and pleasurable. Applying the same user test protocol list at this stage continued to help make sense of our findings as we worked towards our final product.

Testing Insights

  • Make separated top navigation more noticeable
  • Improve copy on the splash page
  • Condense media on each page
  • Make sure initial content is visible above the fold

Future Considerations

After multiple interviews, detailed survey results, and continued user testing we came up with a comprehensive list of future considerations for our client based on what users were looking for when landing on a magicians website. Below are some of the most important considerations that could even be applied to his current website in an effort to keep his users more engaged and educated on his services.

  • Testimonials on both sides of the site
  • Summarize what he offers into point form
  • Downloadable PDF for event planners
  • Consider using different copy and avoid magician jargon
  • Play around with animated interactions

High-Fidelity Prototype

In the end our UX team managed to discover the main priorities that a user had when landing on the website for Camilo. Whether it was for a corporate event, buying a ticket to a show, or signing up for magic camp, users wanted the same things. Immediate information about Camilo, testimonials, media with a purpose, and a tailored experience.

Our landing page had the interaction of “Picking a card, any card” to find their way to the appropriate side of the site, and each side was tailored to match the type of event a user would be seeking. Rich, dark colours to match the mystery of a live show, while lighter colours and softer corners greet you when enrolling a child in summer camp, or lessons.

Like what you read? Give Nicholas Kupiak a round of applause.

From a quick cheer to a standing ovation, clap to show how much you enjoyed this story.