A New Website to Make Finding and Paying for Preschool Easier in Denver
Putting Impact, Eligibility, and Kids Front and Center for Denver’s Pre-K Families
With a passion for education, we’re always excited to work with education sector clients doing incredible work in their communities. Denver Preschool Program (DPP), a Denver-based organization helping families find and pay for quality preschool since 2006, came to us to hone their branding and overhaul their website as they entered another year of growth.
After collaborating with the DPP team to understand their pain points – what made their current site difficult for their internal team to manage and families to use – we hit the ground running with a robust strategy phase. Through a combination of real-user focus groups, interviews, and surveys, we identified key focus areas that would guide us toward significantly improved information architecture, user experience, and content strategy in the design phase.
A Minimalist Approach to Navigation
Drawing inspiration from streamlined tr designed to get users inand out quickly, we reduced the main navigation from six items to three. By naming two of the dropdowns directly after their intended audiences—"For Families" and "For Providers"—we ensured users would know exactly where to click first. Within the “For Families” dropdown, we listed items in order of priority and described them with user-focused language.
The simplicity of the new navigation and page structure also allowed for an easy translation to mobile, ensuring all users get the same streamlined experience on all devices.One of the primary challenges in revamping DPP website was tailoring the navigation t its main audience: parents and caregivers of young children, who often have only a few minutes to understand how DPP works. For families, the process of applying to DPP can feel convoluted and complex, involving income verification and government jargon. The original site’s navigation was cluttered with redundant options, unexplained acronyms, and unfamiliar terms, lacking the clarity and direction that families needed. Simplifying the navigation was essential to improving user experience.
The new website is amazing. It brings to life our excellent work and it is so easy to navigate. Love the pictures, great colors, new graphics, languages, current events, and still discovering new categories.
Consolidating Scattered Information into a One-Stop Shop
After speaking with families to understand how they engage with the DPP website, we found that many families regularly return to the website to browse for resources, FAQs, and more throughout the application process. To make this easier, we aimed to create a comprehensive resource page that families could confidently bookmark and revisit. The result of this effort is the ‘Get Tuition Assistance’ page: a one-stop shop for information pertaining to the DPP application process.
The page features a step-by-step guide in the left sidebar that outlines the sequence of events. Within each step, key attachments, dates, and FAQs are prominently highlighted, providing families with essential information at a glance. Technical assistance bubbles appear under certain steps, ensuring that technical hiccups don’t hamper prospective DPP families’ progress. Each step has its own URL, so they are easily shared between family members and DPP staff.
As dates and details change regularly, a key objective in building this module was ensuring that the DPP team could easily and confidently update it. With a custom Wordpress backend that includes a series of tabs for each step, updating it on the backend only takes a few clicks.
Making Calculating Personal Savings Easier
A key feature of the DPP website for families and caregivers looking to see how much they could save is their Tuition Credit Calculator. The Tuition Credit Calculator is designed to help users estimate how much they might save based on user demographic questions like family size, annual income, full or half day attendance, and academic year. However, the original version of the calculator required users to know the specific preschool their child would attend and that school’s rating from the Colorado school rating program. This question required prior knowledge of the preschool system, creating a barrier for those just beginning to explore their options.
To ensure that the calculator was accessible to all users, we removed that question from the new calculator. Now, instead of providing a precise estimate, the calculator shows a range that accounts for schools of all ratings, making it useful to a wider audience regardless of where they are in the preschool research process.
Prioritizing Mobile for On-the-go Users
We always design and build sites to be fully responsive across all standard browser and device sizes. Early in the process, we evaluate the analytics of the current site to get a better picture of the user breakdown: in particular, what percentage of users view the site on desktop versus mobile, and whether any users view the site on extra large screens. By taking a data-driven approach, we are able to make decisions early in the design process about what screen sizes to prioritize for each client’s unique user needs.
For DPP, we discovered that consistently, around 60% of their users month over month viewed their site on mobile. A percentage that high signaled to the design team that during both the User Experience and User Interface phases, we needed to prioritize mobile users. Utilizing our standard best practices for mobile design as a springboard, we tailored our approach to DPP’s content and information structure throughout their new site. We utilize accordions, expand and reveal, and grouped horizontal scrolling to ensure that all content is easily accessible – but not at the cost of making users scroll endlessly to enroll, inquire, or calculate their savings.
Leading with Impact: Numbers, Eligibility, and Stories
DPP’s overarching goal for the new website was to create a more functional, fun, and visually compelling experience. But another big component of the project was refining how they tell their story to the public. Throughout the User Experience and User Interface phases, our design team helped identify the moments throughout the website where the DPP team could curate their content to better speak to their mission, impact, and audiences.
The work DPP has been doing year after year is making an ever-growing impact on the Denver community as more families become eligible for DPP benefits. Their new website streamlines communication around eligibility and how DPP works, as well as showcasing both the quantitative and human sides of their impact in the Denver community.
A Digital-First Brand Refresh
The Denver Preschool Program came to us at a moment when their brand was in flux. Their existing website closely matched their brand guide, but the internal team had been gradually evolving how they utilized their brand in marketing materials and other documents. Both iterations of the DPP brand relied on shades of primary colors, but the number of blues, reds, and yellows at play varied widely and undermined brand integrity.
With WCAG AA compliance and ease of use in mind, we worked with the DPP team to streamline their color palette and typography system within the framework of their current branding. For increased legibility and better contrast, we recommended the DPP team swap Museo–which is a very similar font to Sanchez Slab–with Work Sans, giving them a highly usable sans serif that compliments the playful, bolder Sanchez. The result is a digital-first, accessible brand that feels true to DPP’s long-standing visual identity, yet fresh and new for the next era of DPP’s growth.
Bringing Joy and Play to the New Experience
With a refreshed brand ready to go, the design team was primed to bring the new website to life. Knowing that kids are at the heart of DPP’s work, we aimed to infuse the site with the spirit of play – drawing inspiration from DPP’s logo and pre-K learning tools. Buttons and cards incorporate a playful “push” interaction, imitating keyboards designed for young kids and other kid-centric tech products. The “learn to write” rules from DPP’s logo appear throughout the experience as borders and dividers, bringing a cheerful, nostalgic touch to utilitarian design elements that nods to pre-K learning and DPP’s legacy brand.
To bring real educators, caregivers, and children to the forefront of their story, we showcased more of DPP’s unique photo and video library. The previous website did not fully utilize their stunning assets, often using images as backgrounds for content or only in the hero banners of key pages. The new design raises photos and videos out from under content to place smiling faces, kids at play, and dedicated Denver educators front and center. The final product exudes playfulness and whimsy, letting users enjoy a moment of child-like fun.
We had so much fun working on this site, check it out!