Captain Kicks


Shape and Color at Play

Captain Kicks was founded in 202, in the middle of a pandemic, and has been rapidly expanding its offerings from enrichment classes at schools, to private soccer classes, to birthday parties, with camps in the near-future plans. Captain Kicks focuses on helping youth build social and leadership skills through the game of soccer.

Shawn and Zach, the founders of Captain Kicks, were looking to build out their existing one-page site into a more robust presence. With the brand already well-defined prior to project start, —including a charismatic mascot, — the main creative challenge became presenting a credible and inviting site geared towards parents and school directors while playing with bright colors and dynamic shapes. Strategically, the site architecture had to be intuitive regardless of the site visitor’s goals.

Information Architecture
Search Engine Optimization
Custom Map

move the slider left to right to see the before & after

captain kicks old site Captain-Kicks_Website_Home



the brand

The Captain Kicks brand is playful and vivid. The condensed Din Pro font is extremely legible and has the same upright quality to it as the brand’s mascot, as if telling the youth to “stand tall”. The complimentary color palette of yellow and purple makes the brand feel fresh and bold without feeling combative, which goes along with the Captain Kicks’ non-competitive approach.

This cohesive and strong identity served as a great source of inspiration for on-screen implementation.

the brand

In order to achieve the right balance of playfulness and professionalism, we wanted to maintain a relatively straightforward and clean layout, with dynamic shapes and elements breaking the frame sprinkled throughout the pages for added depth. The result is a site that feels as dynamic as it is organized and isn’t distracting to the visitor.

stylescape one (chosen by the client)

stylescape two

visual elements

There are subtle entrance animations and micro interactions throughout the site—everything is done with the consideration of not being too distracting or overwhelming the site visitor.

Besides the mascot, there aren’t many illustrations on the site. The featured iconography draws cues from the mascot’s flat design esthetic—simple shapes with contrasting shadows.

In sections where the client opted not to use icons, we came up with creative ways of making the content stand out by playing with typography, color, and shapes to complement the rest of the site.

A captain is someone that leads, listens, and helps others. Each season we teach children the value of being a captain.

Hover the speech bubble for the friendly mascot to explain what it means to be a Captain.


Search Engine Optimization, especially when it comes to content geared towards casual consumption and not business or corporate communications, is a delicate balance. The goal is for the client’s site to show up for the right search terms, but the primary consideration is always to serve relevant content to the people who are searching for it. That is why the nature of this process at our studio is extremely collaborative and iterative

custom styles

The website called for a map for users to search for classes close to them and to enable them to get directions. We wanted it to be interesting, engaging, and soccer-themed and for this reason, we had it custom. Besides, considering the program’s fast growth, we wanted it to be something easy for the client to keep updated.

The parks map features custom markers identifying the site visitor’s location and the parks where Captain Kicks currently offer soccer classes.

scroll inside the images below to see the full page

The whole process from beginning to end was so smooth! We had timelines and hit every single one of them. I could not be more pleased with the final product and how our website turned out.