Redesigning the Moment Extranet

Giving projects a place to call home.

The average Moment client project passes off dozens of documentation files. These are visual design specs, slide decks, copy decks, research materials like video recordings and transcripts, dumps of process photos, working sketch files, prototypes, microsites, and links to external services like Framer, InVision, Zeplin and Google Drive. Handling the handoff can be a nightmare, especially for clients teams from large companies, who might have dozens of members on several continents.

The extranet is one password-protected link that keeps everyone on the same page. It’s the place where clients can always find the most recent version of what they need, surrounded by related documents and project context.

What the extranet looked like before we started.

In spring 2017, Rae Milne and I rebuilt the extranet from scratch.

Before we started, the extranet was a tool that Moment teams dreaded using. Designers had to write the pages in raw HTML, which made editing arduous. And the result looked spartan, aesthetically inconsistent with Moment’s friendly and collaborative culture.

The redesign became a business priority when we realized that the Extranet page is our longest-lived artifact: clients continued to access extranet pages months and even years after the projects were over, and it provided a tangible record of the project for years after the fact.

No sticky notes were harmed in the creation of this blog post

Process

Although we considered multiple approaches, including starting from scratch, we decided to iterate on the current system that people were already familiar with: eventually building a PHP script that would turn any markdown file on our FTP site into a password-protected website.

We worked week-to-week with a tight feedback and iteration loop. Although we had a goal in mind and had design principles to guide us, we felt that it was important to stay flexible if our users (who are all accomplished designers) had a better idea. We also continuously released our documentation, refining it based on the spots where people ran into trouble.

An example of our documentation, which was created using our own templates

It can be hard to do design work on an agile schedule. However, Rae and I found the short turnarounds and constant feedback liberating. We always knew that we were on the right track, and the growing enthusiasm of our coworkers kept us motivated.

Launch

At launch, we ran workshops so that everyone would learn how to use the extranet before they had to use it on a project for real. We ran a series of bring-your-laptop sessions where everyone from designers to managing directors learned how to use the new tool.

Some the websites people made in the workshop

Our work is live, and is currently being used by Moment teams.

Wanna learn more? Send me an email at tpoulos@momentdesign.com and ask about:

• Designing an app for designers. How do you make sure that your coworkers don’t hate the thing you built?
• Our meta-analysis of how teams share files right now
• How we helped teams structure their extranet pages so that they can grow organically no matter the project size