Building Horizon

The first time I met the Horizon team in person was about a month into my tenure at ServiceNow. I was hired as the content strategist for the new website and was lucky enough to attend project planning at our HQ in San Diego. The team was cross-functional, with everyone from engineering, product management, design, and leadership making the time to sit around a table together and hash out the details.

The thing that struck me most was the candor and passion of everyone there. No opinion was left unspoken. Every fear, risk, frustration, and opportunity was shared (and sometimes shared with vigor). To me as a relative outsider, sometimes things felt a little too spicy. But what I quickly learned was the psych safety of this team was high; nobody took any of it personally. At the end of planning, the open communication enabled us to make decisions more quickly and take more risks. It’s a way of working I’ve learned to treasure, and my role on this team has quickly grown to become one of the best and most fulfilling moments of my career.

When our product manager, Brian Zaik, suggested we do a blog about building Horizon, I jumped at the chance to help tell the story. I wanted to make sure to include the perspectives of as many folks as possible, because Horizon truly is a team effort. It seemed only fitting we all gather around a table again (albeit virtually this time) and hash out the details of how we built Horizon.

The beginning

Stacy Silvernail (Content Strategist, Design Enablement): Hi all! Thanks for joining the round table. I wanted to start at the beginning. Before Horizon, what did design enablement and the design system look like at ServiceNow? What tools and processes or systems did we try that didn't stick?

Dave Shepard (Sr. Manager, Engineering): That's really looking back. When my team first joined, we had Emotive. It was a component library with design system guidance all in one spot. It was great, but only internal. We rebuilt it on the Developer Portal (ServiceNow Developers) so we could get it out to customers. The challenge was, the design system team didn't have the space to evolve a lot of the design guidance, and it was living on the developer site, so it was in the wrong place for the designer audience.

Henrik Hiort (Product Designer, Design Enablement): The design guidance was there, but there was also no easy way to manage that content.

Dave S.: So, all that info stayed locked up in tribal knowledge, Sharepoint sites, Teams. Just a very fragmented landscape.

David Russo (Product Designer): We also had this wacky little Figma file that had, like, a fly-out menu and color variables and a lot of other design guidance. Kind of filling the gaps because Developer Portal wasn't fully solving for design.

Stacy: What was the catalyst for the investment in Horizon? There was a clear need internally, but was it something our customers were also asking for?

AJ Siegel(Director, Design Enablement): Customers struggled to design great UIs with ServiceNow, both kind of philosophically from a process perspective, but even functionally. What’s available to me? What are the building blocks I can use to craft an experience? What are the parameters I can change versus building something custom? We could feel the interest from our external community. And just a general momentum and growing focus on user experience from our customers and partners.

Stacy: When you set out to build Horizon, was there anything you were trying to do differently from other design systems?

Andy McDonald (Sr. Director, Product Design): We've known for a long time, working with customers and partners, that not all teams are composed in the same way when they're integrating ServiceNow solutions. We had to take a step back and understand there's a lot of people doing the job of defining a good experience at ServiceNow. It may be a designer, it may be a front-end engineer, it may be a solutions architect. At the end of the day, someone needs to decide what a good experience looks like. We catered our content to give context and the appropriate resources to make sure that people doing the job of design, whether it's a designer or a different role, had what they needed to be successful.

AJ: We looked at Horizon not just as a design system site. We wanted it to be a guide for creating great experiences with the ServiceNow platform. It's very specific. What are all the things that you as a creator, not just a designer, need to consider when trying to deliver a great experience with ServiceNow. So, we break down our app frameworks, we introduce you to the structure of the information architecture of ServiceNow, we talk about UX methods. We wanted to go bigger than just design system documentation.

Laying the foundation

Stacy S.: Tell me about starting the work of the site. Where did you begin?

David R: We started with a competitive analysis. The basics. Logos, the type of working model, a bit about the company, system overview, development, different resources, and feature benefits. And information architecture.

Henrik H.: Yep. And from that, we did an inventory of the most common content types and figured out what content we already had in our existing resources, what would be nice to have for the MVP of the site, and what we needed in our backlog for the future. That was the inspiration for the initial page layouts. And then we made an inventory of all the different content blocks that we saw we would need across the site.

Stacy: Oh, cool. Okay, so you componentized the website?

Henrik H.: Yeah. That gave Dave's team an idea of the different content blocks we’d have to build. And I think most of those ended up being what you see in the CMS today.

AJ: There's a lot to be said for the smart decisions that our development team made. I want to celebrate how those decisions have allowed us to do as much as we have been able to.

Dave S.: I'll toot our horn a little bit! I think my team made the right decisions on a lot of the architecture. It's allowed us to move quickly and adapt to the changing nature of how Horizon is surfacing itself (in the AI landscape). One thing we knew we needed was content portability. We knew from day zero, we can't couple content to page layout. Those must be separate things. And so we wanted to have a headless system that is just about writing the content and surfacing that in an agnostic shape, JSON, in our case, that we can then read and put on a website for people to read, or make into a Markdown file that can be surfaced to an AI, or surface directly as JSON and put directly into the product. Wherever it needs to go.

Building the brand

Stacy: Let’s talk about the Horizon brand. It’s already made a big impact. I’d love to learn more about the thinking behind it.

Jeremy Van Cleef (Sr. Design Manager): This was my very first project at ServiceNow. I was trying to orient myself because it was also my first time working within design systems. I have a branding background, so I was familiar with that, but this is a unique ask. Because it sits on a parent brand, and it has its own kind of personality, but it needs to reinforce ServiceNow. I remember the kickoff with Andy and team, and it was really clear that, at a high level, the appetite was to do something different. That was made abundantly clear. People wanted to make some waves and push things, and to me, that was exciting.

Andy: We really wanted to make a splash. The safe thing would be a ServiceNow design system site that looks exactly like our current UI. Our goal was to build a name, to inspire designers, and to get noticed in the design community. To say, “hey, we're here, we've got a fantastic design system, and we're committed to showing you what great experiences look like in ServiceNow.”

Jeremy: Yeah, this seemed like an opportunity to introduce some new things, and to get people excited, because it was clear we wanted a rallying cry, if you will. Something that we could be really proud of from a design perspective. So that shaped the tone of the whole exploration for me, which was… as a creative, what else do you want to hear? It's perfect.

Stacy: Was the name set when you came on board?

Jeremy: Nothing was set. We started by talking to the team, and then doing high-level write-ups, creating different categories of concepts and design directions. One was just called ONE, we had Adaptive, Haptic, and Fluidity. Overall, high-level concepts. Pretty classic concepting phase. Just seeing from a narrative standpoint, how can these things come together before we start designing.

Stacy: How long did it take to get to Horizon?

Jeremy: Oh, there were like, five or six rounds just in the concepting phase, sharing, getting feedback, iterating, and seeing what people respond to. For example, people were loving the luscious colors, right? These colors that we don't normally play with as a brand, we're really reluctant to get into this application, and so when I presented that, and I saw all the, you know, people's eyes light up - Got it, okay, we're gonna push the color spectrum a lot more. Then we also wanted to find something that felt unique to us. Part of our brand, a huge piece of our DNA is the ocean, right? We have Coral (the visual theme), we were founded in San Diego. It's just been a visual metaphor that I've seen throughout ServiceNow history, so that was something we wanted to experiment with, taking nods from nature.

Stacy: How did you land on the logo?

Jeremy: We brought our final direction to some partners on the marketing side to help us land the name. And then we opened it up to the whole team. Let's make this as collaborative as possible. So, maybe 15 people were involved, and anyone who wanted to was able to throw in some marks. Then we would have these big open working sessions where people would present their ideas, and as a team, we would talk it through. It wasn't just 3 or 4 people sitting in a room making decisions for everyone else. We really opened it up and invited everyone into the conversation, which was great. And we took those ideas and refined and refined and refined. And then started incorporating the brand into the site designs. And this was fun because this was done really tightly with Henrik who had done the original site wireframes and IA.

Stacy: Did you feel like you had to compromise on anything during the process?

Jeremy: You tell a design team to push it, they might do some things that aren’t as practical in application, right? So we got pushback for some things. But pushback is good because it makes you sharper with what you do want. It's a learning curve. The design system is about creating really great user experiences. Maybe something we suggested was cool, but wasn’t technically a great user experience. That would be a good moment for us to hit that edge. It's cool, but it's more on the expressive realm than it is usable, right? And so we had to have that compromise of, like, at the end of the day, usability needs to be in the DNA of all of it.

Stacy: Do you feel like the design of Horizon and the branding of the Horizon website has had an impact on the product and ServiceNow parent brand?

Andy M: Absolutely. Our talented VX team and our partners in marketing and brand, we inspire each other. They were inspired by the Horizon aesthetic, pushing forward, such that they started integrating elements of Horizon. And we’re becoming more integrated into the ServiceNow.com properties. There's always been a really great balance of inspiration, which was exactly the goal of Horizon - to inspire and show what great looks like.

From project to product to program

Stacy: One of the things we’ve talked about as a team is how important it has been to the success of Horizon that it’s not just a website or a resource – it's becoming a program. Can you speak to that evolution?

Brian Zaik (Principal Product Manager, Design Systems): Horizon is really one of the first times we've had strong alignment between design and product on design system enablement. We also got funding from product management leadership to turn this into a real program. We had a design system of components, but I think this was really the first time for product and design to be aligned and push for a single source of design truth. To invest in the guidelines and resources teams need to use the components effectively.

Andy: I think with any growth company, as you innovate and grow as fast as we have, it's important to take the time to productize enablement when it comes to how we build experiences. And that’s something we just hadn't focused on as much as our customer pain points. So, when we got buy-in from all of our stakeholders, and we understood the benefit and the value, it became very clear that this was a tremendous opportunity for us to really align and share with our customers all of our best practices.

Henrik: The program is how we manage content creation for the site. It gets everybody involved and gives the teams ownership. It isn’t just the design system team writing all of the content - we're getting the people from across the org that know these parts of the system best, and helping them contribute their expertise.

Andy: Related that, something that concerned me as we were embarking on this was… will teams feel like it's worth their time to pause their product work to help contribute their expertise to enablement for the greater good of our teams and for our customers and partners? And that's been really heartening. When you create something that makes their work show up beautifully and it's taken seriously, and is integrated into our enablement ecosystem, it relinquishes them of all doubt that it's worth them pausing and taking the time. And then they also get to be proud of their expertise, because they know that it's being found, they know that it's showing up well, and that it's helping people.

Stacy: Laine, you came on board later last year to be the Design Program Manager for Design Enablement. I think your role is so important to Horizon’s ongoing success and I’d love to hear your perspective.

Laine Prokay (Designer Program Manager, Design Enablement): I would say, what I love about being a program manager is owning the logistics, like how are we building, what are we building, when are we building it. I take those details and make sure the right message is getting to the right people at the right time. This frees up our subject matter experts to really thrive in their expertise. That’s why I love working with you, Stacy, as our content strategist. We get your thoughts on paper and partner to put a real system in place around the content strategy, getting the content delivered and published in the right place at the right time.

Brian: And we’re able to operate in a very agile fashion, right? So, we respond pretty quickly to any new challenge or question. Anytime we get feedback that something is missing or inaccurate, we respond very fast to those things, but in a way that, you know, builds on our collective knowledge.

AJ: Being able to build Horizon as a program, not just a project, means that we've been able to continuously evolve it, adapt to the needs of our business or our users, and therefore it has become, and will continue to become, this trusted source of information because it's up-to-date and current and invested in. So, what we've done over the last two years to get that support from across the product org has been pretty amazing.

The challenges

Stacy: Nothing is perfect! What are the biggest challenges you’ve faced working on Horizon?

Henrik: I think maybe behavior change. At least internally, people are very used to asking individuals or asking in channels rather than feeling like they have somewhere reliable to go for that information. Getting people to start learning that you can go to Horizon first and try to find that information. And if it’s not there, letting us know it’s missing or inaccurate so we can improve the site.

AJ: Building on that, content quality is a challenge I don't think I appreciated 2 years ago. The varying depths of focus on content that had been around for a while. So, uncovering content that hadn't been updated in a long time, or content that had been written for a different audience, and having to rally all the content owners to sort through that, I think continues to be a challenge today.

Henrik: Another thing that is constantly difficult, and we touched on this a bit before, is the fact that a lot of the people that use this aren't designers. So how do we communicate the content to make it work for both designers and non-designers. To communicate the importance of design, user testing, things like that. And, you know, why you should use Figma to mock up your design rather than going straight into UIB (UI Builder).

David R.: I'll just second Henrik's point, I think, because that is a really good one, and we saw it firsthand at Knowledge. So many people were like, “well, I don't have a designer, I don't know what I'm doing.” It’s, you know, Sarah, the HR girl that's lost in the sauce, that's just...she does HR, but her side job is somehow this build for Bob's Plumbing to do ticket dashboards. We want her to be able to be successful with ServiceNow, too.

The wins

Stacy: Ok, this is going to be my favorite part. Tell me what you're most proud of.

Laine: What I especially love about Horizon, and it's a little more on the internal side, but it's one source. It's not just our design system. It also highlights process. It also highlights tools. It also highlights resources. It's more than just use these things in this way. This is how we build. This is what we use to build. And I love being able to say, “It's on Horizon," for the majority of the things people have questions about. Oh, it's on Horizon. Like, that's amazing! So, I'm especially proud of that.

Brian: It's always wonderful to hear how people are using Horizon to create something brand new or improve an existing experience. It usually starts with the comment, "Wow, I wish I had Horizon for my last project!" Then they start using Horizon and tell us how it saved them time, helped them find the best way to solve a problem for their users, and up-level their design skills and knowledge. Comments like those really make me proud of what we've been able to accomplish here. It's proof that while there is still plenty we can do to improve, Horizon is providing real value to ServiceNow customers and product teams.

Henrik: I’m proud of how the program has been formed, how people are contributing content. The internal aspect of it is super cool, that we can get people from UX research and visual design and accessibility who want to add their content. And also, we have this team, just in general, who cares so much about this site. You know, we get into deep debates all the time about decisions, but it's because everybody cares so much about making the right choice. It really reflects through the product.

David R.: One thing I'm most proud of is that it's becoming a one-stop shop. Even just to help designers onboard. You know, I'm a big empathy guy. I always say, put those shoes on, put that hat on. You're new, you just joined this huge, complex corporation, right? And you hear all these acronyms. And all this stuff is being thrown at you, and sometimes you don't feel great asking what you think might be a dumb question. You know the stuff that makes up the backbone of a brand are those fundamental design standards, so I'm proud that we have one place for those new hires to go and learn about, oh, buttons have 4 pixels on the side, or 8 up top, and forms have 12 in between. They have a safe place to go to find answers to the “dumb” questions.

Andy: I am most proud of the team. When we started, it was a passion project. There was certainly a need, but it wasn't a formalized, dedicated team. We pulled people together that you know, really loved this problem and really wanted to tackle it right. I'm just really, really proud of these people that wake up and do enablement. They're people who want to help others, and that is their focus, and that is their product. So I'm really proud of that.

Stacy: That's lovely.

The future

Stacy: Ok, last question. How has Horizon evolved beyond what you originally imagined?

AJ: Oh man, I mean…the clearest thing right now is that we have a new reader, or consumer of Horizon content, that I don't think we were talking about in April of 2023, or whenever we first started these conversations, and that's AI. This idea that we might have to change how we write, or we might have to have AI-specific content, was not something we were talking about. We knew we wanted AI to be able to use Horizon someday, and Dave always told us, get the data right first, get the data right first, but I don't think we really understood it until probably the last…month? Two months?

Dave S.: I feel like that's going to be a real impetus to say, great, let's get a lot more investment into the Horizon content and documenting this stuff. The core value statement for investing in this space, is that, in order for us to get our design thinking out into the world, we need to write it down. And it needs to be in a shape that an AI can process. There's no way an AI is going to be able to create those interfaces on the fly unless it knows how to make those things. And I'm not talking about the “technical how.” That's actually more easily solved, in fact, solved today already. It's not just how do I make a button with cards and lists, but how do I make the right cards and buttons and lists, and the right UIs for the right scenario? And all of that must be taught...And it has a tangential benefit of educating people, too. It lifts all boats if we invest in this space.