Background

Cloud Object Storage is an enterprise cloud storage service on IBM Cloud platform. To store and organize their data, users create buckets, which are containers that hold data. 

A key financial client needs to create buckets to store sensitive financial records and customer data. To meet security compliance requirements for storing sensitive data, they need to encrypt their bucket with an encryption key.

My role

I lead the design effort for this project. I conducted research, produced sketches and wireframes, delivered final assets and documents, and evaluated user behavior with the live product.

The problem

Users need securely store sensitive data by encrypting their bucket, but struggle to add encryption because of the disjointed experience of switching tabs between services.

Adding encryption a bucket requires users to open multiple tabs, complete three separate subtasks, all while referencing directions on another tab. This resulted in a cumbersome and confusing experience. 

How might we enable users to add on a third-party service without leaving the context they are in?

Goals

• User: Add a Key Management Service to a bucket without leaving the page the current page they are on 

• Business: Increase adoption of Key Management Services and retention of users

• Product: Improve the service-to-service integration experience

Ideation

EXPLORATORY DESIGNS: INTEGRATIONS

This particular pattern went through many rounds of iteration. In the as-is, Integrations consisted of 4 check boxes, which could be easily overlooked. Since these integrations were IBM services provided in our catalog, my first exploration used the service catalog tile as an entry point to adding the integration. However, it felt very “market-y”, rather than productive-use. Next, I explored variations with selectable tiles, cards, and a toggle interaction. The toggle interaction ended up testing very well, so I continued to push the pattern using a toggle interaction.

USER RESEARCH

After gathering requirements and understanding users’ needs, I started to explore lo-fi design iterations. To solve the problem of users losing context of their main task, I utilized side panels to contain the flow of adding Key Protect, a key management service. This component enables users to interact with secondary content without losing context of the current page they are on. After a few rounds of design critique and feedback, I had two design variations ready for A/B testing. 

Finding & insights

We recruited 10 participants with technical backgrounds and they were tasked with adding an encryption service to their bucket using 2 design variations — the findings were insightful.  

Participants expressed that they felt more confident using Version B that they had completed their task than in Version A. However, when we looked at the actual task accomplishment rate, the difference was staggering. 

Version A had a 60% higher task accomplishment rate than Version B.  

Digging deeper into the data, a pattern emerged, showing that the long, single panel in Version B caused cognitive overload, resulting in 40% of users missing the critical step of selecting the correct key type. In contrast, the progress stepper in Version A guided users through the steps and helped them focus on completing one task at a time. 

After saving their service and key, users can review their key management configurations. From here, the bucket is ready to be created.

Impact & results

DESIGN SYSTEM IMPACT

I contributed my designs to our design system, allowing any product across the platform to implement this hosted component with minimal effort from Design and Development. I wrote all design documentation, providing instructions and examples of how to use the component—resulting in more efficient and consistent design. Code documentation was written by my team’s lead developer.

RESULTS

So the are users able to add encryption to their buckets? Yes.

Since my designs have gone into production, feature adoption is up by 96%.