Stretch the Imagination

Website Design

When we first toured the classrooms at Stretch the Imagination — a small, thriving preschool in the heart of San Francisco — we knew immediately that we were in for a treat. From the colorful children’s drawings posted on the walls to the willow hut in the back yard, everything got our creative wheels spinning before we even landed the job.

Website Design

Evoking Childhood’s Magic

Our primary goal with the redesign of their site was to evoke the magical experience of being a child at Stretch the Imagination — what we referred to as the Stretch experience. What better way than to give photography the leading role? Working alongside staff to get the correct permissions, we sorted through hundreds of images and picked the best match for each page. A layering effect called “parallax” gives the illusion of looking through an open window at a living, breathing scene of childhood.

Little Artists

From the drawings on the walls to the collaboratively-built fairy house, the student artwork we saw at Stretch blew us away. We knew it needed a place on the site. This collection of drawings integrated beautifully with the site’s content and helped bring whimsy and color to longer chunks of text.

Glowing Praise

Parents at Stretch have no shortage of wonderful things to say about their experiences. These became an integral design element.

The Fairy House Pattern

Among the artwork we looked at, we found several drawings showing plans for a fairy house. There were so many lovely details that we couldn’t resist the temptation to use them as part of the overarching design. In fact, we needed a background to display behind the content on larger screens — so we went to work constructing this “fairy house” pattern that could be repeated infinitely on even the largest of screens.

Bringing Content to Life

When it comes time to find a good school for your child, doing thorough research is crucial. For busy parents, this means lots of reading, which can get tiring! So we made sure to integrate imagery into the flow of content — both to give tired eyes a place to rest and to drive home the Stretch experience.

Easy Navigation

Parents are busy people, so even a few seconds spent hunting for information could be frustrating. We worked with Stretch staff to figure out which information was most important, and where parents would expect to find it.

Wireframing

Beyond an overhaul of their site’s design, Stretch wanted to add the ability for parents to apply to the school or register for summer camp directly from the site. And they wanted to review applications, set up classes, and enroll students — all within the same WordPress system they would be using to maintain the website’s content.

We asked a lot of questions about how best to adapt their analog process for the new website, but the answers were difficult to pin down without seeing something. Rather than design and implement the system on a hunch and revise later, we used wireframes to help us collaborate with Stretch staff to figure out the best approach.

To this day, the final implementation matches the process defined by the wireframes. No revisions necessary!

Printer-Friendly Reports

As part of the upgraded student information system we built for Stretch, we developed attractive printable reports that could easily be pulled from the site’s backend. The printable application and enrollment reports provide an easy way for teachers to track classroom attendance, compare applications, and more.

Our new site looks so wonderful and clean and professional. I love it. Really you have captured my vision and hope for the new look. Thank you!

Michelle Lawton,
Founder and Co-director

The website looks amazing! Thank you so much.

Whitney Ellis, Co-Director