Case Study


We combined data from four international soccer leagues into one fantasy sports experience.

Moonllight interface design compilation


After suffering through quality, communication, and timeline issues with their first development partner, the team at Moonllight Manager brought Envy Labs in as an early sub. They sought to create their unique take on fantasy soccer: the freedom to combine multiple European leagues, and introduce draft options.

As huge supporters of the beautiful game ourselves, we jumped at the chance to pair live data from the sport with friendly competition. The start of the (real-life) season loomed large, requiring a partnership that carefully balanced features, budget, and speed.


  • Wireframes
  • UX Design


  • Branding
  • Design System
  • UI Design


  • Elixir + Phoenix
  • GraphQL
  • React


Friendly Competition

Player analysis, slick animations, intuitive flows… all goals paled in comparison to the pinnacle of fantasy sports: bragging rights over your friends.

Configurable Leagues

Fantasy soccer isn’t new, but Moonllight’s founders weren’t happy with the configuration options existing platforms brought to the table. At launch, they hoped to offer choices like draft and classic alongside players from a selectable number of real-life leagues.

Subscription Base

Thinking sustainability from the outset, first phase features would need to include subscriptions, trials, and referrals.

A gridded moodboard of Moonllight inspiration
Moonllight design motifs and illustrations


Man Management

Sketches, re-sketches, and wireframes ruled the discovery process as we worked to define an experience that combined lineups, stats, and more tables than you could shake a corner flag at.

Achievable Scope

With a hard start-of season deadline on one side and endless ideas on the other, we worked closely with the Moonllight team to keep a manageable wishlist.

Scoring Tune Ups

Choosing point values for player actions is no small feat. Early in the process, we added a simplified player selection tool, allowing the client to check their numbers against performances in the previous season.

Initial sketched wireframes on paper
Grid of digitized wireframes
Moonllight iconography examples
Moonllight's final branding



With the double-L nod to eleven players on a team, we paired Moonllight’s name with a matching wordmark and color options.

Design System

Removing most of the design-to-development handoff seams, our interface approach favored a system of reusable component states. Consequently, the front-end team was able to start in Storybook and close the loop.

Deluge of Data

Lineups and player analyses received the bulk of visualization attention, keeping the experience both usable and useful.

Moonllight design system samples, including colors, typography, and form elements
Ayana Campbell Smith designing the player overview page
A zoomed-out view of every design composition for the project
A mashup of Moonllight's marketing and interface design compositions
Phone screen demonstrations of Moonllight's responsive capabilities


All Devices Welcome

The shifting nature of soccer lineups — and midweek games — meant that users needed access to their team from any device. Taking it further, even complex interfaces like live drafts scaled seamlessly to the device on (or in) hand.

Here and Now

Competition waits for no one stats crunching. As real-world games played out, numbers across the application updated in tandem.

Stripe Subscriptions

Making use of Stripe’s subscription functionality, the fledgling business had customers from launch. Free trials and referral bonuses helped in encouraging new users.

Mark Kendall wrapping working through Moonllight's backend Elixir code


Opening Day

As Liverpool and Norwich City kicked off to start the Premier League season, competition across Moonllight leagues began as well.

“[Envy Labs is] a team of very talented developers, designers, and project managers and it was a great experience working with them.”

Stefan Woort-Menker
Co-Founder // Moonllight