The Powerhouse Agency Driving Design Innovation

How Work & Co. uses Framer to drive a 90% repeat business rate.

asha

Ashanya Indralingam

April 13, 2017

work and co header

Designer, Calvin Teoh, looks the part. Over our first meeting, he sports a minimalist white tee, hair slicked back, black tortoise shell glasses framing a quietly bemused face. He is soft-spoken, but sure of his words. In as many surface ways, Calvin fits the bill of the quintessential Big Apple creative. In practice, he and his colleagues at Work & Co. operate as the antithesis of the traditional digital agency, eschewing prolonged discovery phases and high-profile brand campaigns in favor of a much more unorthodox workflow, one that is increasingly being powered by Framer.

‘Prototypes, not presentations’ is the Work & Co. way, and it’s responsible for a staggering 70% year-over-year revenue growth. Their remarkable success hasn’t gone unnoticed. Fast Company recently lauded this Brooklyn-based agency as one of the 10 Most Innovative Design Companies of 2017, singling it out for “building next-gen products that shape companies’ strategies.” And that’s not just fluffy award-speak. Work & Co. tracks an average 90% repeat business rate with the likes of Apple, Facebook, Google and Nike, companies that don’t typically look externally for core product development. So what’s their secret sauce?

We sat down with Calvin, who’s spent the last 2 years honing his craft at Work & Co., to find out how Framer is helping this design and development agency pioneer what Forrester Research is calling “a model to follow”.

calvin

The nuts and bolts of design.

Calvin is Australian by birth, and he draws some of his aesthetic and influences from the Oz, waxing poetic about growing up in Melbourne, a city steeped in the arts and culture, backdropped by sheer coastal cliffs and the kind of temperamental weather that lends itself to an overactive imagination. As a kid, he was fascinated by the nitty-gritty of animated films, able to pinpoint exact features or moments that made a character believable.

This devotion to detail led Calvin to master both Flash and After Effects, eventually landing at leading Australian ad agency, Clemenger BBDO. Following an intercontinental move to New York and a stint at Domani Studios, Calvin made the jump to Work & Co., attracted in part by the company’s dedication to prototyping as a core discipline of design. “Suddenly I was surrounded by people who thought, like I did, that making and using something, even if scrappy, was infinitely more valuable than showing a client that pixel-perfect design or animated video.”

calvin2
At Work & Co., Calvin uses Framer for both early stage concepting and high-fidelity user testing.

A different kind of design agency.

Work & Co. is strictly focused on design and development, excelling at taking projects from kickoff to launch in-house. The 200-person agency, with secondary offices in Portland and Rio de Janeiro, is top-heavy by design, yet interestingly, has no CEO. Instead, a group of senior partners make democratic decisions about what projects to take on and then spread themselves across teams, providing hands-on support to see a project through to completion. Calvin shares that clients are also expected to be team members from Day One.

“We never go away for a month and come back with a bunch of ideas that a client has to choose from. We rapidly prototype, test and iterate with full transparency for clients during the process."

His passion is palpable, but it’s easy to see why he’s so driven. In Calvin’s tenure at the agency, he’s worked on groundbreaking mobile technology for the likes of Youtube, Jigsaw (an Alphabet company) and Target. Most recently, he was part of a team that was tasked with reimagining Marriott’s digital experiences for consumers. More than a simple booking app, Work & Co. was determined to create the perfect travel companion, an experience that would go beyond simple check-in and extend its utility through the length of the guests’ stay. To kickoff, the team followed Work & Co.’s modus operandi — each designer worked independently to arrive at their own ideas and concepts, pulling from their own unique strengths and experiences.

“We have designers that come from all manner of backgrounds including journalism, law, advertising and motion design, so it’s amazing to see what they bring to the table,” says Calvin, himself a Multimedia design major with a keen eye for photography, who sees code as both limitless and a way to inject order into the chaos of design.

calvin pitching
Calvin pitching a concept during an internal design review.

The best tool for the job.

“Prototypes already are and continue to become an even bigger and more important part of our process. It sounds insanely fast, but for all our projects it’s common to see working prototypes within the first week of designing,” Calvin shares, adding that while a process that calls for daily ideation can be intense and challenging, it also produces the best work.

The team also uses the Framer Cloud feature to easily collaborate and get immediate feedback between daily meetings, looping in clients as needed. “Because it’s just HTML, anyone with a browser can view it, there’s no requirements for installation from the viewer’s side and it gets something in their hands the fastest way I know possible,” says Calvin.

“What I like about Framer in the design process is that it scales well, without me having to rebuild everything from scratch.”

Work & Co. operates under the assumption that hiring smart people from all backgrounds (43% are born outside of the U.S, a fact that the agency protects fiercely) and giving them limitless tools like Framer produces not just the expected result, but the best one. At the end of the Mariott concepting phase, Calvin says the team realized they needed a design that would accommodate for quick switching between states, to allow a busy businesswoman to easily navigate between parallel tasks, from check-in and mobile key entry to ordering room service and browsing hotel offers. The result was a beautiful take on ‘Flash Cards’ and a reimagining of the standard issue burger menu.

marriot protoype
A prototype of the Marriot app.

“The top of each card gave great oversight of each section of the app and it was as simple as a single tap to navigate to the next section. The tap motion is enacted using a new navigational paradigm that Marriott is now calling the “one button”. It replaces the hamburger menu and lets guests easily toggle between screens, even if they’re juggling a suitcase in one hand and coffee in the other. No traditional navigation items, tabs or menu, just one big button, conveniently placed right under your thumb,” says Calvin.

button concept
The one button concept pitched by Work & Co.

Code as the future of design.

He is a fervent Framer user and mentions that the tool was involved in every phase of this project, from idea discovery to validation. Work & Co. even used an early Framer prototype for user testing of the “one button” concept across 6 countries, where it performed exceptionally well. With every iteration, Framer allowed Calvin to single-out areas of code he wanted to repeat. That, along with the ability to add dynamic data, test variants by fiddling with code and quick feedback loops, makes Framer the kind of robust tool that Calvin sees as the future of design.

“Of course there’s a learning curve — and it’s always daunting to start trying to learn a new tool. It’s best to think of Framer the same way you think about your preferred graphics tool; it’s just an essential part of your toolkit. Lean on the community to learn, it’s been my my biggest source of help and inspiration. But don’t shy away from learning it— I really believe understanding code is fundamental to how all digital designers should approach problems.”

evolution of design system
The evolution of a design system for the one button concept.

“A good interaction makes or breaks itself in the milliseconds. The only way to see if it has legs is to get it under a real person’s thumb.”

Getting the client on the same page during the early stages has proven to be a particular pain point for most agencies, especially if creative vision and pure functionality are at odds with what executives have in mind. But the Work & Co. model, powered by a limitless prototyping tool like Framer, appears to be solving for this very issue. The agency currently averages 20 days from project kickoff to putting a working prototype in user’s hands for testing, an almost unheard of turnaround time within the industry

marriot ipad app
From hotel booking to keyless entry, the entire Mariott app experience can be accessed by one-button.

Their commitment to excellence is paying off — Work & Co believes that their work touched more than a billion people in 2016 alone. To learn more about how Framer can improve your product team’s workflow, check out all the features included in our integrated design, prototyping and collaboration tool. Or talk to us to find out more about the additional features included in our Team plans.

Like this article? Spread the word.

Want more design articles?

Sign up for our newsletter and get resources, curated content, and design inspiration delivered straight to your inbox.

The Official Loupe 2018 Recap

Read more ›

Featured Framer X Packages: October

Read more ›

Interactive Components From Top Design Teams

Read more ›

Try Framer X.

The world’s most advanced tool for interactive design has arrived. Get started with Framer X today.

Try it for free ›

Start your free 14‑day trial.

Enter your email and we‘ll send you a download link for later.

We recently introduced Frames and Shapes, so some information in these videos may be outdated. To learn more visit our Help Center.