Acorn learning center

Website Design for SF Bay Area Learning Center with Multiple Locations

Introduction

Selecting the right preschool is one of the most important decisions parents have to make. It is a time of childrens’ rapid overall growth in which a foundation for future learning has to be established. If physical locations and online presence are not welcoming, the business is at risk of losing valuable customers.

Challenges

Acorn Learning Center has great locations around the SF Bay Area. Website, on the other hand, needed overhaul as it was outdated and did not match friendliness and quality of campuses.

Specifically, The Coder team had to:

Build a new website that reflects Acorn’s history and vision of better preschool education
Use “clean” code for fast load times
Set SEO foundation by creating necessary H1s, meta descriptions, alt text, etc.
Select CMS that is flexible enough for client to make edits without involving a developer
Increase conversions - campus tour reservations and phone calls

Site before

Approach

In order to spark parents’ interest and earn their trust, the website needs to be structured in a way to follow information flow easily. Additionally, placing the right content of happy and engaged children during the education process was as equally important to assist in conversions.

Color Palette

Everyone’s childhood is bright and full of colors. As kids, we used colorful markers and pencils, wore green, blue or red clothes and read books with lots of images. In this sense, childhood is like a rainbow.

The Coder team decided to select a few bright colors that would create a new palette. This approach was unique as the website target audience is parents and not kids. We believed that parents’ “childhood subconscious” will better respond to bright colors than to more typical black and white (typically emotionless) themes.

And we were right!

Content

We gathered all information provided by the client, such as programs, history, admissions, testimonials, etc. and broke it down to pages and content blocks.

Acorn provided enough photos of kids, parents and the education process for us to work with, and we did not use any stock photography.

Below you will find what our team was able to accomplish.

Responsive Design

We created the design using Adobe XD and presented it to the client using Invision for further edits and approval.

Desktop

Mobile

Previous website was not mobile responsive. This negatively impacted user experience browsing the website, and, ultimately, decreasing potential conversions.

The Coder team always creates responsive websites optimized for all major screens - from smartphones to tablets to desktop.

Front-End and Back-End Development

Upon feedback from the client on desired functionality, The Coder team has made a decision to select WordPress as the preferred CMS (Content Management Platform). This decision was made for 2 primary reasons:

Flexibility. The platform provides both front-end and back-end flexibility that saves development team resources and client’s budget. We configured Yoast plugin for SEO optimization and ACF (Advanced Custom Fields) with custom dependent field logic.
Ease of use. Admin panel was set up to let the client change any content on the website with no development skills necessary.

Custom Form Submission Logic

Acorn Learning Center has 3 locations and each location has a different manager. The Coder team was tasked to build a workflow that will notify different manager(s) based on the user desired location selection during form submission. This functionality automated manual work and streamlined internal processes.

Each campus has the same stellar staff, but different look & feel. The Coder team designed “Locations” content block for users to be able to quickly switch between different locations and easily see the following information for a particular campus: photos, contact information, short description, stylized map, and “Book a Tour” button.

The decision was made to use tabs in the “Locations” content block. It allowed us to use space wisely while presenting all necessary information without leaving the homepage.

“Book a Tour” CTA button has been strategically placed in the header of the website for easier conversion.

Results

The client has informed us that during the first month since the website launch they saw a 3x increase in conversions - tour appointments.

THE CODER built a WordPress site for a preschool network. They added functionality to share information about the schools and generate leads. Parents appreciate the aesthetic and information on the site, and several express interest. THE CODER was flexible and committed to the school’s vision, and they always responded quickly.

Erin Goss

Operations Manager, Preschool Network