DURATION

19 Weeks

SCOPE

Branding

UX & UI 

WebFlow

User Testing

TOOLS

Adobe XD

Cinema 4D

After Effects

WebFlow

Hotjar

DURATION

19 Weeks

SCOPE

Branding

UX & UI 

WebFlow

User Testing

TOOLS

Adobe XD

Cinema 4D

After Effects

WebFlow

Hotjar

Website

TEDxToronto

CONTEXT

I initially joined TEDxToronto as an art director to assist in brand design of 2020's Digital Talk Series "Uncharted". Due to pandemic, we had to quickly pivot our conference collaterals to a digital space. The old Wordpress website was broken to the point we couldn't even properly add the upcoming event's information, let alone a blog post. So we moved away from a simple cosmetic fixes to building a new site on WebFlow, chosen to foster a more efficient and collaborative workflow for the team. I carried out the research all the way to development and testing, taking full ownership of the design and experience. I collaborated with the co-chairs, various team leads, developers, junior designers, and writers.

https://uncharted.tedxtoronto.com/
01
UX

Who are we designing for?

The first challenge I came across was identifying our users. When I stepped into the  project, there was a list of user needs already created by the team and alas, the needs described were of the content producers, website editors, the stakeholders, and the sponsor partners. While I also wanted to consider our internal staffs' needs and address their pain points to increase volunteer retention and dazzle our sponsors with spotlights, the website was losing its main purpose as an event site. It was time to advocate for our end users, TEDxToronto's audience.

This is the data I started with to understand our audience better. I also used Reddit to get a better understanding of what others would say about the organization and the talks we hosted. Next, we had core team meeting to collectively identify our true end users, goals, priorities, and timelines. I wasn't able to see the data myself but I learned that our previous design decisions heavily revolved around returning users and relying on their loyalty. This was TEDxToronto's first virtual main event. As our theme declares, in this time of uncertainty, people with a wide range of background and age are asking and searching for answers online more than ever.

Vision
  • Fulfill the mission of spreading ideas by increasing reach
  • Connect more people through participation and support
  • Financially support the organization to host events and website

#1 Goal
Market events and drive ticket sales

#2 Goal
Bring on partners and donors for mutual benefit and financial support

TEDxToronto hosts TEDx Talks. To be a successful and attentive host, we have to be organized, clear and passionate in our invitation and ensure our guests will want to share their experience and return with their friends, colleagues and families.

02
Prototype

Testing it out

The static wires are rarely enough to fully communicate the relationships between all the pages to different teams. I created prototypes that would guide our decisions and allow my team to revisit the flows to feel out the experience individually. After many iterations, I conducted a few tests internally to identify any challenges or bumps that needed to be smoothed out.

The Nudge Theory

Another challenge that arose was ticketing. There was a big insecurity around allowing people to purchase Single Event Passes because we wanted to push the Season Pass instead. Inspired by many music festivals' strategy, marketing team decided to only sell season passes for our four non-consecutive day events. While artists have huge support from fans and can easily leverage their social media influence, our speakers were not musicians with stans. While facilitating this conversationbetween the marketing and financing team, I countered this with the Nudge theory. I suggested we use a gentle tap of good sense rather than getting rid of the Single Event Passes.

My attempt to support this was to create a customer journey map to illustrate my assumptions of the user's reaction when they realize that they can only purchase a Season Pass when the dates are far apart, speakers' names for the any of the future events are not released, and the topics were more abstract than ever.

As a result, we emphasized the benefits of the Season Pass and kept the Single Event Pass sidelined. We compromised by adding multiple supplementary texts to gently remind the buyers about the design of these events. About 70% of the tickets sold were Season Passes, which was 10% higher than our anticipation.

3
Visual

3D elements, motion & interactions

Our creative team worked on the branding for this this year's theme, which was Uncharted. We decided to bring a lot more motion into this year's theme, shift in perspectives, space and size to visualize what's happening around with a sudden change in everyone's environment.

INITIAL CONCEPTS

Exploration of motion was the starting point for the redesign. As an event website, Uncharted branding became an essential guide to the website's key visual elements.

COLOURS

Motion

I created a shape that expands and contracts to represent our minds navigating through the unknown of our future, twisting and turning as our perspective shifts.

3
Outcome

Have we met our goals?

Phase 1 of the website redesign was successful in many different ways. We were successful in our first events's ticket sales. Most of our users accessed our old site through our email campaigns on desktops. This year, most of our tickets were purchased through mobile devices and we noticed an increase in social media validation as well. We used Hotjar to define our successes and user pain points so that we can further iterate our designs for the next phase. We were able to address a very important pain point in the organization, which was taking control of the website. Switching to WebFlow allowed multiple contributors on the website to collaborate, test, and QA. We started a dialogue around UX. A UX Researcher and a UI Designer joined our team. We are definitely on the right track to solve the problems we have set out to solve.

MORE