scope of project:

LOGO DESIGN & TYPOGRAPHY STRATEGY

WEBSITE DESIGN STRATEGY

WEBSITE BUILD OUT

design strategy

For The Learning Loop, we aimed to create a website that feels welcoming, playful, and shows off how dedicated its founders are to their mission.

We wanted The Learning Loop site experience to be playful without being infantilizing to potential adult learners who come to The Learning Loop for support. Intentional interactive elements will help users be immersed in The Learning Loop approach and philosophy, while making it easy for them to navigate the site to find what they need.

  • site should lead visitors to where they need to be, with information given as it is useful

  • to give site visitors the feeling of a collaborative approach, while guiding them through the site in the most effective way.

  • Decorative elements and design features should all feel welcoming to parents looking for support for their child’s education, as well as encouraging to adult learners who may be seeking similar resources–while they are not the target demographic, they should not feel out of place when visiting TLL website.

  • to make updates to existing sections easy for TLL team after handoff.

user personas

  • the parent

    comes to the site for: qualified support to supplement their child’s education.

    experience on site: easy to navigate, has a clear understanding of what is available for their child, feels confident about TLL qualifications & approach

    key elements: playful & welcoming design; clearly defined services & design that helps visually distinguish them from one another

  • the adult learner

    comes to site for: continuing education opportunities; compassionate support

    experience on site: easy to navigate; feels welcoming but not infantilizing, has a clear understanding of programs available, and is comfortable reaching out to TLL

    key elements: playful design without relying on childlike imagery; featured testimonials from adult learners; resource section to establish TLL as educational resource to rely on

  • the educator

    comes to site for: qualified educators who can provide extra-curricular programs and/or training opportunities for educators

    experience on site: easy to navigate, understands approach & methods, interested working with TLL on integrating approach/method/practices to their school/developing a program with TLL

    key elements: design that helps walk users through TLL approach; featured experience of TLL staff; resource section to establish TLL as educational resource to rely on

key features:

features
Services Format Lightbox
Plugin Required
Services Format Lightbox
Plugin Required

Lightbox Anything Plugin

For The Learning Loop and the Shannon template, we used the Lightbox Anything Plugin to showcase the different formats that services are available as. By making use of the Lightbox Anything Plugin & the Universal Filter menu, we were able to organize the offerings in a way that helps website visitors narrow down available services based on their own needs.

Plugin Required
Featured Resources
Native Squarespace Feature
Featured Resources
Native Squarespace Feature

Native Featured Post Function

For The Learning Loop, and the Shannon template, making use of the “featured post” function on the resource library (a blog page) allowed us to design a featured resources section on the home page without requiring constant reworking when new resources are added. By filtering them to “featured only” the owner of the website can add new resources to the resource library, mark them as featured, and have them show up on the featured resources section of the home page without having to worry about altering the design.

Native Squarespace Feature
Team Summary Tabs
Custom CSS
Team Summary Tabs
Custom CSS

Summary Block + Custom CSS

Using Custom CSS and the native Squarespace summary block, we designed team summary tabs designed to look like folder tabs to go along with the playful, school supply design throughout the rest of The Learning Loop website.

The functionality has intuitive visual clues (shadows, a click mouse, etc.) to guide users through what actions they are supposed to take if they want to interact with the section, rather than continue scrolling.

Custom CSS
Universal Filter Services Menu
Custom CSS, Plugin Required
Universal Filter Services Menu
Custom CSS, Plugin Required

Universal Filter Plugin + Custom CSS

With such a wide variety of offerings we decided to use the Universal Filter Plugin to installa menu where site visitors can choose to narrow down the service info available to them based demographic served or service desired.

This helped to provide an interactive way for site visitors to get to know The Learning Loop’s expertise & robust support options without excessive visual clutter or overwhelm.

Custom CSS, Plugin Required
Interactive Approach Feature
Native Squarespace Feature
Interactive Approach Feature
Native Squarespace Feature

Accordion Block

Having this section directly “below the fold” helps to immediately establish trust, credibility, and expertise, as well as shows what sets The Learning Loop apart. We’ve designed it as a “carousel” to encourage site users to be intentionally interactive with the Approach section, rather than having it as a section that is scanned and scrolled by.

Native Squarespace Feature
SEE THE LIVE SITE HERE
template coming soon
Next

Molly Snell-Larch Consulting