Information Architecture, Product Design, UI Design
I was one of the co-founders of Sports Glory, a sports marketing agency, back in 2014. As is usual for start ups, in the very beginning we had extremely limited recourses, so as an MVP of sorts we threw together our first website. It was basically just an edited WordPress template. By 2016 the agency had grown, and we needed a new platform to represent it.
Our first website was:
- Outdated, unoriginal and rather uninspiring visually
- Badly structured
- Not conveying what our company actually did at all
- Difficult to manage and update
We needed a site that would be:
- Visually pleasant
- A better representation of our branding
- Well structured and easy to browse and use for our clients
- Conveying our message well
- Easy to transform and build new pages with, because our offers and content kept changing – we needed something with interchangable and easily rebuildable blocks
Our old site neither looked nor functioned well. As we started to grow and find new partners and clients, we needed something that would represent us better & better explain our services to potential leads.
For the first 2 years our agency we received a lot of messages from people who had heard about us elsewhere and visited our site: all of those messages were along the lines of “But what is it that you acutally do?”
It became obvious to us that this was the core issue of the old site. We needed to formulate & present our message and our products better: that was the core idea behind working on the new site.
We needed a better information architecture: better structure, clearer message, better vocabulary.
Since it was just the two of us, all information architecture work was as simple as a few whiteboard sessions, but it took us a week or two to come up with something that served our needs well and that we were both pleased with.
In two years since founding the agency in 2014 we:
a) added new products to our offer that were simply not represented on the old site (Sports Design, Corporate Sport Events)
b) had a better understanding of the products that we’ve been offering before
We accumulated a lot of new content and product ideas, and needed a site structure that would represent it better & have a room to grow.
As a result of our IA brainstorming sessions we:
- Reduced the number of pages we were going to build for the first version of the site (Less is more);
- Got a better understanding of all types of content that we needed to be present on the new site.
We figured out that we needed to proceed to the next stage – sketching – not with specific final pages in mind, but with building blocks of specific types of page components that we would be able to later reuse to assemble new product offer pages.
Since it was just the two of us and we knew that we achieved a good understanding of what we wanted the site to look like, we decided to skip the wireframing stage. After initial sketches of several types of key pages we made several iterations to them, and then I proceeded to work on final UI design.
We knew from feedback we received from our customers and clients over the years that they were the most impressed with our overall branding style because it incorporated minimal interfaces with accents on impressive shots with athletes, so that’s the direction I went for with our UI as well.
Our brand is easily recognized by it’s bright green colour (reminiscent of the green of the football field) against the background of black and white shots.
Conclusion & What I learned
We had certain limitations with this project:
- Small team (just the two of us and an outsourced developer, with the entire UI design falling unto me)
- Limited budget (we were still in a startup phaze back then)
- Limited time (each moment we spent with an old site we lost money on leads not converting due to not understanding our offer well enough)
Not everything in this project I would do the same way if I didn’t have those limitations: I’d make the UI more detailed and versatile, and would have 2 rounds of user testing & feedback: both at the digital sketches stage and after the final UI was created.
Nevertheless itt was a big milestone in my personal development as a UX/UI designer, as I got to wear multiple hats along the way (the stakeholder & the designer at the same time), as well as looking at the project from the client’s perspective.