As Self-Service matured as a product, RightScale’s customers were using the platform to orchestrate very complex environments in the cloud. CAT files (code that describe the structure and behavior of CloudApps in Self-Service), were becoming increasingly complicated and lengthy.
CAT imports allows the use of the resources in one CAT file to be used in another. In this way, development of CAT files would become modular, and simpler.
Project Brief
CAT imports is a huge paradigm shift and requires a complete change in one of the most fundamental user flows in Self-Service. It would turn a one click operation into a multi-step action.
- The new user flow should be optimized to be as fast as possible, despite the multiple steps.
- Complex dependencies should be hidden unless absolutely required.
- An entirely new paradigm of “recompilation” is to be introduced.
- UI runs the risk of being overwhelmed with stale flags.
- Backend services initially will not be robust enough to handle a very large job queue.
- Design had to consider that the upcoming Projects paradigm will further increase the complexity at every stage.
Designing for asynchronous releases of inter-dependent features
The biggest consideration for this project is the introduction of a new user flow. The second big consideration was the introduction of a new organizational schema that would increase complexity even more. Looking at the product road map, I introduced minor changes in the UI in stages over a few months so as to slowly transition the user experience to what it would ultimately be when CAT imports is finally released.
Handling complex dependency trees
With code reuse comes the problem of dependencies and staleness of dependent code. Updating a particular CAT file requires that all objects dependent on it to be updated. The immense complexity of the problem were resolved with two guiding principles kept in mind while designing:
- Simplify the dependency information made visible to users
- Break up complex flows into multiple stages – lower cognitive load on the user.
- Dependency information to be visible only in parts of the UI used by the users writing and managing CAT files, and that only in places where it would affect their workflow.
Design and Prototype
In the First stage of the roll out, the upload panel is introduced.
Prototype: https://invis.io/QJ6ORQ8EF#/146490662_001
In the next stage, the projects paradigm (which brings in more complexity) will be introduced.
Axure Prototype : http://3316cu.axshare.com/home.html
Usability Testing
I was responsible for the usability testing for this feature. I carried it out in an A/B style with different participants seeing different UI configurations. Feedback was used to determine the final design used (which you can see in the prototypes above). To summarize the things I did for the Usabiity testing:
- Write the script for the interviews
- Build prototypes for each task in the study
- Moderate the study to ensure customers do not stray too far off the planned script.
- Document the different ways that customers want to incorporate CAT imports in their workflows, plan for future features.
- Consolidate findings and convey them to Product Management, and provide input for road map prioritization discussions.
- Document the design in detail for the benefit of developers and designers who will need to work on the project in the future, myself included.
Conclusion
CAT Imports introduced complex, but much needed functionality in Self-Service. It has been intentionally designed in different versions, to fit the road map requirements of features being released. Careful design and planning at every step of the process has made product management and me confident that the release of the features will be met with minimal confusion and improved productivity for our customers.