Designing Permissions for Enterprise Collaboration

Eytan Davidovits
May 15, 2017 · 4 min read
The new permissions component in an activity feed

Enterprise software is reaching a tipping point. The days of poorly designed, locally-hosted, and overly-complex software are numbered. Cloud-based enterprise apps are disrupting entire industries and design has never been so important.

What was once confined to a private network is now shared with whomever needs access. This new wave of enterprise collaboration mirrors familiar consumer applications, but adds a layer of complexity by sharing sensitive information with companies and individuals. To achieve this collaboration, applications need the UX of a consumer-level product with the complexity and security requirements of an enterprise company.

At Flexport, a tech-company building a global freight-forwarding platform, I tackled a small piece of this problem by designing a secure permissioning system.

My Solution

My solution has two states — collapsed and expanded. The collapsed state conveys permissions status at a glance, while the expanded state allows for permissions editing.

Collapsed State

At Flexport, different parties view messages and documents related to shipments.

In designing the collapsed state, I looked at multiple methods of displaying information: colors, icons, or text. Icons introduce buckets of permissions being either private (only Flexport) or public (shared with multiple parties).

First Iteration

We narrowed down the designs to two options.

Selected Designs

From gathering feedback on the version with colors, we concluded the colors were confusing. The version with icons was much better received.

Final Design

The final design narrows the privacy states to private and shared. Removing the bounding box decreased visual clutter, especially when there are multiple on a page. I also created a shortened version for areas with space constraints, such as a condensed list view.

Expanded State

While the collapsed state needs to be subtle, yet informative, the expanded state needs to be detailed. The expanded state is used to add parties for collaboration. The first round of iterations focused on how colors help differentiate parties. The toggle intended to make adding a party feel more deliberate.

First Iteration

The use of colors was debated and ultimately proved to cause more harm than good. Colors didn’t scale well because it required the user to associate a color with a party, proving difficult when there are upwards of 10 parties on a shipment. They’re also terrible from an accessibility perspective. However, the toggles tested well and reinforced the idea of actionability and intentionality.

Final Design

The final design uses just two colors — green and grey. Checkmarks were added to make it clear when a party is shared. Any other visual distractions were removed to clean up the interface.

Putting It Together

An animated example

Blending the best aspects of consumer-level collaboration with enterprise security requirements, this new component enables companies to interact at scale. Laying the foundation for the future, it adapts to fit its environment, creating more collaborative, yet secure applications.

This permissions feature plays a small part in enabling the future of secure enterprise collaboration. The future of enterprise collaboration will be very different from what we have today, and it’s on all of us to build well-designed and robust tools that will enable companies to work better together in the modern world.

Thanks for reading — If you liked this post, please hit the green heart below. Special thanks to Andrew Kaye and Andrew Coyle for help in editing.

Like the problems we’re solving? We’re hiring!

Say hello! Or follow me on Twitter or Medium.

Flexport Design

Designing the operating system for global trade @flexport

Thanks to Andrew Kaye, David Mostovoy, and Andrew Coyle

Eytan Davidovits

Written by

Product at Flexport.

Flexport Design

Designing the operating system for global trade @flexport

More From Medium

More on Design from Flexport Design

More on Design from Flexport Design

More on Design from Flexport Design

The Flexport Dashboard 2.0:

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade