Responses by Framework Design.

Background: Team Elite Kickboxing (TEK) is a growing kickboxing academy becoming known for its passion, expertise and success in major competitions around the globe. Their previous site and branding were always treated as a placeholder, never really living up to the personality of the business and its owners. We were commissioned to rethink the lot and help the business be seen as a leading authority in kickboxing.

The aim was to give TEK a fixed, unified brand experience that embodied the spirit and passion of its members. The site acts as a method of communicating these values while demonstrating the benefits of engaging with the business. If you want to make a change in your life and be part of a group of people that push themselves to the limit, TEK is for you.

Design core: The site is designed to be full of energy, communicate strength and be rewarding. As users scroll through its content, all the artwork and animations are designed to articulate these values. No matter if we were using video or static images of typography, the direction was the same.

Favorite details: We’re most proud of some of the UX features we’ve added to help users with some of the more complicated elements of the site. The interactive mouse hover helps to provide support in these areas: where to scroll, when to drag and when to engage. The video was a lovely addition to the site: it was also shot and edited at Framework Design, but having this in the lead into the site really helped to lift its appeal.

Challenges: The hardest part of the development of the site was containing the clients’ enthusiasm. In the early stages, it wasn’t the nos that were the problem—it was how many times they said yes. All the feedback was extremely positive, making it very hard to pick out the gems and boil it down to a core creative concept. We tested the clients on a number of different approaches and had to work really hard to learn how to interrupt the clients’ reaction—which was always very positive—to build up to a final concept.

In terms of time, we were blessed with an open deadline. This led to other problems, such as overworking and delivering, but we’d made a business decision early on to produce something amazing, so we ran with it. Personally, we felt the project was run extremely well from an internal point of view; the mechanics of our process kept the clients engaged and informed.

Changes: It’s a small thing, but we would have liked the system to have been built in Vue.js. It would have enabled us to add on page transitions, which would only have made the site look and feel more dynamic. As a result, we’re now gearing our studio up to build a boilerplate Vue.js system that will help us in future projects.

Navigation: We wanted to move away from the traditional, fixed-header navigation and embrace a device-oriented solution. It was its development that led to the UX communication hover system and helped to then communicate complicated features throughout the system.

Technology: The system was built in WordPress using PHP, HTML5, CSS3 and ES6 JavaScript.

Anything else? We got awarded Website of the Day by the CSS Design Awards.