True North: The 120-Day Compass Design Journey

mattspangler
Compass Quarterly
Published in
14 min readJun 11, 2015

--

“Man cannot discover new oceans unless he has
the courage to lose sight of the shore.” — André Gide

It was late October 2014, and I was meeting with the accomplished young COO of a tech startup named Urban Compass. Their impressive co-founders, Ori Allon and Robert Reffkin, had built a great team in many areas of the company and had raised three rounds of funding. They were on a mission for change in the real estate industry and searching for someone to lead their creative and marketing efforts. My background was uncommon for the industry but Ori believes, that bringing people from the outside provides a unique perspective into the daunting challenge of reinventing real estate. I started a month later.

One of the early goals was to build a top-notch in-house design team. It is no mystery that in the last few years design has become an increasingly popular differentiator, especially in the technology sector. It helps that the world’s most successful tech companies (Apple, Airbnb, Uber) have put it at the forefront of their culture. VC’s are snapping up designers, and everyone has spent the last couple years writing an article about “Why Design Matters”. Our focus around cross-functional product and communication design was critical to the future of the business. In order to provide design and marketing services that exceed agents expectations and build products focused on adding value to their day-to-day, it was important to align the design teams while still giving autonomy to each.

MoMA Design Studio website

Design is vital for our success, and we need to attract the best creative talent. From Google to MoMA to Randy Hunt’s team at Etsy, the models for a robust internal design studio exist. It was our challenge to deliver a special sauce of agent support, product design, and the creation of a global brand. We had the core of a design group and the agent, engineering and strategy talent in spades. Through a combination of smart acquisitions and networking, we were on our way, but we needed to go further with our brand and culture to become a place that inspires creative talent.

“Let’s change the name”

The desire to find a home is a universal human experience but at the top end of the market real estate is an industry of aspirations. As Giorgio Armani said, “I don’t collect art, I collect houses”. The same goes for the most successful agents. The reality is that ten percent of the agents in the industry account for around ninety percent of the total transaction volume*. We need to be a brand that inspires the industry’s best agents.

The original compass.com domain holding page

We felt the industry had yet to define a premium consumer brokerage brand that spoke to a modern high-end home buyer. I felt a simplified name could speak to our mission and be a memorable representation of our brand. I strongly recommended to the executive team we shorten the name and go after the URL, compass.com. It turned out Ori had had been talking to the owner but had not yet pulled the trigger. The opportunity seemed great.

Changing a company name after a year in business was a daunting challenge. One of the problems is that 99% of the time there is little chance to own the digital footprint of the new name. Surprisingly most of the major social media accounts were vacant or unused. We felt the big challenges, including SEO concerns around the wide-spread use of “compass,” were not outweighed by the opportunity to own the mindshare. We went into action.

Was it the right call?

  • It was simple, memorable, and iconic — incredibly important in a highly competitive real estate industry.
  • It was not a totally new name, it just eliminated a modifier, which had been done successfully by other companies (Ex. Apple Computers).
  • We were still largely unknown and hadn’t built up an insurmountable amount of brand equity for the original name.
  • It removed the reference to cities which would be a limitation as we expanded beyond urban areas.
  • We secured the digital footprint including compass.com, Instagram, and Facebook.
  • There was no company that clearly defined the name globally.
  • It had a clear connection to the guidance that great people combined with simple technology provide.

Walking the B2C / B2B Tightrope

With our digital home secured, we now needed a new visual identity that lived up to the name. It was December 2014, and we planned to open our first office outside of Manhattan in early February 2015. It made sense to launch in Washington DC with the new brand, but we didn’t have enough time to create the complete visual identity and learn lessons from the new market on what our brand really needed for growth. We made a tough choice to drop the “Urban” with the DC opening, build the internal design team, learn from expansion, and work on the identity system in parallel for an evolution early summer.

Creating a brand isn’t just a new logo. By definition, it’s the sum total of the company’s actions and how that affects people’s perception. This recent Percolate article is a good place to start for a better sense of the complexity. In our case, going through a rebrand affected every aspect of the company including our product, communications, marketing materials and even the office design, all custom built for who we are today while leaving room for where we want to go.

One of our biggest challenges as a company, and with this project, is that we have to consider both B2C as well as B2B. A unique brand architecture that’s not a branded house and not a franchise model. We need to have a strong consumer brand at the center, as well as a system ready for the B2B needs that come from developing entrepreneurial tools for our agents, who’s individual branding and marketing goals vary by market and preference. Agility, intelligence and simplicity were key to solving one of life’s most complex decisions — buying and selling a home.

Laying the Foundation

We did an audit of all design at the the company. Fonts, colors, icons, even button styles on the website, app, emails and even marketing collateral were all completely different.

An audit of the site showed fonts were all over the place.

To juggle near and long-term priorities, the talented team at Ro&Co kick-started the identity process while we were building the in-house design studio. Their logo exploration got us closer to a design direction and was the starting point of eliciting feedback — and excitement — from agents and company leaders.

By mid-January we had brought on more senior design talent and added production, editorial, and strategy experts from places like Pixar, Condé Nast, Warner Bros. Twitter, and Droga5. The internal design team polished the final logo, adding mathematical rigor to the angles, line weight, kerning, and circular relationships.

“I love things with balance and symmetry.” — Ori Allon

These words were spoken by our co-founder during one of our many feedback sessions and provided a True North throughout the process. With such an iconic name it would be rare that the logo-mark would ever be used on its own. By integrating the logo-mark inside the final logo-type, we achieved a combination of balance and symmetry while still having the option for a bold symbol. It needed to look elegant sitting centered in the middle of a white page or over a gorgeous interior photograph. A subtle confidence that represents the feeling Compass agents give their clients.

The final Compass logo takes the angles, line weights and circular relationships all into consideration.

An animation collaboration between Paul Vlachou and Vince Joy showed the new brand coming to life, resulting in an emphatic, “Let’s do this!” from the co-founders and president.

Brand inspiration resulting in the final new logo.

From there, the hard work began of creating the entire brand ecosystem. Over the next two months the team created a completely new framework that would solve our existing challenges and live up to our future ambitions. Everything was on the table, but we were confident that our world-class team could deliver impactful work within a tight timeline.

Playing against type

One of the biggest hurdles we faced was a very limiting font family. We had previously used Proxima Nova as the single font for the brand. With the huge number of use cases, we needed a system that could resonate across print, digital product design, agent marketing and beyond. Having worked at the company longer than most, Vince knew that the listing hierarchy was a great place to start. He used map references to inspire the line art framework that could house the key information for the listing. Whether inside the product or an advertisement, the information travels with it, adjusting to the size and space required.

This video shows the process and inspiration in creating the listing framework.

One of our key insights was that we needed a font family that complimented each other and communicated the various aspects of the brand. We chose Tiempos to communicate refined luxury, Harmonia for modern approachability and Pressura Mono for data and technology. They all worked together to form the listings framework.

Distilled and dynamic

Sitting alone the mark is abstract and conjures up many different references (compass, keyhole, i/o button, road sign) but sitting within the name, it is clearly the most distilled form of a compass — a circle and needle.

As we sought flexibility in our system we also wanted additional symbols, each one equally memorable and connected to the mythology of the compass — way-finding, cartography, data visualization and maps. These formed the basis for our pattern exploration throughout the color story process and icons we could use in different mediums.

These still felt like a recognizable subset and created the basis for pattern families.

#000000 + #ffffff

The word luxury is used to describe our brand mostly because the properties marketed by our top agents are very high end. Luxury means so many different things to so many people. We needed to define it in our own way — sophistication that was grounded in intelligence, agility, and simplicity. So we first looked at influences outside our industry memes — the images surrounding fashion, art, auto, architecture, film — for a uniquely sophisticated story.

We then did two full weeks of color research, looking inside the industry to see where the majority of the colors landed. Many lean on one color, but we didn’t want to be the “purple” or “green” brand. Plus, in an industry where great photography was the hero, we already had a rich palette for the vast majority of use cases. By giving ourselves the rigor of only working with black and white, the restriction pushed us to create a more complex, nuanced brand that would work great with photography and allow us to bring any color into the story later. Great brands like Apple and Nike are not known by one color, but their ability to use any.

“We decided as a team that every aspect of our branding should be
dynamic and responsive. Black and white as our backdrop allows us to play out any combination of color stories on the stage, while letting photography dominate when it’s the main character” — Jeff Lai

Connecting the dots

So instead of color, we decided to riff on the shapes (dots, needle) within the compass to add textures, character, and a subtle nod to way-finding, nautical motifs and our data-driven approach. We felt it was an ownable, dimensional part of our toolkit.

We applied it to collateral and put that in the hands of our agents. It was important to arm them with tools that were useful and beautiful since they are our best ambassadors helping to tell our brand story, everyday, on the streets.

Unlocking the code

In order for us to successfully release the new identity into the world, we had to, of course, update the look of our consumer product. The majority of our clients come to our website or iPhone app searching for a home and looking to communicate quickly and easily with our agents.

Our product and engineering team builds vital tools based on business needs and constant iteration, while our data team makes sure that we have the best possible listings availability. Together, this leads to the best possible consumer experience.

For such a complex stack of technology, the two-month timeframe was herculean task, and the team showed the power of commitment and collaboration by delivering on time. Neves Rodrigues and Paul Vlachou lead the site design, applying learnings from agents over the past year, and a core A-team of engineers (see below) rebuilt the site with a homepage that supports our future expansion and a listings view with many new features, including an improved open house feature — evidence that agent-driven innovation guides our product pipeline.

The consumer app was completely revamped as well, led by new Product Design Lead Yaron Schoen and built by our tenacious mobile engineering team. They built upon a great framework by Savannah Wolf and brought the new brand to life for all our iPhone customers, from subtly animated patterns to a cohesive listing framework.

“The timeline was tight, so we leaned on native conventions to simplify our process and make the app more intuitive for our users.” — Yaron Schoen

An icon set developed at scale with our logo was also used extensively for the app’s search filters, helping further our new style’s consistency. The push for an early summer release means everyone walking in the warm weather and dreaming of a new home can depend on the new Compass.

T.C.B.

The DC expansion and three-month design process gave us time to learn from our agents about the pieces they needed to be successful. Direct marketing, both print and digital, is a vital part of the agent arsenal for supporting their sellers and reaching the right buyer. In an industry where the big players lean on huge advertising campaigns while providing little value to the individual agents, and photographs of gorgeous homes are reduced to thumbnails to fit the most on a page, we wanted to invest in tools for our agents and a brand that was flexible and sophisticated.

We audited the most popular templates from the first six months of the year and created multiple design options for each. A modular system was developed that allows agents to choose from a wide variety of options that still adhere to the brand aesthetics. The launch includes hundreds of new templates, from postcards and show sheets to email templates and social assets.

To present the options we created a digital and print catalog so agents can create marketing materials with more speed and agility. According to our research, this offering is unlike anything in the industry and aligns with the company’s focus of building tools to allow agents to spend more time supporting their clients.

The catalog is a part of an on-boarding kit that includes key materials that new agents need on day one to support their business. In the hyper-competitive world of agent recruiting, this allows successful agents to hit the ground running when they transition their careers from other brokerages to Compass.

Example templates included in the marketing catalog. Multiple “lines” were created to have unique styles within the same brand architecture.

Having a great new brand is meaningless if no one sees it. From print and digital to video and social, our advertising campaign will take shape over the rest of the year. To serve our growing list of exclusive properties, Irina Anisimova developed a new editorial style for our listing ads that could accommodate a collection of properties while remaining refined and uncluttered.

We kick things off in July with spreads in some of the world’s best lifestyle publications. They were identified by agents as important to their target audiences but without being saturated by our competition.

Magazine and newspaper ad designs bring the brand to life throughout the campaign.

Branding in balance

All agents are entrepreneurs — a vital point for the design team to remember. The Compass culture makes them feel like co-workers, but they are independent contractors, so we wanted to find a way to support their personal branding. This construct is unique to our industry, so it demanded new thinking. Since agents are identified by their names, and legally there are requirements around team branding, we needed a system that would conform to these rules and be scalable as we expanded our agent base.

Our solution was a system of monograms — classic in concept, elegant in execution and unique to individual styles. Starting with the initials and a personal assessment to determine what traits each agent or team wanted, the agent brand marketing leads this process so that we assure that delicate balance between the two.

Example agent logos and the system of how it works with the Compass brand

Lastly, we created a system of social assets so our agent-ambassadors could spread the word to their extensive networks, whether through Instagram animations that introduce the new logo or videos showcasing DC neighborhoods.

Reflection

The reasons above break it down, but if I had to give a one-sentence answer to why we did it, I’d say, “after working with all the incredible people at Compass, it was clear we needed a brand design that embodied our company values: intelligence, simplicity, agility, and sophistication”.

It’s imperative we live up to that idea everywhere we can. Are we there yet? Not quite, but it’s been an incredible ride so far, and the journey is just beginning.

Thanks

There are so many people to thank who worked tirelessly the last four months to bring our brand to life, but I wanted to show special gratitude to the following:

Irina, Vince, Jeff, Paul, Maddie, Aaron, Buzz, Anna, Victor, Kyra, Kyle, Amy W., Amy P., Jessica, Mike F., Indira, Liz, Cathy, Euney, Shannon, Stephanie, Michael S, Neves, Savannah, Yaron, Alex, Glenn, Shilpi, Khadija, Liming, Alex, Ugo, Rob L., Mike B., Ishika, Wendy, Rory, Jordan, and Ciara.

A special shoutout to the rebrand engineering and mobile aces: Zach, Wylie, Marcus, Bobby, Ian, Luke, James, Jerry, and Jon.

Thanks to our pioneering agents who joined us in this initial growth period and have helped shape every product we’ve launched and marketing piece we’ve art-directed. Lastly, a big thanks to Ori, Robert, David, and Leonard who have supported the process from the start.

We’re still looking for talented designers, engineers and product superstars to join our team. If you are interested, we’d love to hear from you.

footnote *Inman, 5/4/15

--

--

mattspangler
Compass Quarterly

Chief Creative Officer, Compass. Former EVP Content & Marketing for Tribeca Film. Tall.