💡 Highlights
• Designs won 1st place in our company summer hackathon out of 6 team projects
• Shipped MVP and launched in January
BACKGROUND
What is Digs?
Digs is a startup with a Figma-like AI collaboration platform that eliminates client and team frustration by managing communication, documents, and decisions all in one place. Builders and contractors (interior designers, electricians, suppliers/vendors) are able to collaborate on the entire process from design and pre-construction to homeowner handoff.
CHALLENGE
Builders and contractors struggle to quickly access project documents on home construction sites
There is friction when having to log in to the Digs platform in order to access the project plan and dig through tons of files. On the other hand, printed physical documents of their plans and tasks can become outdated when a project is moving fast and decisions are being made regularly, leading to miscommunication, mistakes, and inefficiencies, as workers don’t have the most up to date information.
SOLUTION
Easily share files via links and QR codes without requiring a Digs login.
This allows Digs users to share specific files with on-site personnel by scanning a QR code or clicking a URL, making files easily accessible. This workflow decreases time users have to spend digging through our file system in a project. Now, users can view a QR code the team lead has taped up on the wall on the construction site, scan it with their phone or tablet, and view the relevant file immediately on their phone.
Sharing from Canvas
Within the project canvas and file previewer, easily publish and share the file via a link or a QR Code
.gif)
Sharing from File View
Same feature flow exists within a file management view via file lists to easily bulk share rather than going into each individual file to share
Anonymous File View
A stripped back version of the Digs canvas to only feature the shared file
CUSTOMER RESEARCH + INSIGHTS
Clunky workflows and using 3rd party platforms to accomplish public file sharing
Since Digs does not currently have a way for users to easily share files with their team members who are not invited into the project file in the platform, users are resorting to other workflows to share information with 3rd party contractors.
The team had existing research done from product meetings with customers. I was also able to chat with construction managers from home building companies, like Cambridge Homes.
WORKFLOW 1: USING 3RD PARTY QR CODE GENERATORS
WORKFLOW 2: USING EXTERNAL FILE STORAGE PLATFORMS (DROPBOX/GOOGLE) TO SHARE
The problem with this is that files might change within Digs as team members continue to make updates on the platform, but they are not going back to update in Dropbox/Google, and this has not been communicated to team. This means plans are outdated and contractors are working with wrong information, leading to rework of existing tasks.
This is highly problematic as there would be vendor and subcontractor worker inefficiency as it would take longer to communicate and remedy mistakes. There may be extra time taken to identify the source of truth, and days are lost in the build process.
REQUIREMENTS GATHERING
Working with product and engineering for product brief, feature flow, and tech specs
The product team had a list of requirements and requests for this specific feature. The document outlined use cases, jobs to be done, and technical requirements.
Based on the initial requirements gathering, I then conducted some secondary research around this feature and existing patterns so we could further refine them. ***requirements are an evolving living document that is refined over time.
SECONDARY RESEARCH + FEATURE INSPO
File sharing normally occurs with invites and links, but QR codes are uncommon
I conducted secondary research on how other products conventionally present the ability to share a file. It is incredibly common for a file storage platform to present a share link, but not with QR codes.
Most of my research included searching for existing patterns for sharing files externally/publicly, or outside an organization.
Platforms also usually include this workflow with the invite invite users and share permissions, combining it into one modal.
Refining initial requirements based on research
Working with the product manager, we decided to include share links as part of the scope as they essentially the same as sharing via QR code, but just in a different format. This was due to the research conducted and the fact that many other platforms use links for the first step of file sharing.
With research finalized and requirements refined....
How can we present Digs documents to customers (builders and contractors) in a way that is easy to access on the construction site, and reduces error and risk during the build process?
EARLY EXPLORATION
Requirements posed significant information architecture issues
Requirements and discussions from product brought up interesting workflow ideas to solving this problem. This included
DIRECTION 1: Yes Shared Files Folder
All shared or public files go into a dedicated 'shared' folder so it's easier for a user to see which files are public. There is also this separation for a layer of security.
All shared or public files go into a dedicated 'shared' folder so it's easier for a user to see which files are public. There is also this separation for a layer of security.
DIRECTION 2: No Shared Files Folder
No shared files folder. There would be another method of viewing all files that can be shared either through filtering of files or with icons.
No shared files folder. There would be another method of viewing all files that can be shared either through filtering of files or with icons.
Documenting flows to imagine the experience
IÂ mapped out a flow diagram, but quickly saw that this workflow was clunky and potentially very unintuitive for users to go through.
Convincing product team to go with a simpler direction and workflow
Rather than having all public files be in one dedicated area to have files be public before they hit the canvas, a workflow of publishing the file from within the canvas for each individual file is a much cleaner experience. That way, the user would have more control over what they want to share or not.
Rapid prototyping + ideation and 30+ variants later...
KEY DECISIONS BASED ON STAKEHOLDER FEEDBACK
1. Increasing discoverability of the share/publish feature
BEFORE: Publish File in Bottom Nav
- File action stays in the file action menu
- Less discoverability of publish feature as it is in the bottom screen navigation
- Publish option is also hidden in a kebab menu
AFTER: Replacing 'Invite' with 'Share' for both Invite and Publish
- Discoverability of share and publish option in the top navigation bar
- More common pattern that is recognizable with users mental model
2. Using progressive disclosure to reduce cognitive load
BEFORE
- Presence of file action buttons under the QR code helps with discoverability
- 6 different primary actions in the dialog, contributing to mental load
- Placement of file action buttons (download, print, copy) for the QR code is odd
- Toast message shouldn't be in the dialog itself, but rather outside on the screen
AFTER
- Limiting the number of primary actions that can be conducted at once, streamlining different flows
- Globe icon to represent a file is in a published state
- More common pattern of using ellipses for file actions to download, print, and copy the QRÂ code
- A toast outside the dialog instead of inside, which is much more common
AGILE PLANNING
Scoping the build for a successful MVP and future iterations
As the project was born out of a hackathon and designs completed for the competition was the ideal happy path, the team had to divide up certain aspects of this project to ensure validated designs and ample development time from engineers.
THE MVP: Publishing from the File Navigation Controls
Publish File in the bottom navigation controls
Group filters to see all your shared files
Preview your QRÂ code before sharing
Anonymous File View
VERSION 2: Publishing from the Top Navigation
Combining the publish tab with the existing invite members to project modal.
VERSION 3: Publishing with markups on your file
Share markups and annotations with team members to view exact references to a task.
CROSS PLATFORM EXPERIENCE
Tablet and mobile experiences were crucial as builders and contractors on home sites would likely access files via non-laptop/desktop devices
Tablet and Mobile Experience
Updating designs with new mobile friendly patterns
Improving mobile interactions have been a consistent design issue the team wanted to rectify. In the midst of the project, we have been updating our design system with new and improved navigation. For v2 of mobile designs, we opted to go with bottom sheet interactions for dialogs and menus to faciliate easier thumb reach.
