Michigan Colleges Online

Challenge

Michigan Colleges Online (MCO) is an initiative of the Michigan Community College Association and Michigan’s 28 community colleges. MCO is a web service that provides a consolidated listing of online courses offered by all MCO member colleges so that students can initiate the enrollment process for online education in Michigan from one source. Students can enroll for courses at other colleges through the MCO website, and complete the course from another “provider” college—while maintaining their status at their home college—and continue to receive “home” college support services. All credits earned at “provider colleges” transfer back to the student's “home college.”

In 2013, the MCCA needed to create a three-tiered web service for supporting registration, data services and administration for online education from scratch. “We needed a robust set of widgets so we wouldn’t have to reinvent the wheel,” said Randy Melton, MCCA Chief Technology Officer. Melton’s team was already familiar with Kendo UI® by Progress widgets.

A key requirement was building an intuitive interface. “The legacy interfaces were clunky,” he said. “We wanted to provide them with an app-like experience, so they didn’t feel like they were using a web page. Incorporating visual clues and responsiveness was important to create this experience.”

Another challenge was project complexity. The team would have to create complex workflows for registration between up to three colleges. “We have to manage the business rules around different commissions, academic standings, financial aid and other factors,” he said.

For this reason, Grid expert sheet control was important. “We looked at several solutions, but nothing really stood out except the grid features of Kendo UI framework,” said Melton. “Progress has been responsive to following market trends for supporting AngularJS, and we would be able to leverage Kendo UI framework for mobile development with Cordova using PhoneGap.”

Solution

According to Melton, Kendo UI framework’s complete end-to-end success data model is where the solution shines. “We started by using the Kendo UI Grid to model our business problem, including workflows and a registration sequence model, then made it extendible,” he said. “We used the grid for UI support, and it worked well at the controller level. There was a natural one-to- one mapping from our data store to the view model.”

Kendo UI controls are adaptable to different frameworks, which enabled Melton’s team to use open-source solutions. “The Kendo UI framework enabled us to provide users with a rich interface for managing online enrollments across Michigan within the community college association. The grid tool and its ability to export to Excel provided a great user experience.”

Additionally, Melton said combining Angular with the Sails (node.js) and MongoDB worked well with Kendo UI framework. “With modern mobile apps, you have to consider how fast the widget reacts to the user’s actions,” he said. “But behind the scenes, you need the data to hydrate the widget. If you’re on SQL, you’d have to translate data into JSON in the middle, and that would slow down performance. Using OData, you can talk directly to the database to hydrate the widgets faster, and create a better, more intuitive UX.”

Melton’s team leveraged the Kendo UI Grid to manage all workflows and business processes for the site. “The Grid control enables us to present data in a way that makes sense to users, and talk to backend systems effectively and efficiently,” he said. “The other best-kept secret was the scheduler,” he said. “We use it to create global academic calendars, room calendars, plus many others. It’s a huge time-saver, because we can hydrate multiple calendars with one view.”

Results

From end-to-end, the project was complete in less than nine months. The site will be used by roughly 185 administrators and contacts on the backend, and thousands of students on the frontend. Melton said Kendo UI controls enabled three key benefits:

• A great user experience

• Fast development

• High-quality defect management.

Performance is also faster and more reliable than it would have been using the legacy system. “It’s night and day,” said Melton. “It helped that we used MongoDB, because we didn’t have to build models in SQL. The UI was already there.”

If Melton’s team had manually coded the site, there would have been no way to incorporate all the rich functionality Kendo UI framework offers—the application would be too large. “The market is shifting away from JQuery; more developers are writing pure Angular directives to reduce page load size, because mobile coding must be lean,” he said. “After lean, a robust experience is the goal, and when you start delivering more applications services, page load speed is important. So, you have to be conscious of size.”

The end result was a robust, reliable and fast- performing site. “Building business processes for higher education can be a hard thing to get right,” he said. “We had to build a data model that allowed agility for managing processes without being too stringent. With Kendo UI controls, we were able to create a robust, reliable user experience quickly; it has a logical framework for working with data and saves you time by simplifying data source connectivity.

Future Plans

According to Melton, the team will be further leveraging Kendo

UI framework extensively to develop its Pathways project, a state-funded success system for Michigan colleges that will replace the student portal and help students start college with “the end in mind.” The first phase of Pathways is planned for early 2016 for testing. “Pathways will support a whole new level of collaboration. It’s amazing how you can use the Kendo UI Grid to demystify complex activities and processes, and make essential data easy to find and use.”