User Experience SIG articles

Design Faster, Smarter: Prototyping with Horizon, Figma, and AI - K26 recap

StacyS — Tue, 19 May 2026 14:03:23 GMT

You don't have to be a designer to prototype smarter on ServiceNow. At K26, we ran a hands-on lab that taught admins and builders a four-step workflow for prototyping Workspace experiences using Horizon, Figma, and AI. Here's what we covered plus a companion guide so you can try the whole thing yourself.

K25 Session: Move Faster, Design Smarter AI Experiences

matthewpopp — Wed, 21 May 2025 23:50:45 GMT

In an era characterized by rapid technological advancements, the ability to design smarter AI experiences has become a cornerstone of innovation and progress. Leveraging methods like rapid prototyping and iterative testing allows teams to explore unknowns, understand user needs, and refine solutions with precision. These strategies are pivotal in crafting AI experiences that not only meet but exceed user expectations, driving satisfaction and business success alike. By adhering to foundational AI principles and focusing on creativity within constraints, product teams can unlock the transformative potential of artificial intelligence.

We created a Figma file, walking through the rapid prototyping and iterative testing framework with a realistic use case. Download a copy of the file through this link.

The Rapid Prototyping and Iteration Testing Process

The process of rapid prototyping and iteration testing involves 5 key steps:

Persona (User): Identify the user who you are targeting. What are their goals and motivations?

Use Case (Scenario): Outline the scenario in which the AI solution will be applied

Problem: Understand and define the problem that needs to be solved

Solution: Considering AI principles, develop the AI solution to address the problem

Test: Test the AI solution to gain feedback

Repeat: Iterate on the solution based on the feedback received and repeat this process

Creating a Problem Statement

Before creating a solution, it's crucial to understand the problem that needs to be solved. Grounding your solution in a real, well-defined problem increases the likelihood that the solution will provide value.

One effective way to stay focused is by crafting a problem statement. This helps ensure your efforts remain aligned with the actual need throughout the solution development process.

A strong problem statement includes four key elements:

Who is experiencing the problem?

What is the problem?

Why is it happening?

Why does it matter?

You can use the template provided above to create your own. Here's an example:

"Incident Managers are having trouble processing and synthesizing information because of the amount of documentation created during complex incidents. This causes lost productivity and increased error rates"

AI Skills and Features

These are several AI skills and features that are relevant to our specific activity. It includes examples such as

Summarization Card: Condenses large amounts of data into easy-to-understand natural language

Now Assist Context Menu: An AI-powered tool for initiating AI actions on specific objects

Generation: Automatically creates objects based on specified models and rules

Recommended Actions: Connects different AI skills to cards enabling automated flows

These are merely a small sample of the AI skills and features available, showcasing the potential and versatility of AI in enhancing our workflows and user experiences.

AI Principles

To identify the best AI solution, you can consider these 4 principles before even testing your ideas:

Accuracy & Relevance: The AI output matches user needs and expectations

Would this solution provide output that would be relevant?

What would be the impact of inaccuracies?

Transparency & Explainability: Users can easily understand what the AI is doing and why

How do you make it clear AI is involved?

Is it clear what data the AI used?

Control & Correctability: Users can easily guide, influence, or correct the AI

Is there a way to correct AI actions?

Is there a way to provide feedback on the output?

Trust & Safety: The AI builds confidence and feels safe to use

Is this a place where AI can be trusted to solve the problem?

Testing Your Solution:

Sometimes, the solution seems obvious, until people surprise us by behaving in unexpected ways. This is why testing your solutions is essential. It ensures the solutions we design truly address the problems they’re meant to solve.

The good news? Testing doesn’t have to be complex or time-consuming. When you're rapidly iterating, a lightweight approach can be both effective and efficient. (Note: This applies specifically to this method—other research approaches may require more rigor.)

Here are 4 simple tips to keep your testing process streamlined:

Location: Testing can happen anywhere – online, in a hallway, or wherever users are available

Testers: You don’t need a crowd. Just 2–3 people can help uncover critical issues.

Goal: Give testers a clear task. Then, observe where they struggle or succeed. Ask questions to understand why.

Take Notes: Whether you're solo or with a team, jot down quick observations. These notes will guide your next steps.

Leverage the AI Principles to identify the right questions to ask. In addition to the principles, ask questions to assess ease of use and comprehension, which are core to the user experience, whether it is an AI experience or not. This approach not only saves time but also enhances the overall quality and user experience of your AI solution.

*Note: In the Figma file you will find a more detailed list of example questions and a rubric to score your solutions.

Conclusion

The journey of developing impactful AI experiences is guided by principles of accuracy, transparency, control, and trust. By conducting rigorous testing and adhering to these fundamental principles, teams can ensure that their solutions are well-received by users while reducing risks and inefficiencies during the product development process. Integrating AI capabilities into products extends beyond technological advancements; it involves empowering users and optimizing workflows. By embracing these best practices, organizations can create intelligent systems that yield significant benefits to users and foster sustainable success in an ever-evolving digital environment.

Figma updates: Yokohama release

Henrik Hiort — Tue, 22 Apr 2025 19:36:47 GMT

The Now Platform® Yokohama release introduces updates to the platform that help you put AI to work with new AI agents and more automated workflows. Explore the release notes to learn what's new.

On the Figma community, the Yokohama release includes the following enhancements:

Updated Employee Center libraries with support for Figma variables
Updated Workspace and Native Mobile libraries with the latest Yokohama updates

We're also introducing two new libraries:

Workspace Now Assist components - Use in combination with our Workspace components and template libraries to design your own Now Assist experiences. Keep an eye out for even more content about designing for AI coming soon to Horizon!
Customer Portal components and variables - Our new Customer portal library comes complete with components and templates that allow you to easily customize and design your own Customer portal experiences.

To start using the latest libraries, duplicate them into your Figma team and swap them into any files using the previous versions. Check out the Getting Started Guide in each library for more detailed instructions.

Want to learn more about how to design experiences for ServiceNow? Visit Horizon, your go-to source for the latest guidelines, patterns, components, and resources.

We can't wait to see what you create.

Download past releases

If you're looking for the Figma libraries for any of our previous releases, visit the Figma library archive page on the UX SIG.

Roadmap and Resources for Migrating to Employee Center (With UX Considerations)

Ceanna — Thu, 05 Dec 2024 15:12:25 GMT

Introduction

If your organization is planning a migration to ServiceNow’s Employee Center/ Employee Center Pro, follow these steps to ensure a successful transition. The timeline of your migration depends on several factors, including level of intended customizations, content availability and quality, stakeholder alignment and integration considerations.

In practice, these steps are not entirely sequential. Treat these as iterative steps and revisit them as you receive feedback from users on the overall portal experience. Note: (* indicates PRO feature). Don't feel like reading? Watch a webinar instead!

Step 1: Understand EC or EC Pro Capabilities:

Begin by comprehensively understanding the capabilities and features of the Employee Center

Goals for Step 1:

Understand Employee Center’s product vision and goals
Deep dive into Employee Center’s features and capabilities
Compare the out-of-box (OOB) experience with the current state

It’s important for product stakeholders to grasp the core functionality of Employee Center before building out requirements. Understanding the underlying technology will allow teams to make informed decisions and learn what OOB features can solve for your users needs. Remember, Employee Center portal extends the Service Portal platform, so much of the underlying technology is the same. This should make the migration less daunting for customers with existing Service Portals in the same instance.

Before you get started, remember to:

Build a team: Identify and engage core stakeholders from the beginning
Create a vision and define goals: Invest time in building a common understanding of the portal vision and goals
Define success: Define business value metrics associated with your organizational goals
Stay knowledgable on product features: Stay up to speed with the product roadmap
Understand and educate: Use this Employee Center Hype Video as part of your own internal adoption campaign and for understanding the platform capabilities.

Use these resources to learn more about Employee Center capabilities:

Employee Center Hype Video (3 min)
Employee Center Product Hub: Features and Capabilities
Employee Center Academy Sessions
Employee Center Academy: Migrating to Employee Center (Pro)*
Employee Center Roadmap Webinars
Now Create: Employee Center Success Map
Now Create: Employe Center Process Guide
Now Learning: Employee Center Essentials
Now Create: Employee Center – Process Workshop Presentation
ServiceNow Total & Advanced Impact Customers can take advantage of the following accelerator(s): Jumpstart your Employee Center

STEP 2: Design the Experience:

Develop a user-centered design for the Employee Center, considering human-centered design experiences and defining design principles.

Goals for Step 2:

Establish a shared understanding of what UX is and its implications for your project
Get to know your users and their experiences
Explore what the new experience can be
Define your design principles and design process

It is strongly recommended to engage user experience experts who also understand the ServiceNow platform capabilities when designing your experience. Ask your ServiceNow account team about how you can engage expert ServiceNow partners (UX+ platform knowledge) or ServiceNow expert services resources for this step of your initiative. This step should go alongside the "requirements gathering" phase of your software development lifecycle. Teams that make the mistake of skipping or deprioritizing this step might run into issues with user experience or adoption down the road.

Strike the balance between user needs and customization-heavy designs:

User-centered design is important, but maintaining a product with minimal technical debt and high performance is also important.

Designers should prioritize the needs of users through human-centered design practices, but it's important to validate designs/mockups with technical resources and portal experts to ensure no/low-customization and low-risk designs. Maximize OOB functionality before suggesting custom solutions.
On the other hand, technical resources and other stakeholders should empower designers to produce designs to avoid group-think or "design by committee" situations. There may be legitimate justification for customizations in some cases. Some customizations are low-risk when best practices are followed.
- For example, many designs can be accomplished with CSS/styling overrides (low-risk) when best CSS practices are utilized. However, severely modifying core OOB functionality/ widgets is rarely recommended. When in doubt, ask. There may be a configuration option that will suffice.

Once initial, low-fidelity mockups are complete, designers should work closely with product experts to validate the designs.

Stakeholders, designers and development teams are encouraged to learn what constitutes a good portal experience.

Recommended plan for designing your experience:

Step 1: Define User Experience Goals

Step 2: Design the User Experience

Step 3: Refine the User Experience

Step 4: Enhance User Experience

Purpose:

Get to know your users and their experiences
Build a foundational understanding of the current workflow to identify WHAT to transform

Tools:

User personas
Baseline usability study
Journey maps
Stakeholder alignment

Purpose:

Explore what the new experience can be
Validate with user and stakeholder feedback
Designers should be educated on EC capabilities to understand OOB functionality and avoid designing highly custom solutions when possible.

Tools:

Future state journey
Card sorting
UX Prototyping
Usability Studies
Identify design stories

Purpose:

Support the implementation by creating the design assets
Go from concept to detailed design to support configuration and development work.

Tools:

Usability studies
Tree testing
Prototype updates

Purpose:

Assess the implemented solution’s experience and identify future opportunities

Tools:

Usability studies (use resources below).
Learn how to get user feedback from usability testing

Tips for designing your experience:

When in doubt, stick to using OOB configurations – configure the OOB with demo data to evaluate it in a PDI
Only include high-value, low-impact customizations
Work with a ServiceNow partner who is experienced in designing portals
Invest in building in-house expertise in conducting user research studies

Use these research resources when designing your experience:

Now Learning: User Experience for ServiceNow
Now Create: Employee Center – Process Workshop Presentation
Employee Center Academy: Design techniques to kick start deployment
Employee Center Figma library
Steps to deploy Employee Center with Demo Data
ServiceNow Total & Advanced Impact Customers can take advantage of the following accelerators: UX: Design for Employee Center

Check out examples of Employee Center portals from the ServiceNow 2024 Best Employee Portal Contest (BEPC) .

Step 3: Define the Information Architecture:

Establish a clear information architecture / taxonomy that aligns with the Employee Center's design and enhances the user experience. This process may involve card sorting or tree testing exercises to validate your structure.

Goals for Step 3:

Build an Employee-Centric Information Architecture (IA)
Define your Content Taxonomy topics & owners
Map existing content to Taxonomy

What is Employee Center's Unified taxonomy? A collection of hierarchical topics that brings together different content types – requests, articles, quick links, employee communications – across departments into a single employee-centric taxonomy. If you are unfamiliar with taxonomy, it's recommended you learn more about unified taxonomy before proceeding.

Defining your information architecture, or unified taxonomy, is a crucial step when planning your portal. Your information architecture represents the front-end navigation (for your end users) on your portal. Note: This front-end, unified taxonomy, is not to be confused with the categorization you might use in the back-end for maintenance, etc. These are two separate things and can be treated as such.

Organizations with an existing, well-defined information architecture/content categorization may be able to reuse some or all of their categories if they make sense in your new portal. Otherwise, use ServiceNow's pre-defined out-of-the-box taxonomy models and add, remove or modify the categories until all of your content topics are accounted for.

It is recommended to follow this decision tree to determine which approach you will take to design IA:

Decision tree to inform your information architecture design process

Tips for defining an information architecture:

Assign topic owners to maintain the topic content.
Use *Rich Content to make your topic pages act as *Microsites
Don’t replicate your catalog or knowledge categories as taxonomy topics
Minimize the number of topics – Set an upper limit of no more than 4 levels and 10 topics per level.
Use Advanced Portal Navigation to:
Consolidating taxonomy topics under one menu and intermixing other relevant pages/links
Right align topics that need emphasis

Use these resources when building a taxonomy:

Note: ServiceNow Total & Advanced Impact Customers can take advantage of the following accelerator(s):

UX: Taxonomy Review & Design Accelerator

Step 4: Migrate Content

Decide on the criteria for content migration. Focus on migrating only quality content and utilize the opportunity to improve engagement through well-structured, non-duplicate content.

Goals for Step 4:

When migrating content from an external system or when transitioning content from Service Portal to Employee Center…

Build a committee or a decision board for the migration
- Engage authors to assist in content migration and establish topic-level committees for decision-making on content relevance and alignment
Identify the content to migrate (within ServiceNow and/or from external systems)
Define the content type it would migrate as
Define roles and ownership for topic pages and content publishing. This involves assigning ownership rights to contributors and ensuring governance

Tips for migrating content:

Use Knowledge Articles for deep technical content.
Create Topic Microsites (using Rich Content*) for services marketing or information content.
Use News and Banner announcements for time-bound marketing content.
Account for different design capabilities, for example:
- Is your current content full page width? Employee Center pages are not by default
- Does your content respond down to mobile size? Employee Center is designed to be responsive

Step 5: Deploy the Experience

Follow the steps to deploy the experience on the portal.

Goals for Step 5:

Activate the latest Plugins
Build the taxonomy structure & Mega Menu
Configure the OOB widgets
Build the portal theme & apply required CSS changes
Build required customizations
Setup integrations
Activate Analytics

Recommended deployment path for Step 5 (* indicates PRO feature):

Note: This flow does not include the creation of content, such as Knowledge Articles and Catalog Items

Install latest EC plugins from ServiceNow store
Setup Portal Theme
- Go to Service Portal branding editor
- Make changes to the portal theme
- Change CSS variables for more granular controls
Set up Information Architecture
- Build the taxonomy
- Clone OOB taxonomy “Employee”, make changes, and associate new taxonomy with EC portal
- Add content to the taxonomy topics
- Add the required Menu Items
- Configure Advanced Portal Navigation
Make required widget configurations
- Employee Center header, footer
- My active tasks
- Quick links
- Manager Hub*
- ..etc.
Setup Employee Profile
- Opt-in for Employee Profile
- Create Employee Profiles
- Make required configurations for Profile page
Setup App Launcher*
- Configure the SSO integration
- Add non-SSO applications
Setup Integrations*
- SharePoint Connecter
- Approvals Hub
- HCM integrations
- …etc.
Assign ownership and content contributor
- Topic Page ownership
- Content Publishing Ownership*
Activate Analytics
- User Experience Analytics
- Content Publishing analytics*
Setup page route maps to redirect legacy custom Service Portal pages to appropriate pages on Employee Center.

Tips for deploying the experience

Remember, the out-of-box experience is already a great user experience, as ServiceNow product teams invest greatly in UX research driven design
Use CSS Overrides as a first line of "customization" to reduce tech debt and skip records
If you must customize, edit the OOTB widget to make comparing custom to OOTB easy with the version diff tool.
Be sure to use translation method calls and not hardcode strings for multilingual support
When in production, create your content, communications, and content mapping

Visual representation of this flow:

Use these resources when deploying your experience:

Monthly Event: Employee Center Deployment Office Hours
Check out this community post on service portal CSS to learn more about overriding CSS styles in ServiceNow.

A note for development teams:

Use these Employee Center development starter stories as foundational user stories to get started.
Refer to the "Migrate to Employee Center from Service Portal" documentation for deeper assistance.

Step 6: Test the Experience

Validate your design and the overall experience by testing in sub-prod environments, find improvements and look for defects prior to go-live.

Goals for Step 6:

Conduct QA testing
Conduct Usability Testing
Conduct Performance Testing

Functionality (for QA) Testing	Usability Testing	Performance Testing
What is it? Testing of the features and capabilities implemented for quality assurance. Goal: Identify technical bugs. What to test: All user stories implemented Tools: ServiceNow’s Automated Testing Framework	What is it? Observation based testing of the experience with real users to validate design. Goal: Identify opportunities to improve and design gaps. What to test: Focus on top 3-5 portal use cases and a small questionnaire Tools/techniques: One on one testing between a facilitator and participant	What is it?: Technical tests to validate portal performance overall and for edge cases. Goal: Identifying performance bottlenecks. What to test: Key business flows and page loads and surge scenarios Tools/techniques: One on one testing between a facilitator and participant

Tips for testing the experience:

Capture good Testing Steps as part of your stories – Your QA is as good as your test scripts
Consider using web tests, such as Selenium (Note: They create data in the instance)
Identify pilot users and capture feedback through them
Avoid directing all users to home page during special company events – use event *microsites instead

Step 7: Plan for Launch & Adoption

Develop a comprehensive launch and adoption plan, including exec sponsorship and user engagement strategies such as guided tours and communication campaigns.

Goals for Step 7:

Build your launch strategy
Minimize change for users
Invest in Organizational Change Management practices

Tips for launch and adoption:

Consider soft-launching this is a separate portal and you can deploy alongside your existing portal - embrace "feature toggle" concept or "Beta" release
User Research can help trigger scarcity persuasion as well as instill a sense of ownership
Use your biggest feedback critics as research participants to help turn them into advocates and engage rather than avoid

Use these resources to learn more about planning for adoption:

Employee Center Academy: Organizational Change Management to drive adoption
ServiceNow Total & Advanced Impact Customers can take advantage of the following accelerator(s): Adoption Accelerator

Ensure Success Post-Migration

Develop a plan for continued maintenance and governance of the portal to maintain a positive experience for your end users.

Goals for Post-Migration

Identify and empower an owner of the portal experience: The owner leads the portal end-to-end and is responsible for driving overall governance.
Set up clear guidance on experience and content creation design principles (templates etc. )
Empower content creators and democratizing content creation
Start simple and slowly build out groups who can edit in prod
Consider a mentor who can help others learn and help impart standards

Recommended Governance Strategy:

Three levels of governance is needed.

Define Portal Governance
- Track value realized through portal
- Evolve portal vision and scope to maximize enterprise value
- Who is involved: Senior leadership and executive sponsors
Define Technical Governance Plan
- Manage the new features and enhancements roadmap
- Validate and evolve experience design
- Who is involved: Business stakeholders, e.g. head of department
Define Content Governance Plan
- Create process for maintaining content
- Identify and close content gaps
- Who is involved: Content authors, managers, and owners

Use these resources to learn more about governance:

Continuously Improve

Leverage feedback, user experience analytics, and performance analytics dashboards for ongoing improvement and governance post-launch.

Continuously iterate on your Employee Center design and user experience based on user feedback, expert reviews and evolving needs.

Use these resources to learn more about continuous improvement:

Community Article: User Experience Analytics
Community Article: Integrated Experience and Service feedback
ServiceNow Total & Advanced Impact Customers can take advantage of the following accelerator(s):
1. UX: Portal Experience Review Accelerator
2. Design Review Accelerator
3. UX: Catalog Request Experience Review Accelerator
4. TuneUp your Employee Center Accelerator

Already live with Employee Center? Learn 5 ways you can improve the overall user experience.

Modify ServiceNow’s Employee Center Out-of-the-box Icons

Ceanna — Wed, 06 May 2026 13:46:26 GMT

Modify ServiceNow’s Employee Center Out-of-the-box Icons

Employee Center comes with some icons out-of-the-box, but they might not meet your organization's branding needs. When it comes to modifying or replacing the icons on the Employee Center out-of-box instance, there are many different approaches you can take. This article outlines a couple of those options. Anytime you are choosing to modify something in your instance, ensure you are following both ServiceNow and design best practices. If you have questions around best practices, talk to your ServiceNow account team.

Disclaimer: This guidance outlines a few of many approaches for updating icons and is not official ServiceNow documentation.

Recommended Skillsets: UX Designer, Experience with Figma + ServiceNow Service Portal Experience

Option 1: Modify the Existing Icons to Match your Organization’s Branding

This section provides step-by-step guidance on how to apply your own branding colors to the existing ServiceNow demo icons in EC.

Considerations before getting started

Pros:

Limited ServiceNow platform/ technical knowledge required

Cons:

Need Figma

Basic Figma knowledge is recommended. For project teams with limited design resources, it is recommended to check-in-house for a UI Designer or graphic designer who may be able to support this initiative.

This approach is not very scalable. Meaning, what you see if what you get – ServiceNow provides these icons for out-of-box topics. In the future, if you create a new topic that doesn't match an existing icon, you might not have a corresponding icon to match it with.

Step 1: Prepare Your Icon Design in Figma:

Download the EC Components file from the Figma Community Site.
Open the “Widget assets” page and locate the Icons section
Reference your organization's taxonomy (mega menu topics) to align each icon with the appropriate topic.
Override the existing theme colors as needed.
Reference your organization's branding/color palette to ensure consistency with your brand guidelines.
Replace the existing hex values with the hex values from your organizations color pallet, which can usually be found in brand guidelines or internal design systems documentation.
IMPORTANT: Reference design and accessibility leading practices: Ensure icons have high contrast and are compliant with accessibility guidelines. Avoid light colors that might disappear or lose contrast.

Step 2: Export Icons from Figma

Once you are satisfied with the look of your icons, export each icon. It is important to maintain appropriate naming conventions (this will make it easier to associate them to the corresponding topic when you upload them into the platform later on).
When exporting, make the background transparent/ export as a PNG (Note: try unchecking the show export option under “Fill” for a clear icon).
Export
Organize your exported icons in a structured file system for easier management and future updates. Example:

Step 3: Upload Icons to ServiceNow:

Log into your ServiceNow platform. In the Filter Navigator, type in "taxonomy" and select "Taxonomies" to locate your active taxonomy record.
Choose the relevant subtopic (e.g., Software under Technology Services) where you want the icon to appear.
Starting with your first topic, upload each icon to the corresponding subtopic.

Step 4: Validate/Test

Navigate to the Employee Center in your ServiceNow platform. Validate your icon has been updated, renders correctly from the portal view, is clear and uses the appropriate pixels.

Consider Alternative Icon Sources

If you prefer not to use the ServiceNow demo icons or wish to create custom icons, consider using pre-made icons from sources like Font Awesome or Material Design.
See option 2 below for more details on a method of streamlining the use of Font Awesome icons.

Option 2: Replace Icons Using an icon kit from Font Awesome

Considerations before getting started:

Pros:

2k+ icons available to use for free

Better scalability (as you build new topics in your Employee Center in the future), as there are hundreds of icons to choose from.

Cons:

Time consuming if done manually (opposed to script method linked below)

Font Awesome Pro license required if you want more variety and bigger icon library

Step 1: View Icons in Font Awesome

Go to the Font Awesome site
Search for the desired icon
Use the styling tools to design your icon - refer to Font Awesome documentation for additional support
Upload it to your taxonomy topic record- Follow Steps 3 and 4 above

Follow the steps in this article for a more automated and quicker method (using a script) that will update the colors of your icons locally before uploading them. Note: Some technical skills required or some general understanding of PowerShell (PC)- Mac users can use this method as well (using Homebrew), but the steps will vary slightly.

Maintain Consistency and Accessibility

Whichever approach you take to modify your Employee Center icons, remember to:

Ensure that all icons across the platform have a consistent look and feel by following your organization's internal design systems.
Regularly review icons and update them as needed to maintain a clean and accessible design.
Ensure that new topics created in the platform get assigned icons to as you scale and create new topics.

Read this article to learn more about using Figma to design your Employee Center.

Have questions? Let me know below!

Using Figma for Employee Center Designs

Ceanna — Mon, 28 Oct 2024 17:22:35 GMT

This documentation will walk through locating the Employee Center Figma files on the ServiceNow community site, download and set up of the files and how to modify the file components.

Checklist before you Get Started

Install Figma for Desktop (recommended)
Create a Figma Account if you do not have one already

Step 1: Set up your team and project folders

Open Figma
Create a home for the Figma files
1. (If you are on Figma Organizations plan) Create a Team called “Shared Components” and a Project called “Employee Center”
2. (If you already have a Team space set up) Create a Project in your team workspace called “ServiceNow Employee Center.

Step 2: Download Figma Files and Setup your Project Space

Now that you have set your project space up, it’s time to import your files into your project.

Navigate to the ServiceNow Figma community by clicking this link: https://www.figma.com/@servicenow
Locate the file “Employee Center Components & Styles”
1. Click “Open in Figma” or import the file into your Figma. Note: if you don’t see this option, please refer to the Figma documentation for importing files.
2. Once opened, your file should be stored in “Drafts”
3. Right click on the file and move it to your project space
Back in the ServiceNow Figma Community, locate the file “Employee Center Templates”
Repeat steps 2a-2c
Once in your project folder, import your files [Employee Center Templates] and [Employee Center Component & Styles]

Checkpoint: At this point, you should have both files called “Employee Center Templates” and “Employee Center Components and Styles” loaded into your project folder. If not, go back through the steps.

Step 3: Publish Libraries

For each file, publish it as a library so that you can access it in other files.

In your EC Components file, you'll need to publish as a library
Click on the dropdown arrow next to the file name and select “publish library”.
Repeat steps 3.1 and 3.2 in your EC Templates file.

Step 4: Working With Components

Create a new Figma design file or open an existing one
In your design file, open the Assets panel in the left sidebar.
ClickLibraries to open the Libraries modal.
To enable a library, locate the library you want to add from the list of available libraries and click Add to file.
Add the library "Employee Center Components & Styles"
If you don’t see the library you’re looking for, try toggling the dropdown (see screenshot below).
To disable a library, hover over the Added button and click Remove.
Exit to close the libraries modal.
If you need additional support or if you are running into issues, follow the steps in Manage libraries in design files

Step 5: Start Designing!

You can now bring the assets into your design space by clicking into the asset and dragging it to the page.

2. Follow Figma's documentation to learn more about how to modify and work with components.

Additional Resources

Review Figma's documentation site to learn more about working in Figma.
Get all the necessary steps, tools, and resources to start crafting experiences with the Horizon Design System.

2024 Accessibility Survey: Help ensure ServiceNow products are meeting your accessibility needs!

mollybowman — Tue, 01 Oct 2024 21:20:19 GMT

Our annual Accessibility Survey is open! We would love your feedback on recent ServiceNow experiences from individuals who are involved in accessibility within their company in any capacity and/or identify with one or more disabilities.

Please feel free to pass on this link to anyone in your organization who may have ServiceNow experiences with accessibility at any level. ServiceNow is committed to providing the best possible experience for all users and ensuring accessibility for everyone, and the results of this survey will guide our next steps.

The survey should take about 15-20 minutes to complete, and if you are eligible, we’ll send you a thank you gift for your participation!

Click this link to begin the survey.

The 2024 survey will close on 10/18/24, so please respond before then. Thank you!

Crafting personas to understand your users

AJ Siegel — Tue, 02 Jul 2024 18:55:41 GMT

Gain a better understanding of who you are building in a 2 hour workshop with key project stakeholders.

Tips for Improving your Employee Center Portal User Experience (UX)

Ceanna — Fri, 18 Jul 2025 12:55:01 GMT

Discover essential tips to improve your ServiceNow portal's user experience! Learn how to prioritize user needs, improve navigation, optimize search functionality, personalize content, and streamline workflows effectively. Start transforming your portal experience today with expert guidance.

Crafting User-Friendly Experiences with UX Methods and Now Create

e__roman_bercot — Tue, 07 May 2024 23:40:00 GMT

Discover the power of UX methods in Now Create. Participants in my hands-on workshop at Knowledge 2024 learned fundamental UX methods like user interviews, empathy mapping, brainstorming, and wireframe sketching to create ServiceNow solutions that perfectly fit their organizations' unique needs.

SES3008 — Configurable Workspace Leading Practices for a Productive User Experience

George Hu — Fri, 03 May 2024 18:40:06 GMT

Figma Library Archive

AJ Siegel — Thu, 30 May 2024 17:32:59 GMT

After each major update to our Figma libraries (usually aligned to our Now Platform family releases) we'll attach the prior release's libraries here.

We plan to keep "n-2" releases available. For example, once we release the next update to Figma some in early 2024, we'll keep the Utah and Vancouver libraries here.

Releases

Self Service Leading Practices

AJ Siegel — Thu, 31 Aug 2023 20:53:25 GMT

Empower your users to solve their own problems.

Transforming a business process

AJ Siegel — Tue, 02 Jul 2024 18:56:23 GMT

Leverage UX methods to effectively use the ServiceNow platform to transform how works gets done.

How Might We? Translating problems into opportunities

AJ Siegel — Thu, 31 Aug 2023 15:40:44 GMT

A workshop technique for translating problems into inspiration for brainstorming ideas for your solution.

How to leverage Generative AI to develop a product strategy

Sabrina Sampey — Thu, 07 Sep 2023 14:48:55 GMT

Overview
Developing products to improve work conditions is multi-faceted. It's important to know who you're building for, what they're responsible for and what they need to do with your product. When we focus on one area, we sometimes miss the big picture. This leaves us with a limited view of a user's greatest needs, overlaps, and additional processes. Here's how to open that up.

In this article you will learn one way to use generative AI to lead a workshop to holistically understand a user's needs. From here, you can develop an MVP for your product strategy. This method can also be used to find gaps in existing products.

For discussion purposes we have a fictitious scenario. In this scenario we are developing a reservation system for national parks. The goal is to figure out what visitors visiting national parks need from a reservation system to plan our MVP. To start we will answer the following questions:

Who are the people visiting national parks?
Why do they use reservation system and what are their ultimate goals for visiting parks?

Personal Thoughts
As a designer working across industries with partners each creating unique and innovative solutions, I have found generative AI to be helpful in gaining a starting point. I use it to validate industry knowledge, users' roles and responsibilities, jobs that need to be done, and goals with actual humans. I find with limited time it’s easier to start with something vs. a blank page. This guidance isn’t meant to leave out humans! It serves as a conversation starter and should always be validated. I can't stress that enough. There are horror stories out there where people rely on generative AI as the source of truth only to be humiliated. Don't be that person.

Outcomes

Gaining a holistic view of all users that will use this product
Understanding what users come to this product to do
Understanding why they use this product to achieve their goals
Prioritized areas for MVP
Alignment on vision and roadmap

Materials and environment

Online white board collaboration tool (Miro or Mural)
Access for your participants into the white board of your choosing
Generative AI access such as Open AI’s ChatGPT 3.5 or 4 or Microsoft Edge’s Bing Chat for initial research to be validated

Before the workshop directions

Create online whiteboard. I used Mural for this example.
Set up the board like a grid with sections for personas (visitors), goals, jobs to be done and components. Add blank grey squares, for when participants need to add answer that is not listed.
Add agenda for the workshop:
1. Activity 1 Personas |15-30 minutes depending on list
2. Activity 2 Goals | 30 minutes
3. Activity 3 Jobs to be done | 30 minutes
4. Activity 4 Components | Optional
Ask generative AI questions for personas:
1. What park reservation websites exist in the US?
2. Who are the personas that use the reservation system?
3. Who are the people that make reservations?
Ask generative AI questions for goals:
1. What do they need to be able to accomplish on that site?
2. What do they need to know when they are on the ground?
3. What are visitors’ goals for visiting parks?
4. What are their goals for reserving?
Ask generative AI questions for jobs to be done:
1. What types of reservations can they make?
2. Once they make their reservations what other types of information do they need?
3. How much in advance do they need to make their reservations?
4. What do they need to know before they arrive?
The questions above are what I used, feel free to ask more. Then add answers to your board in grey boxes. This is what you will start the workshop with and validate with your participants.
If this is an already existing product, ask your participants to add component types using the blank grey boxes to the component column before the workshop. See attached pdf for full view that includes this column.

Workshop day directions

Make sure your participants have access to the board and can navigate the board and add items.
Run an icebreaker to get participants using tool and warmed up.
Go over agenda for the day.
Explain task for each activity. Each activity will run for 30 minutes or less. For activities 1-3 they will need to change boxes from grey to green if true, red if false, and modify the text if it is incorrect. There are blank grey boxes provided if they need to add items. Once a new item has been added they must change box color to green. Additionally for activities 2-3 they will add a star shape to highlight the 5 most important goals, and jobs to be done.
Once done, walk through any items that are in question. Move all the red off the board. Group similar items together.
This concludes your workshop session with your participants for the day. Thank them for their time and tell them next steps.

Post workshop directions

Make a duplicate of your board right next to the original one. Lock the original.
Look at the grouped items for goals. Can you name the theme?
Use the newly named themes for your goals and arrange them across. If there are more than 5 use the starred ones to only pull the top 5. In this example the goals have been bucketed into 3 main goals; Experience, Plan and Secure and Customize
Move all the jobs to be done under the goal item it belongs in.

Take these insights and change the format into a mind map visualization.
Map in this order: Persona > Goal > Specific Job to be Done that belong in that goal area.
Rearrange the jobs to be done with the starred (top 5) ones at the top
If a product already exists, look to see what on this list is already a function. Add the component name next to the specific jobs to be done item it relates to. Once you are through you can visually see where the gaps are. If a product does not exist, ideate on what type of feature could solve this need. Does that item need to be actionable is also another great thing to delineate.
What you end up with is a holistic overview, validated and collaborated on with customers, subject matter experts that shows what your product needs are for a particular persona. You can use this to do additional research to validate with other customers, and plan your MVP.

If you use this method, I would love your feedback. What went well, what could be improved? Many thanks!

Deliver a Great Self-Service Experience

AJ Siegel — Fri, 21 Jun 2024 16:34:58 GMT

Focus on your requestors expectations to deliver intuitive employee and customer journeys.

Guide to the Create Phase

AJ Siegel — Thu, 31 Aug 2023 15:04:10 GMT

In this phase, we transition from exploring the problem space and possible solutions to using the platform to deliver the experience your users need.

Guide to the Ideate Phase

AJ Siegel — Thu, 31 Aug 2023 15:18:14 GMT

Divergent thinking helps teams explore all the ways a problem can be solved in the best interests of the business and users.

Guide to the Understand Phase

AJ Siegel — Tue, 01 Aug 2023 20:55:26 GMT

Explore the power of shared knowledge to help teams align and deliver success.