MoveSpring design elements

How the design of MoveSpring helps to make fitness fun for everyone

Fitness and wellness can be intimidating. MoveSpring’s branding, visual design choices, and product strategy come together to create a fun, inclusive wellness platform that supports everyone’s goals.

Health and fitness means something different to everyone

Whether you’re working to complete a marathon or aiming to walk around the block each day, everyone deserves to celebrate their progress and to have support in reaching their goals, no matter where they are.

Health and fitness should be fun, approachable, and inclusive, and MoveSpring was built with this as its guiding principle. MoveSpring is a fun, easy-to-use health and activity challenge platform for companies. It combines gamified activity challenges, social community, and a suite of programming tools to help employees of all fitness levels engage in a healthy lifestyle. With over 3,000 clients and more than 1M users, our approach to corporate wellness has led to success.

Let’s take a comprehensive look at how we got there.

 

The branding

A balancing act of fun and friendly in a corporate environment

In creating the MoveSpring brand, we wanted to stand out from the competition and provide a refreshing experience for our end users that would support our mission. At the same time, we had to appeal directly to our clients: the companies purchasing MoveSpring for their employees.

Many products presented in the corporate space tend to feel impersonal, clunky, and stale. With this in mind, I set out to bring a sense of life and vibrancy to our wellness product and the corporate environment. After all, MoveSpring strives to make fitness fun...for everyone.

 
 

Logo
While art directing the logo, I focused on art directing something that felt like an extension of our consumer-facing app, Stridekick. We worked with the same designer to create a hand-drawn wordmark that represents the inclusivity of MoveSpring's mission. The variations in stroke width, forward-movement, and slightly arched baseline come together to create a playful logo that feels spirited, alive, approachable, and welcoming.

 

Typeface
I prioritized finding a typeface that would be legible and flexible in application across our mobile app, web app, admin center, and marketing materials. We chose Calibre for its combination of utility and personality. At small sizes, it is clean, neutral, and legible. At larger sizes and heavier weights, Calibre takes on a friendliness that felt like a natural extension of the MoveSpring brand, helping us bring our personality to marketing headlines, celebratory messages, and more.

 

Color palette
I first chose our primary brand color: a bright, friendly blue. Blue is a prominent color in both the corporate space and the health space, known for representing stability, support, and trust. Having a familiar base color would help us appeal to corporate clients. From there, I built out a full, vibrant palette that encompassed every color. Having a full rainbow of color to choose from helped us strengthen the visual representation of our values: fun, approachability, and inclusivity.

 The visual design

Building a visual design language that makes health and fitness feel approachable, accessible, and fun

MoveSpring's users get active by competing in step challenges and working on new habits; they learn by engaging with content and announcements; they build camaraderie through chat conversations and connecting with friends. After establishing the brand, I started to identify visual elements that would be core to the user experience and began to define the look and feel of the MoveSpring app itself.

 
 

Icon library
The MoveSpring icon library helps to guide users, identify key metrics, and create patterns. I kept the icon style as simple as possible with a strong geometric base, consistent stroke weight, and balance of sharp and soft edges to bring in a hint of friendliness.

 

Color system
Color patterns were established to inform and guide users through their activity data and challenge content. Building upon the brand’s blue, I created a primary color palette to represent our main activity metrics: steps (red), distance (blue), and minutes (yellow). As our product evolved and grew, we pulled from our extended palette to identify new features in a consistent way. A clean, neutral base of light gray and white focuses the user on available actions, challenge info, and content throughout the app.

 

Shape
Every container, button, form field, and label within the app has rounded corners. This intentional approach to shape helps to soften the experience and further strengthens MoveSpring as a friendly approachable environment for health and fitness.

 

Data visualization
Fitness data can be intimidating. To minimize the noise, we wanted to present activity data as simply as possible. Large numbers, simple progress bars, and chunky radial progress charts are combined with a system of fun “stickers” to help guide users toward their goals in an easy to digest, rewarding way.

 

A goal of simplicity guided every decision. The elements I defined here served as the building blocks in creating a design library that would bring a consistent, familiar look to all features with visual patterns that reflect our our mission of making fitness fun and approachable for everyone.

 

 The product strategy

Building and evolving the MoveSpring product based on core company values

MoveSpring launched in 2018 with a limited feature set: movement-based activity challenges, content, chat, and friends. But since day one, the product design has been guided by our core values of inclusion, empowerment, overall wellness, and community. As we grew and responded to user feedback, market shifts, and changes within the wellness space, we found new ways to build upon these values, create new features, redesign existing features, and evolve our product into a successful wellness platform.

 
 

Inclusivity in every competition
Everyone should feel like they can participate in a challenge, regardless of their fitness level. We continually reassessed challenges to introduce more inclusive scoring methods and rewards.

  • Multiple ways to win: Virtual Race incorporates two ways to win: time to complete and overall distance. In real-life races, the challenge ends at the finish line, but we also encourage and reward those who keep going.

  • Personalized challenge goals: We added the ability for admins to allow users to set their own challenge goal. This personalization empowers each user to set a goal and push themself within their individual fitness level.

  • Custom activity challenges: We introduced a way to compete on any activity: go for a walk, drink water, meditate…the options are endless. Custom activity challenges welcome everyone to focus on creating healthy habits.

 

Celebrate the small wins
It can be overwhelming to work toward a large activity goal and discouraging when you don’t reach it. While designing new challenges, we found ways to reward and motivate users along the way.

  • Unlocking milestones: Virtual race challenges reward participants with celebratory content as they reach milestones along the path to the finish line.

  • A sticker a day: Stick to It and Streak challenges reward participants with a “sticker” each day they reach their goal.

  • Incremental goals: Group Target Fundraiser was redesigned to unlock smaller donations when the group reaches the 25%, 50%, and 75% increments to help maintain momentum and motivation while working toward an even larger goal.

 

Community & social connection are key to health
Having a sense of community is an essential part of overall health. A supportive community can provide inspiration, motivation, and accountability to those struggling to reach their goals. We found ways to weave a sense of social connection throughout the user experience.

  • Chat: Each challenge has a corresponding group chat to help foster a sense of teamwork, connection, and support.

  • Friends: Users can connect individually with coworkers and become friends to keep up with each other’s stats, help each other stay accountable, and message directly in chat. Friends can also create their own, smaller challenges together.

  • Social proof: People are often motivated and influenced by the actions of others. Throughout our challenges, we added visibility to goal completions by showing users who else has met their goal that day or completed an action, inspiring others to do the same.

 

Wellness and fitness aren’t mutually exclusive
Wellness isn’t defined by your step count. In the past few years, there has been an increased focus on overall wellness and we identified ways for clients to bring elements of their broader wellness program right into the MoveSpring app.

  • Customizable content: Clients can upload content to educate employees on a variety of health and wellness topics. We added the ability to make any content “actionable” and reward custom health actions by tracking who completed it.

  • Custom activity challenges: The introduction of custom activities allowed clients to run challenges based on any activity and focus their employees on creating healthy habits for overall wellness.

The result

MoveSpring's brand, visual design choices, and product strategy come together to create an inclusive product that supports every user’s journey.

 

“User engagement is significantly higher on MoveSpring in comparison to past platforms. I think most of this stems from the sense of inclusion.”

— Admin at Sharp Healthcare

“Because of these challenges [our employees are] making healthier habits. People love the way it’s designed.”

— Admin at BestBuy

"MoveSpring has an extremely user-friendly app and backend admin portal […] Plus, all the add-on modules were great and a lot of fun. A ton of our employees were saying MoveSpring was now their most checked app on their phones!"

—Stephanie S, admin at a mid-sized company

 
Previous
Previous

Virtual race mode: creating new ways to engage in response to a global pandemic

Next
Next

Helping America's small businesses get on the map with Google Small Business