#quickleft

Sprintly was recently recognized by Software Advice as one of the top five favorite user interfaces in agile project management. Software Advice researched 100s of project management interfaces, selected their top five favorite and in the review called Sprintly's interface "remarkably attractive."

I had a chance to catch up with author Noel Radley to ask her a few questions about herself, how she found Sprintly and what were her primary drivers for selecting Sprintly:

Phuong: Will you give us some background on yourself?

Noel: I’ve been researcher since 2001 (PhD in English), covering topics of technology since 2007. I’ve also taught writing for over a decade at University of Texas at Austin and Santa Clara University. At both campuses, I led research in teaching with technology, including work in Drupal, electronic portfolios, and media production. In February, I joined Software Advice, where my primary research is project management software.

Phuong: How did you find Sprintly?

Noel: It was a rigorous process to select our five favorite softwares. We surveyed 100s of project management interfaces, and we deeply researched about a dozen.

Sprintly showed up as a popular project management interface, and repeatedly we found users commenting on the visual design. As we evaluated the interface, we agreed that it had earned its reputation for compelling design. It really stood out among project management softwares.

Phuong: What were the primary drivers for choosing Sprintly?

Noel: First, we were looking for interfaces that wowed us with beautiful design. Secondly, we were searching for interfaces that helped teams think in critical and productive ways about workflows. We liked Sprintly because it did both. The interface was stunning, while it also provided real insight to project teams.

It’s true there are many interfaces to help track development processes, but we wanted to search for ones that helped developers think in a new way. We feel Sprintly offers unique dashboard views that are conducive in prioritizing, decision-making, and adapting a development workflow.

For example, the Kanban style board is designed in such a way it doesn’t look like your typical card wall, which is refreshing. It also has functionalities your typical card wall may not have, since the cards are more obviously interactive and social than other boards we’d seen.

Phuong: From a UX and UI perspective, do you have any opinions on what a good agile project management tool should provide a team?

Noel: Our article focuses on UI design. To demonstrate great UI, we feel that an agile project management tool would have powerful visual metaphors to help the team conceptualize their work. The tool would be accessible with clearly labelled and categorized features. Finally, in terms of color and composition, the design would make it easy for the team to identify what aspects of the development were the most important at any given moment.

For development teams, the interface should make it easy for teams to view and adapt workflows in real-time.

From surveying these tools, we got a sense that agile project management interfaces are becoming more user-oriented in general. This seemed to indicate an innovative moment for these kinds of software, and the interfaces we selected were leading the way. We can’t wait to see what’s next!

Last week we launched a dramatic increase in performance for our front end. We are built on Backbone.js and, over time, our rendering times have slowed down. Luckily, using some of the great tools in the latest versions of Chrome and a few additional tools for instrumenting how the Sprintly frontend was performing, fixing it was dramatically easier than it would have been just a few months ago.

Analyzing the Refactor

After some initial testing of rendering times and analyzing performance data gathered with Caliper, we determined that the best way to get out from underneath lethargic performance with large item-sets was to rethink how item cards were being rendered throughout the app, with a focus on item columns. Item columns are containers for groups of item cards (stories, tasks, items and defects) and show up on the dashboard and items pages.

Item column views do *a lot* of heavy lifting in Sprintly, and since they were initially developed a myriad of features have been added, subtracted, balanced and adjusted, leading to optimizations for some scenarios but not others. We sped up item columns primarily by optimizing how item columns rendered and cached the individual cards that go into them--rather than re-rendering column contents when changes happen, cards are inserted, removed and re-rendered individually, leading to better overall performance everywhere item columns are in play.

Better Tooling

The new Flame Chart view for CPU profiling made it easy to spot and optimize areas in our app that needed a dose of micro-optimizations. Given that many of the performance enhancements focused on customers with the most items, relatively small improvements can have a big impact on the most intensive parts of the rendering stack: smooth scrolling / lazy-loading, resorting and switching between the dashboard and the items view.

  The notion of JavaScript and browser rendering “frame budget” was a focus of the performance refactoring and much of the speed improvements can from recognizing when the Backbone application was attempting to do too much during a given frame. Actions that trigger rendering/repainting, requesting data from local cache or from the API or binding events to the DOM are common culprits when trying to improve framerate.

  By using the timelines panel in the Chrome developer tools we were able to identify where bottlenecks were forming, and were able to move many rendering actions to be asynchronous, either by delaying them with a set timeout or a using requestAnimationFrame.

A big shout-out to Addy Osmani and his spectacularly titled blog post Taming The Unicorn: Easing JavaScript Memory Profiling In Chrome DevTools, which provided an excellent set of sign posts for wandering through the jungle of JavaScript heap dumps and CPU profiles.

It’s worth noting that while we were primarily measuring in the latest version of Chrome, there are good alternatives in the Firefox devtools, which we were consulting from time to time to make sure gains in one browser weren’t causing regressions in another.

Performance Monitoring and Measurement

We were able to consistently and accurate measure performance characteristics, which greatly influenced how we went about re-writing how item columns and item cards were being rendered to address these framerate, load time and rendering concerns.

Here are some of the results that were measured using Caliper from before and and after the performance release:

Before the performance refactor:

  After the performance refactor:

  Following the performance release, average rendering time was decreased on average of 30%, with an 11% decrease in 90th percentile rendering time and a 6% decrease on the median response. We’re going to continue measuring and quantifying frontend performance--and still have more speed improvements in the works.

We’ve noticed palpable difference in performance and have been hearing the same from some of our customers already. Rob Munro, CEO and Scotch Aficionado of Idibon, told us “We stress-tested Sprint.ly over the last couple of days a few times with multiple people searching/browsing/editing all at once. It went really smoothly - thanks for the great product updates!!”

Let us know if it feels good for you too.

Thanks so much to Quick Left, our pals in Boulder who helped bring all this impressive JavaScriptiness together.

A brief detour on my path toward practical Python programming (alliteration!): bash. 

Among the desirable skills that I've seen listed in many data science job descriptions: bash (unix command line). I've played around with this a little in the past (who hasn't goofed around at the Windows CMD or OS X Terminal??), but this crash course in bash from the Learn Code The Hard Way series was a great, structured introduction. I'm certainly not a skilled user, but I can do something very simple (and powerful!) things with it now.

We've once again teamed up with Quickleft on a cool new project.  More info coming soon...