Sign Center — A design customization platform and e-commerce experience

How an empathetic engineering practice helps create impactful digital products

Dexter Callender III
Mar 17 · 7 min read

I’m excited to announce the release of a new digital product that re-conceptualizes the way that Compass agents create physical signs for their listings! Our team of designers, producers, and engineers at Compass built Sign Center, a design customization platform and e-commerce experience that empowers our agents to design and order custom-made real estate signs online.

We developed Sign Center as a response to sign design and manufacturing inefficiencies we observed across the real estate sign industry. Sign Center offers agents a consolidated experience to create and order signs while enjoying expedited turnaround time and discounted manufacturing rates. However the process by which we arrived at the final product was complex and resulted in a massive learning experience and growth opportunity for our team.

What does Sign Center do?

Sign Center allows agents to leverage their brand at Compass by enabling them to design and order custom signage online. At Compass, we consider each of our agents a business-owner, and encourage them to use the Compass brand system flexibly to advertise their business. Signage is one part of their brand identity as a Compass agent and Sign Center provides them with an online customizer called the Configurator to customize all of the types of signs they already order.

The Configurator

Once the agent has customized their sign, they are guided through a checkout experience that allows them to ship their signs to an address of their choice, or to the installers that they already work with who assemble and place the signs outside of properties on their behalf.

This experience streamlines the agents previous workflow in two ways. For one, they no longer need to engage in a lengthy design process with an individual designer to layout their sign. And second, they can forgo reaching out to a manufacturer to coordinate printing, shipping, and installing their signs, and instead complete their purchase and coordinate shipping and installation online.

What does Sign Center really do?

Sign Center’s UI and UX is intentionally simple for our agents to use, however under the hood (as it were), Sign Center handles a large amount of business and operational processes on behalf of the agent.

Real estate signs are particularly sensitive to regional design constraints. The balance between allowing agents to customize their designs while also adhering to the legal constraints in their region was a task we needed address with care. Our team audited and standardized these legal constraints, resulting in a visual design system consisting of typographic standards, text spacing, font proportions, and content validation, that we could apply across all of our regions. The Configurator houses this design system in the sign templates it presents to the agent.

Further, our agents sourced their signage from a number of different manufacturers across the nation, each of whom had their own communication preference, order requirements, and payment methods. We partnered with sign manufacturer Dee Sign to develop an order pipeline that would allow all signs designed in Sign Center to be printed and shipped with a three-day turn around time across the nation.

How does it work?

We leveraged Dee Sign’s large-scale sign manufacturer pipeline to standardize the printing and shipping process. To print a sign created in Sign Center, Dee Sign needs both the PDF artwork as well as the product configurations for each order, including the product type, size, material, and locations for holes, grommets, and eyelets.

To generate customized sign designs as PDFs, Sign Center uses an in-house micro-service developed at Compass called Export Service. This service ingests a Sign Center URL containing the sign to be printed,

e.g. https://www.compass.com/app/creative-studio/sign-center/detail/custom-rider

converts this webpage into a print-ready pdf, stores the PDF in an Amazon S3 bucket, and returns a URL that hosts the PDF to the requester. This service allows Compass to pass the customized sign designs to Dee Sign as simple URL strings.

With regards to the product configurations available to the agent, Sign Center displays only the combination of configurations that are legal based on the agent’s region. This involves maintaining mappings of the available materials, design templates, sizes, and colors for all of Compass’s regions. The relevant options are displayed in the UI by taking the intersection of these mappings per region.

The result is an experience that considers all of the legal constraints on behalf of the agent, allowing them to design and order freely.

How did we get it done?

Devising a stable e-commerce site that integrates with a physical manufacturer required firm software integration with our vendor Dee Sign. We set challenging operational goals such as a three-day turn around time and three different order submission options, which necessitated strong API agreements to ensure orders flowed smoothly from Compass’s system to Dee Sign’s.

From a product perspective, consistently communicating our product offerings with Dee Sign began as a simple mapping of product attributes (sign type, size, material, etc.) and eventually resulted in a comprehensive system of model numbers which uniquely encoded all relevant details about a product.

e.g. CS_A224_18x24_B : a complete listing panel and A-Frame mount of size 18" x 24" in black.

e.g. SP_880W18_W : a portable aluminum swing post mount of size 58" x 18" in white.

From an backend perspective, our engineering challenges ran the gamut of those expected when developing a full-stack web application. We developed a custom authentication solution to allow Dee Sign to make order updates and send shipment tracking emails via our service, maintained a rigorous order flow diagram and accounted for all operational edge cases, interfaced with a third-party payment processor, and agreed on a number of data-locking rules for our order systems.

Despite the technical rigor required to complete our task, a bulk portion of the integration work involved communicating with Dee Sign’s engineer over the phone.

How did we build this together?

Collaborating with empathy — As engineers, its common to overlook the importance of verbal collaboration when solving large problems, in favor independent problem-solving and sharing only complete work. Over a period of months, I spent hours per day on the phone with Dee Sign’s primary engineer discussing the order architecture and finding solutions to kinks in our integration, while at the same time implementing the hardened portions of the system to meet our deadlines. In the process I developed a deep working relationship with this engineer, founded on patience, mutual understanding, and a willingness to help each other achieve our immediate tasks when faced with company pressure to finish the product on impossibly tight timelines.

The importance of a strong working relationship proved itself time and time again, as our engineering teams periodically spent countless hours on each other’s behalf to ensure that we were all individually and mutually successful in our tasks. We learned new engineering practices from each other and ultimately grew as problem-solvers by virtue of our willingness to empathetically collaborate and place importance on the holistic well-being of our company’s relationship and our personal working relationship. Finding patience with collaborators in moments of mounting stress can be challenging but it enabled us to accomplish our work correctly the first time and build trust in each other’s capability to execute.

A Complete Digital Product

A massive collaborative effort enabled our team to create a complex digital product in a short amount of time. Sign Center acknowledges the expected cost, workflow, and turn-around time for creating real estate signs, and responds with a product that offers significant cost savings and efficiency improvements to the agent.

But beyond our named accomplishments, the process by which we arrived at our success remains invaluable to all of our team members. As an engineer working in a fast-paced, product-focused environment, finding comfort in my ability to solve multi-faceted problems in the midst of tight deadlines only reified my ability to execute on product ideas effectively. Just as important as the completion of the product was our willingness to be flexible and our practice of understanding, which created a space in which everyone on the team felt free to pursue the best product idea for our agents.

The demands and concerns of the agent are varied, beckoning pliability in the design of a solution-platform — one that bends to accommodate the agent’s specificities, yet stands firm in its function and execution.

Bringing Sign Center to the forefront of the agent’s field of view, as a focal point amidst a blurred mirage of workflow inefficiencies, leaves the past methods of obtaining signage out-of-sight— “trembling on the edge of visibility”…

Product Rendering & AnimationMavis Everett

Diagrams & IconographyMeeta Panesar

Compass True North

Compass Engineering & Product Blog — An inside glimpse at…

Thanks to Jessica Roberts, Slam Skillet, Cade Cairns, Joe Schmitt, and Raquel Bujans

Dexter Callender III

Written by

Software Engineer / Creative Technologist. Senior Creative Developer @ Compass

Compass True North

Compass Engineering & Product Blog — An inside glimpse at our technology and tools, brought to you by the engineers of the game-changing real estate platform, Compass. Hiring at https://www.compass.com/careers/

More From Medium

More from Compass True North

More from Compass True North

On Remote Interviewing

More from Compass True North

More from Compass True North

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade