Accessible & modular design for engineering & management program

MIT SDM website design
MITDigitalDigitalAccessibilityUX DesignWebsite DesignWebsite DevelopmentIndustryIndustryEducationDurationDuration7 monthsDesignDesignPasses WCAG 2.1 guidelines for accessibilityDevelopmentDevelopmentWordpress Gutenberg Project teamProject teamSkadi GidionsenSenior UX & Digital DirectorEllery MooreyCreative DirectorHeidi ScammonSenior Designer10custom page templates

A unique program needs a unique website

MIT System Design & Management pulls together methods and tools from advanced engineering and management principles to address global challenges. This rigorous program needed a website that did a better job at representing who they are, and explaining to the MIT community and beyond, what system thinking is. Accessible & modular design elements help to create an experience design that was perfect for who they are.

Modular design that is accessible

This website design was built with modular elements meaning any section on the website could be added to any page. This gave our client the most flexibility with website administration and makes the site very easy to update and customize from an administration perspective. For the design of each section to work on any page, special design considerations needed to be made. The flow from one section to another needed to feel seamless, or obviously different, depending on the purpose and content.

Visit the website

MIT SDM website design
MIT SDM website design

Design with purpose

Since sections of the website design could be repeated, we needed to make sure they were designed purposefully. We applied our systems thinking to design to ensure that we weren’t redesigning elements that already had a visual language established. Purposeful design was a very important consideration when it came to the website design and website build for this project.

Accessible design elements that are distinct

For the homepage design of MIT SDM, we played with typography as a design element that allows a feature image to peek through the letters. This unique design approach allowed us to keep the text and image overlay accessible. All of the design elements, text and background colors pass WCAG 2.1 guidelines, so that the user experience design of the website is inclusive for all. Read more about our approach to a digital design.