Site Showcase: Alexis Bonavitacola Art & E-Courses
I happen to think that course sites have to be some of the hardest to design. Maybe that's because I struggle with the design myself, but Janessa sure doesn't she has created a dynamic and powerful site for her client Alexis!
Client Site Description: Professional Website
Template Chosen: Pacific
Why did you choose that template?: I chose the Pacific template because the backend is simpler for the client to manage than a template from the Brine family, but it still has important features we wanted such as index pages (with auto-alternating background colors), as well as the ability to add content blocks on top of banners.
What was the Client's Objective?: Alexis wanted to create website that not only was easy for her to manage and update, but create a unique website experience for her site visitors (fellow artists) and a space to feature her online art courses.
Tell us a bit about the design process?: Alexis is an online art instructor, and we worked together to build a website that hosts not only her online art galleries and shop, but a place for her art demos, freebies, and sales pages for her signature e-course and monthly membership. We started our project together with developing branding and brand strategy. We carried that through to her website design, creating a visual color palette that is reflective of her vibrant alcohol ink artwork showcased throughout the site. She really trusted my design process and we worked well together to bring her vision to life. We focused on creating an intuitive site map that leads users throughout the site in a clean and organized way. We created content "buckets" so all of the content on her website has a home. Her website is setup for growth and parts of existing sales pages can easily be repurposed in sales pages for her future e-courses. The website is an immersive brand experience, allowing the site visitors to be fully surrounded by her beautiful artwork, and uplifting website copy.
How did you help the client differentiate their business through design?: Alexis' artwork is vibrant and colorful, and we really focused on incorporating it throughout the entire site design. Her style is unique and her level of expertise can be seen throughout her website. Her business is unique in that she teaches art online, which is a fairly small, but growing, industry at the moment. Her online sales pages integrate with Thinkific where she hosts her e-course content. The experience from free opt-in, to e-course sales page, to e-course enrollment is a consistent, branded experience, created intentionally with her target market at the forefront.
Is there custom development? What about custom added CSS? Can you tell us why you did or did not use these edits?: Yes, there is quite a bit of custom CSS added. We wanted to create a site that was completely personal and reflective of her brand. We started by creating a style tile that incorporated her brand stye mixed with website elements like button styles, heading styles, image block styles, and form styles. We customized her image captions, Convertkit form style integration, Squarespace form styles, opt-in code block overlapping part of her pre-footer, integrated FontAwesome icons for her bulleted lists (About page and sales pages), hid the publish date on the blog page (her blogging is more casual and dates seemed unnecessary), blog pagination customization, and custom index pages used for her e-course sales pages that hide the default header navigation, pre-footer, and footer, that features custom menus, custom pricing table code blocks, button anchors, background colors, and heading size/color tweaks for certain index sections where needed. We also feature a "back to top" button on her site, as well as a custom accordion for FAQ's, and custom sales page minimized footers to reduce distraction and prevent users from clicking away from the sales page. We especially loved the use of multi-section index pages for her e-course sales pages so that we could target each section very specifically with CSS if needed. The sales pages in particular are very long and it makes editing on the back end much quicker having to only edit a small section instead of the entire page as a whole too.
What are the top three creative features you used in the design?: 1. Custom index-based sales pages for her e-course and monthly membership
2. The use of an overlapping code block showcasing an iPad mockup in the pre-footer
3. The custom search bar with gold icon in her website footer (such a happy little surprise)
Anything else you want us to know about the site?: Alexis' site features a lot of non-linked pages that are serving her well on the backend. For example, until we integrate her actual shop in 2018, we have a faux shop page created in the meantime. We created a custom opt-in thank you page, "next steps" email confirmation page, as well as an unsubscribe page that integrate with her Convertkit email list. She has password-protected pages that include art video demonstrations for all of her freebie opt-ins, and a page on her site for past e-course students to "submit their story" and share their own testimonial. Lastly, we have a non-linked, disabled page on her website that serves as a live Visual Style Guide for her website design styles in case she ever has to reference it in the future.