Direct Instruction

Build a new marketing site to reintroduce Direct Instruction (DI) instructional methodology and McGraw Hill DI Programs

Role: Lead Designer
Skills: UX, Design Support
Tools: Figma, Lucidchart, Blender
Collaborators: Orly Lipset, Sr. Copywriter, Marissa Ohm, Visual Design, Branding

Former Site

Goals

Marketing partner goals: their primary goal was present a stronger research story within the website because when it comes to intervention programs, proven-efficacy and research-backed instruction are key in the decision-making process.

Customer focused goals: We found that many current educators, particularly the newer ones, weren’t even familiar with the DI instructional method. Knowing that, we knew we needed to present a better guide on how the methodolgy works and what the benefits are. We also felt that the current site didn’t explain what makes each of the DI programs unique, so, improving that context for each was key.

Our secondary goal was to update the branding on the website to match the design work Marissa has developed.

Process

Keeping in mind our goals, I led our team in a digital white board session, where we read through the initial request and flagged any issues or concerns we saw. Then identified areas of improvement, worked to understand the instructional method, and read through existing DI program white papers and research articles that we would want to add to the main site. This is also where I worked out the site’s structure, I wanted to explore the idea of shifting the home page from just an entry point to each program, to being our DI explainer and benefits page, while also building out two subject pages that would help organize the many programs better.

After presenting our early concepts, we felt our partners could really benefit from seeing a comparison of their initial request and our suggested updates to the structure in the wireframes. So, I worked to build out both versions, in hopes to get official buy in from their team.

Requested Home Page Structure

Suggested Home Page Structure

Design

Marissa worked to develop the new brand identity for Direct Instruction, so she was resourced to take on the development of design for this site. A side-by-side of the old home page with the new really showcases her great work as well as the update content story. I assisted in making the product renders in Blender to support the subject pages.

Former site

Current Site