All Projects

Gripping prologue for great ideas

8 weeks project
Art Direction
Interaction Design
User Testing

TEDxSFU is an annual independently organised TED conference at Simon Fraser University. As the creative director of the 2021 iteration of the event, I was tasked with design and production of a microsite promotion campaign.

Team

Lauren Mok
Designer
Gracie Gu
Designer
Sneha Shah
Designer
Matteo Miceli
Web Dev

A taste of the conference

Through interviewing stakeholders, we found that speakers and their topics were the major motivating factor for attendance. With that in mind, our strategy prioritises surfacing the featured speakers in order to intrigue the potential attendees.

Informed by user testing, the content features a collection of suspenseful, fast-paced, trailer-style interviews. This allows the site visitors experience the speaker's content before purchasing the tickets.

1
Immersive Experience
The immersion of edgeless video interface facilitates a feeling of intimacy between audience and the speaker.
2
Speaker-Focused Landing
Visitors are greeted with a seamless carousel of speakers and talk information right away.
3
Responsiveness
Touch optimised carousel for mobile navigation.

Touchpoints

The speaker-focused content strategy was maintained across multiple communication channels. Through these external artifacts, curious individuals are encouraged to learn about the speakers on the website.

4
5
Speaker-specific QR code poster as initial touchpoint

Expressive interaction

We extended the existing TED branding expressive potential by introducing a motion language that inspired by petal — a nod to the conference theme "bloom". When tastefully applied, the gentle staggering motion soften the rather cold and precise modernist visuals.

6
"Bloom" motion language on page transition
7
To achieve the weight animation, I modified Neue Haas Grotesk into a variable typeface.
8
Staggering type motion on CTA button

Testing & iteration

Before development, I led a remote formative user research on the prototype with 6 university students. We also asked a middle-aged parent with visual impairment to participate with the intent of stress testing the system's usability. Major wins include:

  • 1
    Think-aloud exercise indicated that users mostly had little trouble understanding the interface and navigating the microsite. The result was supported by a decent score on the System Usability Scale (SUS) survey.
  • 2
    In the five-seconds-test, users find the presentation attractive with keyword "professional" cited frequently. Overall, the approach of prioritising speakers and topics on the microsite was well received.
9
System Usability Scale survey result
10
Users generally enjoyed the speaker focused approach.
Before
After
11
Wordy Content
Users had raised that the speakers bio was too verbose to sustain their interest. As a result, the speaker bio was replaced by a snappy speaker interview video in the final design.
Before
After
12
Lack of In-Page Navigation
Some users find the lack of in-page navigation frustrating, especially when browsing a lengthy page. To address this, new navigation modules was added to specific pages.