Telerik Case Study on Paylocity’s use of Telerik Extensions for ASP.NET MVC
Company Name: Paylocity
Company Profile:
Paylocity provides Payroll, Human Resources, Tax Filing, and Time and Labor Management software
solutions through the Software-as-a-Service (SaaS) model. Combining the flexibility and control of an in-
house solution with the time and money savings associated with an outsourcing solution, Paylocity
believes that you shouldn't have to choose. We have created the most technologically advanced,
integrated web Payroll, HR, and TLM Software-as-a-Service (SAAS) solution for the mid-market and
complemented that with award-winning customer service.
Paylocity has twice been named the Payroll “Service Bureau of the Year” by the Independent Payroll
Providers Association (IPPA) because of its exceptional growth and client retention rate. Paylocity
Web Pay has received multiple 5 star ratings from the CPA Technology Advisor. In addition, Paylocity
has been recognized by Inc. Magazine six times as being among the nation’s fastest-growing, privately
held companies. In 2010 Paylocity received a Stevie award for the Sales Department of the Year, and in
2011 another Stevie for Contact Center of the Year with up to 100 seats. Also in 2011 Microsoft’s SQL
Server group released a case study on Paylocity available online at
http://www.microsoft.com/casestudies/Case_Study_Detail.aspx?CaseStudyID=4000009565 which
chronicles our software development team’s success using Microsoft and VMWare products to help
build and host a highly available, high-performing SaaS solution.
Project Title: Paylocity Web Time
Industry: Time & Labor Management (TLM)
Project URL: http://www.paylocity.com/payroll_services/time_labor.aspx
Attach company logo
Product used: Telerik Extensions for ASP.NET MVC
Product version used: 2010.1.416.235
Operating System: Windows Server 2008 R2 for the server, and all major browsers for the client
Database Platform: SQL Server 2008
Number of developers involved: 4 Developers
Development Time: 8 months
Challenges and Objectives: Paylocity acquired a Web Time product which had many customers
successfully using it for their Time & Labor Management (TLM) solution. Although the product had the
core TLM functionality, the development team felt that it was important to update the technology stack
from VB6, COM+ objects, and ASP pages to the Microsoft .NET platform to take advantage of the
advances in web-based technology that have occurred over the last 15 years, and to make it much
quicker and easier for the team to enhance and support the product going forward. The development
team also felt strongly they would be able to greatly increase user productivity by making the
application easier to use, and that the end result would also be able to more easily support different
devices (like Pads and Smart Phones) and all of the current and future browsers.
Although Sales & Marketing wanted a more modern looking UI, time to market was critical because of
the desire to support and continually enhance the product with new features so they could attract new
customers and/or better satisfy existing ones. So an approach was agreed upon where we would focus
on improving the different user experiences in different phases and still allow for some product
enhancements while the migration to a new technology stack was going on. The first phase was
targeted at the managers who have to approve timecards, perform scheduling, and approve time off
requests since they represent the application’s power-users who stood the most to benefit from an
improved user interface. The second phase would target the employees who need to punch in and
punch out and make time off requests, since they make up the bulk of the users. And the third phase
would migrate the administration screens where weren’t heavily used once a company was setup.
Once the project was approved, the developers started evaluating all of the .NET options available that
were available and determined that Microsoft’s ASP.NET MVC clearly offered the best solution available
for this project -- even though they would not be able to leverage the ASP.NET server controls that had
been created for the Payroll + HR application with this MVC application. In order to build a modern,
complex web user interface very quickly it was important to find a set of user controls with a consistent
look and feel that were as good or better than the existing asp.net server controls so it wouldn’t be
necessary to allocate the equivalent of a developer full-time for a year (or more) creating them from
scratch.
The main project objectives included the following:
• Replace a dated User Interface with a much more modern look and feel (or, as our sales
department put it, build a “sexy interface” for a product in a very traditional market segment)
• Significantly increase the productivity for the different roles using our application
• Deliver a reliable product that was adaptable to new client devices, and much easier for us to
enhance and support
Solution: ASP.NET MVC 2 had just been released and, besides the numerous jQuery controls that were
available from numerous sources with different look and feels, there were only a couple of vendors
offering a suite of controls built specifically for MVC. So we quickly determined that there were only 2
commercial products available which could come close to satisfying our requirements for the project
and began evaluating them.
At first glance the only major competitive product to Telerik’s Extensions for ASP.NET MVC seemed to
have a broader selection of controls available -- including scheduling controls which was very relevant
for our project. As we looked under the hood it became apparent that Telerik’s controls were much
closer to the team’s existing coding standards and best practices. The preliminary detailed technical
findings are found in Table 1 – MVC Control comparison.
Feature Telerik Comment Competitor Comment
Supports IE6 Yes No At the time this was still a requirement for this
product.
# of dlls registered 1 Telerik.Web.Mvc 5
Script Manager Yes Yes jQuery registration is still in <head> tag. Not as
advanced as Telerik script manager.
Supports latest jQuery
version
Yes Unknown Samples use jQuery 1.3.2
Supports Render() and
Response.Write
Yes Supports both so we can use
the faster Render().
No Only support <%= which is the same as
Response.Write.
Well behaved installer Yes ? Had to register aspnet after installation.
JSON paging support in
grid
Yes Yes/No Requires MS Ajax client side templates
Professional
Documentation
Yes No Their sales staff was extremely friendly and
helpful while we were evaluating the product,
working diligently with technical support to get
us answers to all of our questions.
Table 1 – MVC Control comparison
As we used the controls we found that the Telerik controls were not full of issues that needed to be
addressed in the code before we felt comfortable deploying them in production (even though the
competitor was very friendly and responsive to all of our questions and promised to address many of
our concerns in upcoming releases). But as an existing Telerik customer, we already knew from prior
experience that if we did find issues that we could count on on-going enhancements in their controls,
that they would always coordinate their releases with major Microsoft updates (even though ASP.NET
MVC is on an aggressive release schedule) so that we could continue to be aggressive about adopting
new technology quickly, and that their support is consistently the best that we have experienced with
any of our technology partners so we felt much more comfortable continuing to use Telerik.
Some of the other key factors that were ultimately behind our decision to go with Telerik’s Extensions
for ASP.NET MVC included the following:
- Ease with which we could extend or create composite controls using Telerik controls
- Ability to create a custom popup control for a complex object which uses the popup control, grid
and a custom version of the drop down control
- The ability of the Grid control to support their other controls as well as complex custom controls
(such as the data grid drop down) within the grid
- Ability to support our desired Employee Navigation composite control that combines multiple
Telerik controls to do a quick search for employees (AutoComplete, Grid, Dropdown)
Once we selected Telerik for this project, we started using the Menu control, TabStrip, Calendar,
ComboBox, Windows, and the Grid immediately. While each of these make significant contributions to
our application, the Grid provides by far the biggest value add out of all of the controls as it was used
from the more complex pages like our Dashboard, Timecard and Scheduling pages. And we were very
pleased that adding the Grid to our application did not have the same kind of overhead (for example,
with VIEWSTATE) that had prevented us from using third party grids in our Payroll + HR application
written in ASP.NET.
Once we had added Telerik Extensions for ASP.NET MVC to our programming toolkit, the team was able
to focus primarily on solving the biggest needs of the users by designing and building a more modern
user experience which increased user productivity that would be easier to enhance and support going
forward. So we started by building a Dashboard which would consolidate all of the most important
information that a manager needs on a daily basis on one page from which they could either act on the
information, or else drill down to the appropriate page where they could act on it as shown in Figure 1.
Figure 1 – Supervisor Dashboard
From the dashboard, Supervisors could quickly drill down into pages like Timecard Approvals as shown
in Figure 2.
Figure 2 – Timecard Approvals
After the Dashboard, we focused on the Timecard and the Scheduling functionality. With the Timecard
shown in Figure 3 we were able to increase the users’ productivity by making all of the information they
needed accessible on 1 page without the need to jump back and forth between 6 different pages to
complete a task. The new application provided easy navigation between pay periods, visual clues for
missing information, multiple timecard tabs if a pay period is longer than a week, and weekly totals at
the bottom. From the tabs at the bottom you can quickly get to benefit balances, pay adjustments, and
the employee’s schedule. Previously the user had to navigate back and forth between numerous pages
to get all of this information and then return to the page where they could act on it.
Figure 3 - Timecard
In addition to consolidating a lot of pages, we also wanted to let users edit information without
navigating to a different page and coming back, so we created embedded and pop-up data entry forms.
For example, Figure 4 shows that from the timecard you can quickly add punch information for the
current period or a series of days.
Figure 4 – Adding a punch or punches quickly on the timecard
When we wrote our scheduler, we create a page that looked more like a calendar as shown in Figure 5.
And from that page you can quickly Add shifts as shown in Figure 6, copy shifts as shown in Figure 7, or
create a quick shift as shown in Figure 8. So with this easier, more intuitive scheduling page it
dramatically reduces the amount of time to create a schedule and it is easier to see the results and
verify that they are correct.
Figure 5 - Scheduler
Figure 6 – Adding a Shift to Scheduler
Results: First and foremost we were able to delivery on the promise of a more modern user interface.
After considering the products our sales staff competes against for TLM deals Mike Haske, the Paylocity
VP of Sales & Marketing, stated “The look and feel of the new Paylocity Web Time has jumped way
ahead of the competition, and has set new standards for usability in the Time & Labor Management
market.” This point is aptly illustrated when you look at the metamorphosis of these pages in Figures 9
with the old and new dashboards, and Figure 10 with the old and the new scheduler.
Figure 9 – Old Dashboard shown with New Dashboard
Figure 10 – Old Scheduler shown with New Scheduler
But even more important than just providing a pretty timecard, the new version increases user
productivity. By consolidating multiple pages worth of information on a single page, providing the
ability to refresh individual components without reloading the entire page, and making data entry
accessible from the page or a pop-up without having to navigate to another page, and then come back
and refresh the entire page, supervisors – the real power-users of the system – are able to get their
work done much faster and more accurately than they could before.
Some of the additional benefits that we discovered working with the Telerik Extensions for ASP.NET
MVC were:
- The tab control used by the timecard enabled us to take advantage of AJAX to lazy load parts of
the page for better performance.
- The menu control was reused on the timecard and gave us an elegant way to present options on
the timecard.
- The DataBinding API of the grid (both server & client-side) allowed for a very simplified solution
for combining different filtering and navigation mechanisms on the Employee Scheduler (filter
employee attributes, navigate over different date ranges, page through result sets)
- The menu control made for an easy action bar which could be controlled based on the user’s
current selection context (enabling/disabling options).
- We were also able to use the Telerik menu controls for all of our products regardless of the
version of .NET they are written in providing us with a more consistent user experience across
our product line.
- Using MVC with the Telerik Extensions and jQuery we were also able to build a user interface
that virtually eliminates the need for users to scroll vertically (something they used to do a lot to
see all of the components of the supervisor dashboard) since we are now able to display the
information in a way that fits on a standard display.
When we made the decision to go with ASP.NET MVC and the Telerik Extensions for ASP.NET MVC we
knew that we could not re-use the user controls and many of the components we spent 7 years building
for our ASP.NET/ASP.NET AJAX products, but we felt strongly that doing so would pay off in the long run
by providing an architectural platform that was easier to enhance and support. As we started working in
the second phase enhancing the Employee experience we definitely saw the benefits in the significantly
reduced time it took to complete the new features for this release.
We also found that the decision to go with Telerik worked very well for our virtual development team
since the team includes remote employees who work at home or at a different office location than our
corporate headquarters in Illinois. Although we always look for the best and brightest developers to join
our team, and of all of our awards are proudest of the fact that we have been included for 6 years as
one of the “Chicago Area’s 101 Best and Brightest Companies to Work For”, it still consumes a lot of
valuable time to create documentation and training materials necessary to get employees up and
running on new technologies -- especially when those materials must be delivered to remote
employees. But with the extensive sample applications, online documentation and examples, videos,
and one of the biggest .NET communities with numerous forum members and threads, we didn’t need
to make as nearly a significant investment in training materials for the Telerik Extensions for ASP.NET
MVC as we would have otherwise. And every time there was a question or an issue that we couldn’t
quickly solve among ourselves, we were always able to get a quick, accurate, and extremely helpful
response from Telerik’s awesome support team or the extensive Telerik community of software
professionals.
Project ROI: The new version has coincided with a boost in the sales of our TLM product. Steve
Beauchamp, the President and CEO of Paylocity, indicated that “Web Time sales have increased more
than 50% from last fiscal year.”
But using the Telerik Extensions for ASP.NET MVC has also produced significant labor savings for this
project. The $6K in initial license fees we paid for the Premium Collection (since we are also using the
Telerik controls with our ASP.NET/AJAX application) meant that we did not need to add the equivalent
of another full-time employee to focus exclusively on rewriting our server controls for this project -- in
addition to other benefits like meeting the project timelines since we needed these controls completed
up front in order to complete the project on time.
Our developers also learned a lot of valuable lessons by looking at how Telerik wrote these controls for
ASP.NET MVC, saving us months in initial development time and subsequent refactoring costs. Also, if
we had written these controls ourselves they wouldn’t have been nearly as robust initially, and we
would not have been able to continually add all of the additional functionality which Telerik has added
since our initial purchase – features (like pop-up data entry forms from the grid) which we were able to
take advantage of right away to increase user productivity. When you take all of those factors into
account, the $6K initial investment, and even the $4K annual maintenance fees, associated with this
project both have both produced a return of more than 15 times the actual cost.