We designed and developed Collections at Sketch in early 2023 as a cross-team collaboration between web and macOS – it is a first approach at giving more freedom to store, organize and retrieve design knowledge inside Sketch.
In this case study we will have a look at how we designed a familiar concept that expands the hierarchy to enable people using Sketch to organize design documents.
In Sketch, the Workspace is a hub where people and design meet. They are a reflection of the organization and the company structure, while projects are the spaces where they store their documents.
However, as complexity grows, so does volume — up to the point where static, formal hierarchies are no longer an effective way to organize documents.
The complexity led us to question how people using Sketch can best manage their design knowledge. As a design platform, Sketch needs to offer more natural ways to store, organise and access design documents. But merely adding more folders and subfolders would decrease visibility and create even more complexity.
That's where Collections come into play: a high-visibility, open, non-hierarchical mechanism that helps organise documents inside a project as contextual groups that follow any sort of criteria, making it much easier to find design documents in a project.
In short, Collections help humans organize their information in a natural, human way.
A Collection is a new type of document container that belongs to a single project – increasing the opportunities to organize documents in complex scenarios.
We established three main characteristics that helped us move forward with the concept of Collections.
Collections organise documents that are already inside projects
While working on new features, we aim to give it a familiar feeling – like something that has been there all along and it is now available. Collections is a concept that fits right in with the hierarchy of the Workspace structure and visual language across web, mac and iOS.
Interaction for Collections add a familiar and natural experience – in additional to the regular flows, people can drag and drop two documents to create a new collection; or inside a Collection.
Our goal with Collections is to create an open and flexible system for everyone. While working on this feature, Esther, one of our colleagues defined projects as the folders designers store documents, and collections as the little plastic dividers to separate sections inside a project.
A few of the main use cases we kept in mind while designing Collections include:
Creating a new way of organizing documents for people using Sketch was a great exercise in building a concept that is open and offers flexibility to make it your own. This was a collaboration with multiple teams inside Sketch, where we could shape the concept together.
The initial work on Collections sets a nice track for us to keep working on and evolving together with everyone using Sketch. I am looking forward to that.
Thanks to everyone who worked on this project.
Thank you for reading this case study.
Everyone at Sketch for their support and hard work in this entire project – specially the team web.