Sketch

I led design at Sketch from 2019 to 2022—brand, process and product—heading the Design Systems, Prototyping and Collaboration teams. Along the way I delivered countless quality-of-life enhancements across the Mac app and the web, but the bulk of my time went to Prism, which redrew the entire web platform and shipped it in the summer of 2021.

Prism

Prism began as a question about what Sketch should become. It ended up changing the brand, the web platform and the team's daily processes—but it started small, as a campaign.

My colleague of the last eight years, Prekesh Chavda, and I were tasked with announcing a reshaping of the platform. We began with storyboards for a film, trying on visual treatments that severed every tie to the existing Sketch brand—a way of asking what we could be before saying it out loud.

The script came from our wordsmith, Freddie Harrison. We steered away from the literal, and gave the film to motion and the narrator's words.

Finalised by Emma Kingsnorth's animation, the film went out alongside an announcement designed by Emily Cressey, launching the campaign that welcomed our collaboration feature to the Mac app.

Proud of what it showed, Prekesh and I grew Prism into two branches: he took content design, supporting brand and marketing, and I took the product—what this new ethos could do to our web platform.

Moodboarding put "the vibe" in context before any interface work began. It settled the typeface choices, the colour pairings and an illustration style with room to evolve.

I then drew the language into the web platform itself, demonstrating the core views—workspace, document, artboard and home.

This wasn't just an exercise in style. The goal of Sketch's service is to involve everyone in design—which means more features, more space used, and a balancing act of many needs and wants.

With this remit I reconsidered every view: layout, information hierarchy, navigation and flow all had room to improve. The fundamentals were rebuilt from scratch too—colours, text sizes, buttons, selectors, toggles.

All of it was done with readability and accessibility in mind, every text colour combination checked against WCAG 3.0 standards.

With the project validated, the scope grew again: redesign the entire web platform for the summer of 2021. Every area demanded reconsideration, in close communication with front-end developers Marcio Barrios and Inês Carvalho, so the design system we formalised was one every party could interpret and rely on.

For me that meant assessing each part of the experience, improving it to match our product goal, and recording each permutation into Sketch's first fully-fledged design system—a goalpost for the summer first, then a source of truth to keep.

It also afforded an audit of our product language: our UX writer Jürgen Zimmerman provided a suite of copy rules to keep terminology, sentence structure and the guidance given to users as systematic as the visuals.

The end result shaped the organisation in more ways than one.

Customers received a new experience for the web, with the level of polish we know and love in the Mac application. Accessible, responsive, systemised. A dependable and predictable level of service.

The team inherited new processes: an iron-clad source of truth for visuals and experiences, and a workflow to maintain and evolve it, with named owners responsible for its upkeep and for the quality of what gets sent to it.

Lastly, this bled into the redesign of Sketch.com itself, and spawned a sister-system called Carat—the source of truth for all content-marketing design language. To this day, Keir Ansell diligently curates both.

This ecosystem brings the ever-growing Sketch design team together, and invites contributions from the wider team to keep furthering the product.

Canvas

On the back of the web overhaul I led in Prism, we reinvented how stakeholders other than designers experience Sketch: out of image-based grids, onto a vector canvas with parity to the document on the Mac—and an entirely redesigned navigation and sidebar toolset around it.

Big Sur

During Apple's big shift toward the iOS-ification of the Mac, we transitioned our design language in time for release week—native apps always look best when they fit in. I designed parts of the UI around the new paradigm, and gave direction for the new icon set that Prekesh Chavda put together—with some old OS X Leopard inspiration saved for our Experimental testing build.

Components

One of my first major improvements to ship in the Mac app was an Insert Window for browsing and inserting from Libraries—larger previews, smarter search, and a home on a secondary display for power users.

Component Mode mirrored it: a way to manage and browse the components of the document you're building, handy for design-system managers organising hierarchy and editing in bulk. Emily Cressey and I then brought it to other stakeholders through the web app, folding components into their development process.

We also added Colour Variables as a component type—rethinking every Colour Well in the Inspector and the experience of the colour popover behind it—plus a searchable menu to quickly fetch or replace any component without leaving the Inspector.

Community

I supported the Sketch community with talks about our craft and design systems, insights for articles, and help constructing templates. Below is a finished example that walks the user through blending, tinting, nesting, overrides, smart layout and constraints.