Case Study
Normandale Community College
eWay Corp partnered with Stamats Communications to build the front-end template for Normandale Community College's Cascade CMS website. The deliverable: a pixel-perfect, fully ADA-compliant, WCAG 2.2 level AA conformant Bootstrap template that Cascade would use as the foundation for the rebuilt site.
- Industry
- Higher Education
- Platform
- Cascade CMS
- Services
- Cascade Template Development + Accessibility
- Engagement
- Project-based
Client Snapshot
About Normandale Community College
- Scale
- Public community college in Bloomington, Minnesota; member of the Minnesota State system
- Website
- www.normandale.edu
Normandale Community College is a public community college in Bloomington, Minnesota and a member of the Minnesota State system. The college is accredited by the Higher Learning Commission and carries multiple program-level accreditations across allied health, nursing, business, and fine arts.
Normandale is one of only four community colleges in the country accredited in three fine arts areas through the National Association of Schools of Music, the National Association of Schools of Theatre, and the National Association of Schools of Art and Design. Program accreditations across the college also include the American Dental Association, the American Dietetic Association, the Association of Collegiate Business Schools and Programs, the Commission on Accreditation of Allied Health Education Programs, the Minnesota State Board of Nursing, and the National League for Nursing.
The college's website is the primary recruiting and information channel for prospective students and the broader community across the Minneapolis-St. Paul region. Its visual identity and accessibility posture are both consequential for an institution whose audience spans every age, ability, and background the community college mission attracts.
The Challenge
A Cascade-ready template that needed to be pixel-perfect and WCAG 2.2 AA from construction.
In 2021, eWay Corp partnered with Stamats Communications for Normandale's website rebuild. The college had defined a refreshed visual identity through Stamats and provided design files in Adobe XD along with a style guide. eWay's role: translate the design into a working, Cascade-ready front-end template using Bootstrap and hand it to Cascade for content authoring.
The bar was high. Pixel-perfect alignment with the XD designs across desktop, laptop, and mobile screen sizes. Full ADA compliance. WCAG 2.2 level AA conformance throughout the template. The college wanted accessibility built in from the start rather than reviewed as a final pass.
The design also called for specific interactions that did not come for free. A hero banner that supports either video or an image slider, with a play/pause control. A search experience that opens a full-height menu area on click with cursor activation on an inner search dropdown. A triangle overlay hover state on feature image cards. A custom photo and video gallery slider for use across the site.
What had to be on the page
Pixel-perfect implementation of the Stamats XD designs across every screen size
WCAG 2.2 level AA conformance throughout the template
Full ADA compliance for the template and its interactions
Hero banner supporting either video or image slider with play/pause control
Search-to-menu UX with cursor activation on the inner search dropdown
Triangle overlay hover state on feature image cards
Custom photo and video gallery slider for the broader site
The Solution
A Bootstrap-based Cascade template, accessible by construction.
After receiving the XD files and the style guide, eWay analyzed the requirements and built a CMS-ready template that met every specification. The work used Bootstrap as the responsive baseline, with custom CSS and JavaScript for the client-specific interactions. Accessibility was treated as a build requirement rather than a final review pass. Every component was constructed to meet WCAG 2.2 level AA from the start.
Pixel-perfect responsive front-end template implementing the Stamats XD designs across desktop, laptop, and mobile
Bootstrap as the responsive baseline, with custom CSS and JavaScript for the client-specific interactions
WCAG 2.2 level AA conformance built into every component rather than retrofitted, with full ADA compliance
Hero banner component supporting video or image-slider mode with play/pause control
Search interaction with full-height menu reveal and cursor- activated inner search dropdown
Triangle overlay hover state on feature image cards
Custom photo and video gallery slider for the broader site
Cascade-ready template handed off for content authoring and publishing
Architecture
A glimpse of the stack
Application
Cascade CMS template with custom front end
Framework
Bootstrap (responsive baseline)
Frontend
HTML, CSS, JavaScript, jQuery
Accessibility
WCAG 2.2 level AA conformance and ADA compliance
The Outcome
Pixel-perfect, accessible by construction, ready for Cascade.
Pixel-perfect across every screen size
The template renders accurately against the Stamats XD designs from desktop down to mobile. Bootstrap provides the responsive baseline and custom CSS handles the client- specific spacing and interactions.
Accessible by construction
WCAG 2.2 level AA conformance and ADA compliance were built into the template from the start rather than retrofitted. Visitors using assistive technology, keyboard navigation, or alternative input methods can use the site the way it was meant to be used.
The interactions the design called for
The hero banner switches between video and image-slider modes with a play/pause control. The search experience reveals a full-height menu area with cursor activation on an inner dropdown. Feature image cards show a triangle overlay on hover. The custom gallery slider handles photos and videos through a single component.
Cascade-ready hand-off
The template was delivered ready for Cascade CMS to use as its publishing foundation. Editors and content teams could then build the rest of the site against the template without re-doing front-end work.
Normandale's website now runs on a Bootstrap-based Cascade template that meets WCAG 2.2 level AA from construction rather than retrofit. The visual fidelity to the Stamats design language is maintained across every screen size, and the editorial and content team can author against a template that was built for both compliance and design discipline at the same time.
Common questions about this engagement
What buyers ask before engaging us on a project like Normandale Community College
What does 'Cascade-ready template' mean?
Cascade CMS publishes site content against a template that defines the structure, layout, and interactions of every page. The template is the front end, the CMS handles authoring and publishing. eWay built the front-end template, including markup, styles, JavaScript interactions, and accessibility behavior, in a form Cascade can use as the foundation for the site. After hand-off, content teams build pages against the template inside Cascade without touching front-end code.
Why is WCAG 2.2 level AA important for a community college website?
Public institutions in the United States are subject to ADA and Section 508 accessibility obligations. WCAG 2.2 level AA is the most current accessibility standard at the time of this build and represents the conformance level commonly required for public-facing public-sector sites. Building accessibility in from construction rather than retrofitting at the end produces a template that holds up under audit and serves every visitor consistently regardless of how they interact with the page.
How did eWay work with Stamats on this project?
Stamats led the visual identity and design work for Normandale, providing the brand language, the XD design files, and the style guide. eWay was the technology partner: translating the design into a working Cascade-ready template, implementing the specific interactions, and meeting the accessibility requirements. The two organizations operated as a paired team where Stamats owned the design and eWay owned the technical implementation that made the design real.
What does 'pixel-perfect' mean when the same site has to work on mobile?
Pixel-perfect means the rendered template matches the design file at every defined breakpoint. The XD designs covered desktop, laptop, and mobile layouts. The template implements each layout precisely at its breakpoint, with Bootstrap handling the responsive baseline between breakpoints and custom CSS handling the client-specific spacing, interactions, and visual details that Bootstrap alone does not produce.
What does eWay own after delivery?
The template hand-off transitions site authoring and content management to the institution and its CMS team operating in Cascade. eWay continues to support the template itself for any markup, styling, accessibility, or interaction adjustments needed over time. New components, additional interactions, or template-level updates are scoped through eWay rather than handed to a separate vendor.
Related Case Studies
Other engagements you might want to see
Higher Education · Cascade · Accessibility
Section-Reorderable Cascade Template Build for a Community College District
Wayne County Community College District serves the metropolitan Detroit area across multiple campuses, with the Northwest Campus serving as the main hub for nursing, health sciences, information technology, business, and education programs. eWay Corp partnered with Stamats Communications to build Cascade CMS templates with a distinctive tray-based section reordering system, a separate mobile header design, and WCAG 2.1 level AA accessibility built in.
Higher Education · Cascade · Accessibility
Cascade Template Build with Animations and Mobile-Specific Header
Mid Michigan College serves communities across central Michigan through campuses in Harrison and Mt. Pleasant, offering 100 programs and pathways including transfer programs, career programs, and allied health fields. eWay Corp partnered with Stamats Communications to build Cascade CMS templates with section-level animations, a separate mobile header design, and WCAG 2.1 level AA accessibility built into construction.
Healthcare · Cascade · Accessibility
Magazine-Style Cascade Template for an Academic Medical Center
eWay Corp partnered with Stamats Communications to build a single-page Cascade CMS template for the University of New Mexico Health Sciences website. The deliverable: a magazine-style template with section-by-section animations, full WCAG 2.1 level AA compliance, and a Cascade-ready implementation that the health system's editorial team could use as the foundation for the rebuilt site.
Have a similar environment? Let's talk.
Let's scope a managed engagement for your platform.
Every engagement starts with a platform assessment. We review your current environment, document operational gaps, and recommend a managed operations model sized to your organization.