Shoflo: How we built “undo”

This blog post is intertwined with several interviews from the Shoflo team.
Since we opened shop, the Shoflo development team has created over 2,700 tasks in our project management system ranging from bug fixes to new features. We are steadily completing these tasks all the time, but one recent standout is #73, which added Undo functionality for your shows.  Undo was likely the most requested feature by our customers and something we’ve wanted to build since the beginning of Shoflo.  

;"“We have been wanting to roll out our version of “Undo” since the beginning, but as a startup you are always prioritizing… As Shoflo kept growing in 2015 we knew we wanted to build features faster so we started working on the 4th version of Shoflo (codename Phoenix). Phoenix was built to handle Shoflo as we scale in both customer size and features.”

— Stephen Bowles, Founder of Shoflo

Version 4.0 of our app introduced a new streamlined code base built off the latest and greatest web technologies and it allows us to build and deploy new features at a lightning pace. We went from deploying one (two if we were lucky) new features a month to two or three per week.

961948Our key to success with Undo, and with all of our endeavors thus far has been to build solid but simple layers in our platform that behave in a predictable manner.

— Mandarin Drummond, Senior Developer

When we set out to tackle Undo, the big question was how this would fit into Shoflo’s real-time environment & collaborative functionality.  One option was to approach Undo in a linear way, which is what apps like Microsoft Word, Excel, or Google Drive use where you step back through your changes one by one until you find the one you’re looking for.  While this is by far the most common approach technically, we felt that this method wouldn’t be an ideal fit for the event industry and our diverse users.

Shoflo is an app for event producers and coordinators… so we can’t just do what other apps do.  Take for example the audio engineer, he neither cares nor needs to undo what the producer wrote as the item title… the audio engineer just cares to see history and undo opportunities inside of his Audio column and the cells that matter to him.

— Stephen

When building shows, hundreds of edits might happen over a span of just a few hours, and it would be incredibly frustrating to have to go through those one by one until you found the change you were looking for. That’s why we did a general activity feed of all edits in a show, but also gave a cell edit history. So the key stakeholders of any cell can really see the history in an isolated away.

10729090A per-cell undo really gives you the ultimate flexibility.  The way we approach undo at Shoflo, you can go directly to a cell and revert to a past edit while preserving the history of all subsequent edits. 

— Ryan Carter, Designer

All you have to do is hit CMD/CTRL + Z in that cell, and you’ll get the full edit history of that cell.  Find that old content, hit the red REVERT button, and voila! You’ll have your old content back while maintaining the integrity of other edits.

shoflo_undoShoflo users love it. When we show them how you can do cell edit history and undo… you can hear their mouths just drop to the desk. We are very proud of it and the customers and users are loving it.

— Stephen

Undo is just a small example of how the Shoflo team is thinking every day… we know our industry and our users – we want to create tools that make their lives better and their jobs easier. After all the time, deliberation, and late nights we released Undo to our users and threw a mini Shoflo party 🙂 to celebrate.  I know it sounds crazy, but Issue #73 had been around for a long time and it felt amazing when we were finally able to close it.

About the Product team:

Our product team is rock solid with Stephen Bowles, Shoflo’s founder, actively scoping out the project and tasking the team daily. My role (Ryan Carter) is to design the interface and add in all the fine details to make sure that what we build fits the overall brand and experience of the app… we then have Mandarin Drummond & Josh Pagley who build the underlying functionality of the app… and last but not least we have Jeremy Pagley, who adds all the finishing touches and really connects the functionality with the end user through the design.

 


The Full Interviews

Read the full interviews with Stephen, Mandarin, and Ryan below.

;"Interview with Stephen Bowles, Founder of Shoflo

How is the product team set up at Shoflo?  How many designers, devs, project managers etc does Shoflo have?

Our product team is rock solid with Stephen Bowles, Shoflo’s founder, actively scoping out the project and tasking the team daily. My role (Ryan Carter) is to design the interface and add in all the fine details making sure what we build fits the overall brand and experience of the app… we then have Mandarin Drummond & Josh Pagley who build the underlying functionality of the app… and last but not least we have Jeremy Pagley, who adds all the finishing touches and really connects the functionality with the end user through the design.

Why (technically) did we choose to do Undo now and not earlier?  How did version 4.0 & using technologies such as React help with building out Undo?

“We have been wanting to roll out our version of “Undo” since the inception of Shoflo (2012), but as a startup you are always prioritizing… As Shoflo kept growing in 2015 we knew we wanted to build features faster so we started working on the 4th version of Shoflo (codename Phoenix). Phoenix was built to handle Shoflo as we scale in both customer size and features.”

What was the biggest challenge associated with the development of Activity Feed & Undo?

We really wanted the activity feed to ready naturally. So often in other apps activity feeds feel like reading a machine script… we wanted it to have natural language, showing you who (with their picture) made the edit, when and where. Finding the right way to craft the messages was a challenge… but a fun one.

Why did Shoflo settle on a non-linear approach to Undo?  Most apps do a step-by-step undo, so what makes Shoflo’s approach unique?

Well Shoflo is an app for event producers and coordinators… so we can’t just do what other apps do, our responsibility and our real value add to our customers and users is being aware of what their needs are. Linear undo does not make sense in a collaborative cue sheet. Take for example the audio engineer, he neither cares nor needs to undo what the producer wrote as the item title… the audio engineer just cares to see history and undo opportunities inside of his Audio column and the cells that matter to him. That’s why we did a general activity feed of all edits in a show, but also gave a cell edit history. So the key stakeholders of any cell can really see the history in an isolated away.

How has the reception of Undo been with Shoflo customers?

Shoflo users love it. When we show them how you can do cell edit history and undo… you can hear their mouths just drop to the desk. We are very proud of it and the customers and users are loving it.

How long has Undo been a feature you wanted to add to Shoflo?

Since the inception of Shoflo… and every day since until the day we launched Undo into production.


961948Interview with Mandarin Drummond, Lead Developer

What sort of technology is Shoflo built on?

Shoflo rides the JavaScript wave (among many other things). We also leverage AWS heavily 🙂

How long did Undo take to develop from start to finish?

I don’t know exactly – everything’s a blur and we are always working on different things concurrently. It seems like the first pass took about a week. Then to polish it off and iterate another week or so.

Why (technically) did we choose to do Undo now and not earlier?

Prior to Phoenix we were much less efficient. Everything we did was more difficult, including deployments and even small changes. It was a bit like swimming up stream. Post-Phoenix we can relax and float downstream.

How did Phoenix help with building out Undo?

… if developers have a clear, predictable way to think about these things, it’s much easier to focus on implementation instead of chasing your tail trying to understand how the UI is going to behave.

Our key to success with Undo, and with all of our endeavors thus far has been to build solid but simple layers in our platform that behave in a predictable manner. When you string all these components together, the end result is far from simple, but any interaction between two components in the platform can be easily understood.


10729090Interview with Ryan Carter, Designer

How many iterations of designs were made before finally settling on what Activity Feed & Undo came to look like?

Ultimately, we went through 16 different versions of Activity Feed and Undo before we finally settled on the version that made it to full production.

v1undoWhat sort of unique design-challenges did Activity Feed & Undo pose in the process?

Perhaps the biggest challenge and problem to think through is what we consider the biggest selling point of Shoflo – the real time edits and collaborative environment.  Initially, we planned on it being a live-feed of changes, but quickly realized that edits might come in one second after another in quick succession.  This would make finding your edits a huge pain.  

A second big challenge was how to display when someone adds a row or changes the segment title of a row.  For example, if I edit Item 110 | Walk On A and then add a row above it, that row is no longer Item 110, it is now Item 111.  

What does a per-cell version history/undo bring to the table that a linear version doesn’t?

Per-cell undo really gives you the ultimate flexibility and control over the action that undo performs.  Traditionally, apps like Google Docs, Microsoft Excel, or Apple Keynote approach undo linearly.  Meaning, edit 50 is undone, then edit 49, then edit 48 and so on.  But if you realized you made a change two hours ago on what those apps view as edit 10, you’d need to undo edits 11-50 even if you didn’t really want to.  

The way we approach undo at Shoflo, you can go directly to edit 10 and get or revert that cell’s content while preserving all subsequent edits.  Furthermore, we will still keep all those changes you made to that cell so if you ever do change your mind, you can easily grab that content.  

Shoflo_AF&UNDO_Designs