ONLINE COUNTRY CLUBS: UX DESIGNER
While on the EA SPORTS Online team, the Tiger Woods PGA Tour 13 team approached us with a request to create a web feature. The Country Clubs feature allowed people to form online clubs to earn in-game coins faster and run time-sensitive tournaments. After scouring their game design documentation, I set out to design an effective web-based country club experience to complement the in-game one.
Tools: Omnigraffle, Sticky Notes
Tiger Woods PGA Tour 13
The main challenge was to create a web app that used the same design language and supported the game mechanics of the console product. The first step I took was to analyze their game design documentation to understand how their coins system worked. It was important to communicate what the point of joining a country club was. I discovered that the benefits were twofold. Firstly, you earn coins faster with more people and better aggregate performance. In-game coins allow you to unlock extra courses. Secondly, you can create custom tournaments amongst your club members.
The timeline to create this feature was extremely short, as it was a feature added late in the game's development. I worked closely with the Tiger Woods team at EA Tiburon, as well as the visual designers and engineers at EA Canada's EA SPORTS Online team. To speed up the design process, I relied heavily on pen and paper, as well as using sticky notes to create "boxing glove" wireframes. These were very rough screens that I re-arranged to create key user flows.
As mentioned, I used sticky notes in two ways: as an affinity diagramming tool to organize concepts around golf country clubs; and to create "boxing glove" wireframes that could be re-arranged in different user flows. After I was happy with the flows and affinity diagramming, I used Omnigraffle to turn them into wireframes. Due to the sensitivity of photographs within the studio, I am only showing a mock-up of this process.
The wireframes spanned four main pages: the landing page, the search/join page, the club creation form, and the club dashboard. I split the search/join page into two main actions: join a club, or create a club. To brush up on forms, I re-read Luke Wroblewski's book Web Form Design. For the club creation form, I took care to left align labels, use authentic golf terminology, and to visually separate different steps in the process. Lastly, I emphasized two things on the club dashboard: current stats and coin boosts, and the status of any club tournaments.
After iterating with visual designers and engineers, the feature launched in time for the release of Tiger Woods 13. Earlier, in fact - it launched prior to the game so that people could create their clubs and start earning coin boosts on day one. Reviews of the game have praised the feature, and it got a visual overhaul for Tiger Woods 14 with the UX remaining intact.
"One of the nicer parts of the Country Club is the ability to create and schedule daily or weekly Custom Club Live Tournaments. You have full control over all the options and it really adds again to the more social aspect of the game, making it easier to get online with a group of friends."
› PS Nation
UX Designer, Electronic Arts
Mark Magnusson, Marc-Oliver Gern, Colin Sharp, Owen McIntosh
Let's talk shop! Feel free to shoot me an email about what you see here, future work, or anything else you'd like to chat about.
EMAIL ME