Modernizing a Legacy Learning Simulation for Cornell University

How eCornell transformed a Flash-based simulation into a clearer, responsive learning experience that improved student understanding and certification readiness

‍

Client

eCornell, Cornell University’s online learning unit

Sector

Higher Education
Online Learning
Professional Education
EdTech

Capabilities

UX Strategy
Product Modernization
Learning Experience Design
Responsive Web Design
Data-Heavy Interface Design
Design Systems
Developer Handoff
Brand-Aligned Product Design

Executive Summary

eCornell, Cornell University’s online learning unit, needed to modernize a legacy Flash-based simulation application used in its professional certificate programs. The simulation was an important part of the online learning experience, but the product had become constrained by outdated technology, a dated interface, and interaction patterns that no longer matched the expectations of modern digital learners.

The project required more than a visual redesign. eCornell needed a clear product experience that could support complex simulation data, improve student comprehension, work across modern screen sizes, align with Cornell’s visual standards, and give the development team a practical foundation for implementation.

The work focused on redesigning the structure, interface, and interaction model of the simulation so students could better understand the learning material, move through the experience with greater confidence, and improve their readiness for the exams required to earn certification.

The final deliverables included low-fidelity wireframes, high-fidelity mockups for eight core page types, responsive design direction, a Cornell-aligned visual system, and implementation-ready interface elements for development.

The result was a modernized learning product foundation that helped eCornell move from a legacy Flash-based experience to a clearer, more intuitive, and more effective web-based simulation.

The Situation

eCornell develops and delivers non-degree certificates for working professionals. These students often balance coursework with full-time jobs, family responsibilities, and career advancement goals. For this audience, learning tools need to be clear, efficient, and easy to understand quickly.

The legacy simulation application played an important role in the certificate experience, but it was built on Flash technology and required redevelopment for the modern web. As the platform moved toward responsive web technologies, the user experience also needed to be reconsidered.

The existing simulation contained a large amount of information and multiple interaction types. A simple technical rebuild would not have solved the deeper experience challenge. Without rethinking the interface, hierarchy, and student journey, eCornell risked carrying the same usability issues into a new technical environment.

The opportunity was to use the modernization effort to improve both the technology foundation and the learning experience.

The Core Challenge

The project had three strategic challenges.

1. Modernize a legacy product without losing instructional value

The simulation needed to move away from Flash and into a responsive web environment. But the product could not simply be rebuilt screen by screen. The instructional value of the simulation had to be preserved while the interface, structure, and interactions were modernized.

The work required a design approach that respected the existing learning objectives while improving how students experienced the simulation.

2. Make complex information easier to understand

The application contained a large amount of data, controls, and decision points. Students needed to be able to interpret information quickly, understand what actions were available, and move through the simulation without unnecessary confusion.

This made information architecture, visual hierarchy, and interaction clarity central to the success of the redesign.

3. Create a cohesive experience aligned with Cornell standards

Because the product belonged to eCornell, the design needed to feel credible, professional, and aligned with Cornell’s brand guidelines. The interface had to balance institutional consistency with the need for a modern, interactive, and engaging simulation experience.

The design system needed to support both brand alignment and product usability.

The Mandate

eCornell needed a UX/UI design partner who could work across product, engineering, instructional design, creative direction, and brand management.

The project team included:

Product Manager
Front-end Web Developer
Full-Stack Developer
Instructional Designer
Creative Director
Brand Manager

The mandate was to create the visual design and structural foundation that would guide the redevelopment of the simulation experience.

This included low-fidelity level design and interface wireframes, high-fidelity mockups for the eight core page types, responsive design direction, and a complete set of interface elements prepared for implementation.

The Approach

The work began with the experience structure before moving into visual design.

Rather than treating the project as a surface-level UI refresh, the redesign focused first on how students would understand, navigate, and interact with the simulation.

The design process centered on four areas:

1. Reframing the student journey

The simulation needed to guide students through a complex learning environment. The first step was to clarify the structure of the experience, including how students would move through different levels, interpret information, and interact with key elements.

Low-fidelity wireframes were used to explore layout improvements, content hierarchy, and interaction placement. These early designs helped establish a clearer student journey before investing in high-fidelity visual design.

2. Organizing dense information into clearer layouts

Because the simulation included a large amount of data, the interface needed to reduce cognitive load. The design work focused on grouping related information, creating stronger visual hierarchy, and helping students understand what mattered most on each screen.

The goal was to make the experience easier to scan, easier to learn, and easier to use during decision-making moments.

3. Designing a cohesive system across eight page types

The simulation used eight distinct types of pages. Each page type had to support a specific function while still feeling part of one unified product experience.

High-fidelity mockups were created for each of these page types. Together, they established the visual system for the application, including layout patterns, typography hierarchy, controls, buttons, icons, sample imagery, and data visualization elements.

This ensured the experience would remain consistent as students moved through different parts of the simulation.

4. Preparing the design for responsive web implementation

The redesigned simulation needed to be practical for development. The design system was created with responsiveness in mind, ensuring the product could move into a modern web environment rather than remain tied to a fixed legacy interface.

Interface elements were prepared for CSS implementation, giving the development team a clear visual and structural foundation to build from.

What Was Delivered

The final deliverables gave eCornell a complete UX/UI foundation for redeveloping the simulation.

Deliverables included:

Low-fidelity level design and interface wireframes
Proposed layout edits and interaction patterns
High-fidelity mockups for eight simulation page types
Responsive design direction
Cornell-aligned visual design system
Color chart
Font and typography recommendations
Typography hierarchy
Iconography
Buttons and controls
Data visualization elements
Sample imagery
Interface elements prepared for CSS implementation
Design direction aligned with Cornell style guidelines

What Changed

The redesigned experience shifted the simulation from a dated, Flash-based product into a clearer and more modern learning interface.

The work improved several parts of the experience.

Clearer structure

The redesigned layouts gave students a more logical way to move through the simulation. Information was organized more intentionally, helping students understand where they were, what they needed to do, and how different parts of the experience connected.

Stronger learnability

The interface was designed to be easier for first-time users to understand. By improving hierarchy, interaction clarity, and visual consistency, the simulation became more approachable for students who needed to quickly learn how to use the tool.

Better handling of complex data

The design helped translate dense simulation information into clearer interface patterns. Data, controls, and instructional content were organized in ways that supported comprehension rather than overwhelming the learner.

More cohesive visual system

The eight page types were unified through a consistent design language. Typography, colors, icons, buttons, controls, and visual patterns worked together as a system rather than as separate screens.

Improved implementation readiness

The final mockups and interface elements gave eCornell’s development team a more practical foundation for rebuilding the application with responsive web technologies.

The Outcome

The final work helped eCornell modernize a legacy learning simulation into a clearer, more intuitive, and responsive digital learning experience.

The redesign improved student understanding by making the simulation easier to navigate, easier to interpret, and easier to learn from. Students were better able to engage with the material because the interface presented complex information in a more structured and usable way.

The improved experience also supported stronger certification readiness. Because the simulation was connected to the knowledge and decision-making required for certification, a clearer learning experience helped students better prepare for the exams required to earn their certificates.

The project did not simply replace old technology. It helped eCornell reduce experience debt inside a legacy learning product and create a stronger foundation for professional online education.

Impact

Improved student understanding of complex simulation material
Supported better outcomes on exams required for certification
Modernized a legacy Flash-based learning product for responsive web delivery
Created a clearer and more intuitive student experience
Established a cohesive UX/UI system across eight core page types
Aligned the redesigned product experience with Cornell style guidelines
Provided development-ready design assets for implementation
Helped bridge instructional goals, product requirements, brand standards, and engineering execution

Why This Matters

Legacy educational products often carry two forms of debt: technical debt and experience debt.

Technical debt shows up in outdated platforms, unsupported technologies, and systems that are difficult to maintain. Experience debt shows up in confusing interfaces, weak hierarchy, unclear interactions, and learning tools that make students work harder than necessary to understand the material.

For eCornell, the modernization effort addressed both.

By redesigning the structure, interface, and interaction model of the simulation, the project helped turn a legacy application into a more usable and student-centered learning product.

The work supported a larger strategic objective: helping a leading university deliver professional online education through digital experiences that match the quality, clarity, and credibility of the Cornell brand.

Portfolio Summary

Aburam Helmsman Partners supported eCornell, Cornell University’s online learning unit, in modernizing a legacy Flash-based simulation application into a responsive, web-ready learning experience. The work included UX strategy, low-fidelity wireframes, high-fidelity mockups for eight page types, responsive design direction, data-heavy interface design, Cornell-aligned visual design, and development-ready assets. The redesigned experience improved student understanding of the simulation and supported better outcomes on the exams required for certification.

‍