CrossClave Case Study

Overview

After nearly a decade of building privacy-first file backup and chat apps, SpiderOak enjoyed a loyal user base of privacy advocates and security-minded users around the world. As one of the first full-time design hires, I helped scale CrossClave (our flagship, all-in-one collaboration tool) from a beta product to over an enterprise tool with +20,000 active users.

MY ROLE

THE TEAM

TIMELINE

Lead UX/UI designer

2-3 designers, 2 product managers and 6+ engineers.

March 2019— August 2021

Challenge(s)

Extensive user surveys of existing SpiderOak customers helped the product/design teams to identify several must-have collaboration features that our customers want. The new app/design would align the business goals of reaching a broader enterprise audience with stringent security compliance needs and the feedback from users who wanted a more unified and full-featured collaboration tool.

Sure, we want data security, but we're not willing to give up any collaboration features for it.

As lead designer on a small team, I was able to set the high-level vision for the app while rolling up my sleeves and work directly on several parts of the new app design:

Design Solution(s)

💬 Designing a feature-rich chat experience

Led team of designers in UX/UI redesign of the chat/messaging experience...

Led junior designers in redesign of chat mobile experience

Designed file @mention feature to easily reference and collaborate on files directly within the chat UI

🔎 Global app search

Lead designer on a global search feature, including filtering functionality...

Users can search within a specific space and filter results by files, messages, or people.

📂 Shared file collaboration and management

Lead designer for the launch of file sharing/collaboration in CrossClave, including a robust version history feature.

Designed custom file icon set

Created detailed design documentation for company design component system

Contributing designer on file browsing UX/UI

Connecting and design for file version history feature

🎥 Adding a video calls feature

Contributing designer for the new video calling feature UI, as well UX details such as integrating video into the existing experience (chat and files)

Primary designer for a new video call mobile UI

Video calls integrate with chat, allowing users to quickly jump into channel calls in progress.

🏋️ Lightening cognitive load with simpler signup

Spearheaded A/B testing effort and subsequent design changes to simplify and improve app onboarding experience.

Leveraging testing data, I was contributing designer on a simplified onboarding flow with QR code support and opted to off-load security-driven features to later stage in user journey (see below)

Led design of Security Checklist feature, allowing users to navigate lengthy heavy-security features after signing up and at their own pace.

🗺️ Navigation design overhaul (i.e. where do we put all these rad new features?)

Integrating the myriad new collaboration features into the existing side menu navigation required extensive prototyping and testing to achieve a simple and intuitive navigation experience that maintained CrossClave's core value prop of a securely segmented data structure.

New top-level navigation based on core user tasks (team management, chats, files, etc.

Header navigation design allows quick access to different collaboration tools (chat, files, video calls) and an easy way to navigate back through the team and it's sub-channels via the breadcrumb navigation

The design evolution of a security-focused collaboration app.