A leadership and speaking academy for women offering programs to improve their confidence and their ability deliver engaging presentations.
Hi-Fidelity Mock Up
01/21 - 02/21
This was a cross team project involving motion designers, communication designers, and interactive designers.
Every year Shine hosts several of their own speaking conferences as a platform for their speakers to demonstrate their skills and as a hub for recruiters looking for key note speakers. This year, Shine would to like find a way to increase the number of attendees for each of their conferences as well as raising awareness for their brand. We were briefed with creating a promotional motion piece, social media templates, and an interactive piece of our choice. Shine provided their current brand guidelines and previous video testimonials as source materials.
How might we redesign Shine Bootcamp’s conference site to improve its presentation of information and increase ticket sales?
We decided on a conference website redesign as our final decision, since we noticed that their site has several areas of improvement that they can benefit from. Being part of the interactive team, our goal was to ensure that the target users of Shine Bootcamp have clear and easy access to conference details and information when they are on the site. We also wanted to refresh the visuals so they would pair well with the layout of the conference site, but without deviating too far from their current brand guidelines. As well we had to take into consideration that Shine does not have an in-house developer and has been using Webflow to construct their site.
We began with first looking into the user journey to understand how current users are interacting with Shine’s site and contents and then creating personas so everyone on the interactive team will share the same foundational information.
We found that:
Shine Bootcamp interacts with their users mostly through their Instagram page and most of their traffic to their bootcamp site and conference site are redirected from their IG bio description.
IG bio description has bootcamp site referral link up approximately 75% of the time and has their conference site referral link up approximately 25% of the time (usually a period before their conferences are set to occur)
Bootcamp website has very little information in regards to the conferences and the referral link to their conference site is hidden and not prioritized.
From this we were able to conclude that whether through Instagram or their bootcamp website, users visiting the conference site most likely have very little prior knowledge of the conferences’ purpose or even the conferences themselves.
As stated by Shine’s founders, the conferences are mainly for conference organizers and passionate learners, but we also believe that friends and family of the speakers may attend and therefore will visit the conference site to purchase tickets. To design in a way that matches their needs and goals we created three personas for all the teams to refer to.
Heuristic Evaluation Of Current Site
Next, we moved onto Shine’s existing conference site for analysis. The several pain points that we discovered are:
The current website is not engaging enough for conference organizers.
No easy way to find speakers on the speaker gallery.
Subscribe button doesn’t provide information of what users would get if they write their email down.
No clear connection between main site and conference site (no obvious way to go from one site to the other).
Confusing visual layout on conference site.
It’s hard for Organizers/Learners to get to the conference website (there is no proper flow to get to the website).
We created and outline the current sitemap and added in suggestions to section where we believe resolves some of the mentioned pain points of our users. Our main changes revolve around rearranging the order of specific sections on the homepage to give a better flow of information and a smoother page exploration experience by offering easier access to what the users are looking for.
We conducted a total of 6 user tests, 3 with desktop wireframe prototype and 3 with mobile wireframe prototype. We were able to gather and share our data through a centralized Google spreadsheet and concluded on the following main findings:
Users were unsure what type of conference they were attending.
“Become a speaker” button on the navigation bar was confusing for some users.
The Ticket price and Speaker topics were difficult to find.
The “Open letter to conference organizers” was considered too wordy.
The “Land Acknowledgment” caused confusion because of its odd placement.
Short and simple one liner in the hero section of the home page and put emphasis on it.
It was meant to redirect users back to Shine’s Bootcamp website for better accessibility between the two site, but the focus here should be to get users to attend conferences. Button is changed to “Join Now” and directs to the ticket purchase page instead.
Added visuals that highlights the price while also providing more information in regards to the conference and included a link to speaker topics as “Check Agenda” in the about section.
Since client wanted to keep the letter as they feel it does create impact. However it does interrupt the flow of information, therefore we decided a “pop up” option would be the best solution in this case.
Moved to footer due to it’s disruption of information flow but still shows appreciation.
Visual Style Guide
We had to take in consideration of both the current brand guidelines and also the art direction of the motion pieces and the social media templates from the other teams. To ensure cohesiveness across all of our deliverables, we created a style guide for all the teams to follow.
Hero section clearly shows the purpose of the conference with quick access to answer common questions that the intended users would have.
Bold CTAs are consistent and inviting.
Pop ups provide additional details without forcing all visitors to read information unrelated to their needs.
Founders greetings helps to build trust for visitors and a perfect opportunity to share more about their Bootcamp program.
Video showcase of past successes contributes to an overall better brand image.
Dedicated sponsors section to show recognition and give potential sponsors another reason to become one by stating the conferences’ support for local NGOs
Appreciation without the distraction. Land acknowledgement is a must but it should not disrupt the flow of information and hinder the purpose of the page.
Dedicated search bar with filters to allow visitors to find the speaker they’re looking for.
Speakers are labeled with their topics and their social media handles are also available on the same card.
Designed with responsiveness in mind.
Could have reached out to a past speaker and interview them about their experience with the conference website.
Conducted more user tests with intended users
If given, we would have asked for more client feedback at different stages. (We were only given one before final presentation)
Explore Webflow further to see what features and limitations are present.
Get in touch!
Let's craft together