The Holistic Ann'Venture

BRAND

PROJECT

Empowering a Small Business Owner Through Web Design

SUMMARY

This is the journey of building Anne’s very first business website. It covers how we approached the visual design, the technical pieces of creating e-commerce pages as well as a custom client portal. Since this was a freelance project I was hired for, I was truly in charge of ever piece of this web build from start to finish.

RESPONSIBILITIES

UI Design in Adobe XD

Development in Kajabi

User Testing

Strategy

E-commerce Setup

‍

Website Goals

Anne is an incredibly passionate personal trainer who started her own business from her backyard. She was operating for about a year when she approached me to help her create her first ever website for her business. This website was highly multi purpose as we wanted to not only promote her services and process payments, but also create a client portal where clients could access their training schedule, video lessons, resources, and communicate with Anne and each other. Her current systems for payment processing, booking sessions, and client communication were all on different platforms and it was important to us to make sure all of this was now on her website to streamline her processes and save her time.

Anne's Brand

Luckily, I also designed Anne’s brand so it gave me familiarity with her brand and an understanding of her branding goals that applied to her site as well. Anne the person and Anne the brand are very interrelated and we wanted to capture Anne’s spirit with as many of the design elements as we could.

One of the ways we did this was through colour. If you ask anyone who knows Anne what her favourite colour is, they will answer without hesitation that it is pink. So pink we went with! We made sure to infuse this into the main site colours as well as a feature colour in her icons and illustrations.

Anne is also a very athletic (obviously) and outdoorsy person so we captured these elements through imagery. Including photos that showcase her in her role as trainer and her solo adventures. We also couldn’t forget to include her dog Osita who is a staple at Anne’s gym, bootcamps, and events!

Capturing Anne in her site design

Anne cares deeply about every single one of her clients and it’s important for her to vibe well with everyone who comes into her gym. That meant it was very important for me to capture Anne’s spirit and present it well on her site to attract clients that would be a good fit with her. I had many sessions with Anne to get to know her and also asked her to fill in a brand strategy questionnaire so I could get a deep sense of who she and her business is at it’s core.

I took this information and designed the more static web pages, such as her home and about page in Adobe XD and met with Anne to discuss them. We went through a few rounds of discussions and iterations to make sure we really nailed this goal. What you see below are these pages and how we really captured who Anne is as a person through the colours, language, imagery, illustrations and iconography. We wanted people to get an idea and feel right from her website of what working with Anne is like.

The Purchase Process and Other Designs

Simple. We wanted the user journey from loading to purchase to be simple. We wanted Anne's part in booking new clients to be simple. So simple we went with! You'll read below about how we combined Anne's platforms to achieve this goal of simple for her and on the following images you can see the screens of how we made the user purchase journey simple. Guiding them through the landing page brings them to Anne's program overview page where they can get a quick look at what services Anne offers, how much they cost, and the key details about them. If one of those programs interests them they can learn more and complete their purchase for said program.

And, for those who want more information or confirmation that Anne is the right fit for them before purchasing we've included a Free Guides section where they can get a feel for Anne's content as she shares recipes and health tips here. As well as free events they can sign up for and attend in order to meet Anne and get a feel for how she runs her sessions.

The Client Portal

We knew a big piece of Anne’s site would be her client portal so we spent a good amount of time understanding the functionality she and her clients would need. Almost all of Anne's program offerings come with a digital component. For example if you purchase The Holistic Ann'Venture Community membership you are granted access to a free mobility program and her community discussion board that you can access when you login to the site. The example images showcase a client with this membership as well as an outdoor bootcamp membership.

When members login they can see all of the programs they've registered for and access the corresponding content whether that be online training sessions, a self-guided workout, past workshop recordings, or community discussion boards. As they purchase new offerings new service sections will be added to their profile.

Combining Platforms

When building Anne's site we wanted to make sure we would be saving her time in her business and not building more work for her. We chose to build her site in Kajabi because it offered us the customization of her static pages that we wanted combined with a robust dynamic page system for her client portal programs that didn't require as much heavy lifting as building it in a no code builder would. It was important that Anne be able to make content edits and manage her site once it was built so building in Kajabi allowed her this ability.

We were also able to combine all her previous systems for payment processing, client communication, and client booking into her Kajabi site saving her time from having to use multiple manual platforms.

We set up and connected stripe to her site so she could invoice and collect payments straight from her site. We also set up and connected calendly so her clients could book sessions with Anne without her having to manually schedule them. And we moved all of her client group chats and individual communication into the website as well rather than being on a facebook page.

Looking Forward

What makes this build unique is that it's only just the start. We really wanted a website that would be able to grow and expand with Anne as her business offerings do. We set out to create a strong brand image, giving users a really strong sense of who Anne is and what The Holistic Ann'Venture is all about and I really think we achieved that. Beyond that, we also set out to create a dynamic site with a dynamic client portal that is able to change and adapt to the services and programs Anne is offering and Kajabi was a great fit for that as they are constantly innovating and improving their platform so that it can meet the needs of clients like Anne who is doing the same.