GolfLinks

Anton Itkin
Jul 10, 2017 · 7 min read

Online marketplace for pre-owned golf equipment

Our client Karen addressed a problem she was personally having. Her husband is an avid golf enthusiast who always plays on the weekends. Due to this, she considers herself to be a ‘golf widow.’ Their basement is full of golf equipment, most of it which is unused.

One day, they decided to sell a lot of the gear in order to clear out some room. Karen had her daughter help her sell online, however they had trouble finding a platform specifically catered to golf equipment. This situation sparked her the idea to start GolfLinks — both as a marketplace and community for golf players.

Karen had a vision, she had an idea of what the design should look like. When I asked her, ‘if GolfLinks was a person, what kind of character traits would they have?’ She immediately responded that it would have the personality of Barrack Obama — very smooth, elegant, open and approachable.

Her business was still in the inception phase. She did not yet have a brand or online presence. Only a strategy to validate her idea.

Task

The group I was in was composed of three people altogether, including me. Patrick and Sucheta were focused on the UX process and I was responsible for the UI and visual communication of the design.

The main objective was to create a high fidelity clickable prototype of a golf marketplace app, as well as a landing page that is optimized for conversion to download the app.

The UX process is utmost critical in setting the direction for the path of UI. During the initial stages of the project the primary focus was on research, planning, and sending out surveys in order to validate design decisions. After the research and survey results were in, I could get started about thinking about the inception of the design.

UX Process

This process could be broken up in 5 steps:

I’ve tried to be involved in the UX process as much as I can during this project in order to better understand the users, the competition, and also to see how the problem that GolfLinks is solving being validated.I’ve always made sure to be up to date on how the UX process is going, and possibly see if I can help out in any way. It was really great to be part of some brainstorming sessions with my team members.

I partook in some research, by doing a competitor analysis. It was interesting to see how the UI was done in the closest competitors — Golf Galaxy and Golf Town. Both of which are e-commerce retailers for golf equipment. None of the brands were truly inspiring to me and their websites were sub par in terms of visual language.

Value Proposition

Golf has historically been a sport made for individuals with higher incomes. A lot of the research that our team uncovered also shows that it has a declining popularity amongst millennials. However, this itself provides an opportunity to make golf a more accessible sport for anyone. The recent popularity of golf driving ranges in the U.S. are an indicator for a disruptive opportunity in the golf industry. Golf needs to have an accommodating environment for millennials in order to survive. This includes more affordable prices, relaxed dress code and rules, as well as possibly music and drinks at venues.

GolfLinks takes advantage of the new opportunity in the industry by offering the following:

An easy-to-use and accessible e-commerce community exclusive for anyone interested in golf.

This can be accomplished by drawing influence from existing platforms:

Poshmark + Facebook = GolfLinks

A secure marketplace that is easy-to-use for both buyers and sellers, similar to Poshmark. An accessible social platform that brings the golf community closer together, inspired by Facebook.

Design Inception

As a result of the surveys and research process, it was concluded that the target users of GolfLinks include both baby boomers and millenials. Baby boomers would most likely be the ones selling the equipment and millenials would use it as an affordable purchasing platform for their golf equipment needs. This calls for the following emphasis in the design language:

Elegant and friendly.

The main objective is to appeal to a mature crowd while at the same time enticing young golf players to use the app and get into golf as well.

This can be accomplished by using simple, sleek, and modern, design elements while maintaining a colour scheme that is both sophisticated and inviting at the same time.

Moodboard

The moodboard represents the visual inspiration for the GolfLinks brand and design. The main themes are golf equipment, links, and community:

Colour Scheme

The next step was to come up with a green colour palette that would be most associated with golf as opposed to food, or eco-friendly cars.

  • Darker, more saturated greens emphasize elegance and sophistication.
  • Lighter and more welcoming greens communicate friendliness.

Logo

My main objective with the logo was to communicate a link between a buyer and seller and emphasize a cohesive community, hence “GolfLinks”. My biggest challenge within this process was to retain the modern and sleek stylistic integrity while conveying the GolfLinks message.

These are the first few iterations that I went through:

I eventually stopped at V5 because it seemed the most simple and cohesive way of representing a connection between two golf drivers. However the only problem I found was that the green background reminded me of a tennis ball. I thought of a possible way to show the two drivers and make it represent a white golf ball instead. This is the final result:

As well as in a wordmark:

Style Guide:

I chose the Open Sans font for its friendly and neutral characters, as well as the fact that it is very legible on digital devices.

The buttons have bold and rounded shapes for the purpose to ‘pop’ on small app screens. There is a consistent round theme amongst all style elements, including the form circles and iconography. This is meant to emphasize on a feel that’s smooth, elegant and friendly.

The golf ball pattern on the bottom right can be applied as a background texture for certain sections such as on a web page, but not to be overly overused — especially on mobile where it would be harder to render.

High Fidelity Prototype

Bringing life into the mid-fidelity wire frames was a very rewarding experience. I felt like I had a very clear vision which I was communicating that was very consistent with the design inception.

Most of the prototype consisted of mobile screens. One of the challenges was fitting five functions of the top navigation bar together:

  • Back button
  • Navigation title (i.e. Popular near you)
  • Search bar
  • Search filter
  • Shopping cart

This top navigation bar would be consistent throughout most of the screens. After some brainstorming and discussion with my instructor — she gave me an idea to have a search bar that drops down from the navigation tab. Below is the product home page in which there is a demonstration of how the search bar works:

I decided to experiment with Proto io instead of Invision for the interactive prototype. I wanted to try out some simple interaction design, one of which is the drop down search bar as shown above. Also, I thought it would be very beneficial for the client presentation in which our group did a short skit about an interaction between a golf gear seller and buyer. I’ve incorporated some sound feedback into the prototype just for the skit. It was definitely outside of my comfort zone to start using the interactive features because I’m so used to Invision.

Please feel free to browse through the mobile prototype.

Desktop

The desktop prototype contains a landing page that is optimized for downloading the app. The challenge here was condensing the information in a very concise way, without having too many sections that show similar content.

I liked the look and feel of how the first attempt turned out below. However, the content delivery could have been more efficient. In order to make the first change, I wrote copy about the app in the hero section to get rid of about ‘About app.’

I came up with a solution to combine two sections into a seamless one. This one section would showcase ‘how it works,’ as well as the corresponding screenshots. A site visitor can just simply click through ‘shop, sell, and chat’ to view what the screenshot would look like:

Conclusion

Working on GolfLinks was very challenging, but at the same time-incredibly rewarding. It was an amazing experience to build a brand from the ground up, especially on a highly collaborative and knowledgeable team that I was in. Our client’s positive reaction and smile definitely made all the challenges and hard work worth it.

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade