

Harley-Davidson
—
Interaction design
2 3 Perspective Agency
March 2017
Worked as a Senior designer to led the team in designing the interactive activities for the new Harley-Davidson showroom opening event. I oversaw the design team's workflow to ensure that our deliverables were punctually sent to the cross-functional teams. In addition, I worked on front-end development, which involved translating our designs into code.
—
Project Context
AAS H-D of Bangkok is an authorized dealership of Harley-Davidson. In March 2017, they were going to open a new full-services showroom in Bangkok. The opening event had a diverse mix of biker club members joining. So H-D wanted to create a memorable reunion event for Harley bikers to spend fun time together.
Challenge
This project was challenging because of the short development period of three weeks. So to make this project happen, we had to assemble a team with a Strategist Planner, Art Director, Designers, Developers, and Testers.

Business Requirements
The client wanted to introduce a new Harley-Davidson bike model by a technologically advanced approach according to the showroom concept.
Following discussions with the client, the strategist team concluded that...
"We would develop 15-minute interactive activities which are relevant to the event context."
The activity ended with the selection of a winner for a grand prize from Harley-Davidson.

Summarized business requirements and mapped into a user journey.

Our Approach
We brainstormed with the team to come up with a creative, unique, and feasible solution. Finally, we end up with a real-time activity solution that reflected the brand's identity by using WebSockets technology.
# Technical Solution
All activities would use WebSockets technology to create a real-time activity that all users could participate in while at the event via their smartphone.

How WebSockets works

How we applied WebSocket to the event activity
# Creative Solution
The Strategist team proposed 3 activities based on the context of each event session. The design team was in charge of incorporating these ideas into the designs.
—
Before delegating tasks, I started with a discussion and created a wireframe of all activities to help my team see the same picture. Art Director directed the design look to keep consistent with Harley's brand identity.

A part of the activity wireframe

Interaction Design
Here, I demonstrate the concept and approach to each activity:
—
Activity 1:
Your H-D, Your Style
Concept:
The opening activity introduces a new Harley's model and allows users to vote for their favorite model.
Design Strategy:
On the user side, we created a Harley-Davidson bike list. On the server side, we designed a horizontal bar chart that represented a race track to display real-time voting results.
Approach:
Audiences voted for their favorite model on their mobile phones, and the voting results were displayed on the projector screen in real-time.

Activity 1: Your H-D, Your Style
—
Activity 2:
The Racing Battle
Concept:
The activity represented Harley's biker characteristics–Rebel and Revolution. And to promote the most recent bike models.
Design Strategy:
We used a racing game concept for a speed race between Harley's bike models that the client wanted to promote.
Approach:
Audiences chose a team and shook their smartphones to reach the finish line within 30 seconds. On the server side, we animated car gauges to represented the speed of shaking smartphones.

Activity 2: The Racing Battle — Rebel or Revo
—
Activity 3:
Mad-Fan History
Concept:
Challenge bikers with 10 questions to find the real Harley fan.
Design Strategy:
We created the answer choices on the user side. When players chose an answer, we displayed the total number of players who chose that answer in real-time.
Approach:
The MC asked the question shown on the projector screen. Audiences had 10 seconds to respond by selecting the correct answer from their mobile phone.

Activity 3: Mad-Fan History

Marketing Materials
Not only interactive games, but we also developed a few applications for marketing purposes, e.g., the register system, the Kiosk/iPad catalog, privilege mobile app, and offline marketing materials.

Some screenshots of another application for marketing purposes

Conclusion
It was a very collaborative project with the client to approve all design elements, and our engineer and tester team created all of the applications within the impossible timeline.
8
Applications
3
Weeks Development
4
Collaborative Teams
1000+
Guests







Press
English: Khaosodenglish.com, Siam2nite.com
* Event photos on this page are from the above press websites.