The Brief

Art Therapy with T initially approached me with the need for a professional website to help launch their new business. Tara, a non-binary counsellor, expressed their need for a contemporary, informative website that effectively communicated their qualifications, services, process, and contact information. All of which I was happy to help with!

During the initial consultation, Tara conveyed their desire for a website that reflected their holistic approach to counselling. They emphasised the importance of creating a welcoming and calming online environment for all potential clients including neurodiverse individuals and those in the LGTBQIA+ community.

In addition to the website, I collaborated with Tara to create a full brand identity for Art Therapy with T's online persona. This included selecting a complementary colour scheme, incorporating natural assets and choosing typography that evoked a playful yet professional tone.

The Brand

With the project scope defined, I got to work crafting designs that aligned with Tara's vision. This began with branding, as it was necessary to establish the look and feel of their business before bringing it to life through web development. With every client in the discovery phase, I ask them to answer a few questions while attaining their needs, desires and vision. This will serve as the reference point for any design decisions going forward.

From these questions, the client stated their love of muted colours that are typically associated with nature such as greens and yellows. Fortunately, Tara had already sent over several assets that they wanted to be included on the site, mostly consisting of their own nature photography. I chose moss green as the primary colour and began testing various palettes that would complement it such as pastel orange and (word) green. I then presented Tara with two similar palettes to choose from, with the biggest difference being the CTA colour of either aqua blue or sunset orange. We both agreed the blue contrasted better.

The choice of typography was fairly straightforward. Tara had already specified their favourite typeface for the body (Cambria), so it was only a matter of searching for a heading font that complimented. In the end, we settled for Cooper Black as it perfectly embodied the playful yet professional tone established during our initial consultation.

The logo was handled in-house by Tara and their team. It was kindly sent before the development process and allowed me to work around its shape when designing the website.

The Design

Once the brand was established, it was time to work on design and development. All good designs begin in Figma. During the discovery phase, I asked the client to send over some websites that they admired (both in their field and in general). One particular site featured a lot of rounded, card elements that the client really enjoyed, reflecting a clean, playful and safe feel to the site. This was the main design inspiration for the first draft.

Each section on the homepage focused on a need that the client wanted information conveyed such as who they are, their specialisms, qualifications, testimonials and a method for contacting. These were broken up with alternating colours from their palette and natural imagery. The inclusion of a video halfway through the page served as a rest point for viewers on the website to take a moment and breathe (akin to meditation), enjoying the movement of the waves before continuing on. The rest of the pages were created in a similar style, all separated to easily identify individual sections and improve the user's experience. Finally, it was a last-minute decision to include various natural elements across the site such as vines, plants and leaves. This was a design decision in the aid of tying the natural theme altogether and adding more playfulness to the website. Once I was happy with the first draft, it was sent to the client for approval.

Another important feature was the inclusion on an 'Exit Now' button across the website. In order to create the safest space possible both in person and online, Tara wanted an option for anyone browsing their site to quickly exit the page if necessary. This button would scroll with the user and be within reach at all times.

With great planning comes a more streamlined development process. The client was overall happy with the draft and only requested a few minor edits. Once everyone was satisfied, I began the process of bringing it to life. Webflow was the obvious choice for this design because of its advanced customisation options and my extensive knowledge of working on it. I began with setting up the client's branding using the site's variables and implementing design systems such as component classes to speed up the process and keep everything consistent.

All animations were created using Webflow's native animation tools such as the page and section loading animations, tab section reveal, FAQ section reveals, sticky scroll sections, hamburger menu animations, and alternating image reveals when crossing a page scroll percentage. I also had the opportunity to incorporate more micro-animations throughout the website. These are small interactions the user may experience when hovering or scrolling over specific elements. This is done to better build a relationship with the user and improve engagement. It almost creates a game with the user to see how many elements they can discover and interact with. If this sounds boring, don't worry, it's more of a usual thing!

The final step was optimisation. No website these days is complete without looking exceptional on all screen sizes, particularly mobile.

Most sections designed for desktops can look pretty similar on tablets but will have to be completely redesigned for a mobile viewport to look and function as intended. This was by far the most time-consuming part of the process as it requires a lot of testing on multiple devices to make sure the website serves its intended purpose of presenting useless information and encouraging them to get in touch with the client for their services.

The Outcome

Upon completion of the project, Art Therapy with T was thrilled with the results. The new website captured their original vision, providing a tranquil and informative platform for potential clients. They appreciated New Heights Designs' dedication to serving their new business adventure justice and were a dream client throughout the entire process. As with all projects, this is the client's website, not my own. A full handover was provided with website management sessions, empowering them to make changes as necessary without the immediate need to pay someone for it.

Art Therapy with T's web design project exemplifies my commitment to creating tailored solutions that meet my client's needs. By combining thoughtful design with strategic branding, I helped Tara launch their online presence and enhance their ability to reach and connect with individuals seeking support. It was a pleasure working with Art Therapy with T, and look forward to continuing our partnership as they grow and thrive in their endeavours. There are already plans on the horizon for expanding the website with additional features and services.

Quote

Tara Beazley

Art Therapy with T