City of Kingston

Redesigning of the Dashboard and About Us screens for KingNet, City of Kingston’s internal communication platform for employees.

TL;DR

The City of Kingston’s intranet, KingNet, was outdated, cluttered, and under-utilized. Our team reimagined the dashboard and About Us page to enhance engagement, streamline information access, and foster a stronger sense of belonging among employees, especially the frontline workers.

Through user research, usability testing, and iterative design, we crafted an intuitive and accessible interface that improved efficiency and communication for over 4,000 employees. Post-implementation usability testing revealed an 87% satisfaction rate and an SUS score of 80, validating the success of our user-centered approach.

TEAM

Amanda Moral

Balraj Singh

Karen Zacarias

Tushar Sharma

Twisha Shah

DURATION

4 months (2022)

ROLE

UX Research

UI/UX Design

Visual Design

Prototyping

Usability Testing

TOOLS

Figma

Adobe Photoshop

Miro

OVERVIEW

Transforming an outdated Intranet into a modern employee hub

The City of Kingston’s KingNet intranet was intended to serve as a central communication and information hub for its employees. However, with outdated content, an overwhelming interface, and a lack of engagement features, it was clear that the platform needed a comprehensive redesign.

Our challenge was to rethink the Homepage and About Us sections for frontline workers to:

Increase employee engagement.
Strengthen the sense of community within the organization.
Streamline access to critical information, reducing unnecessary clicks and improving efficiency.

UNDERSTANDING THE PROBLEM

Why did KingNet need a revamp?

While KingNet provided access to tools, links, and news, it lacked key features that modern workplaces require:

Poor Engagement: Employees rarely used the platform beyond essential tasks.
Fragmented Communication: No mechanisms for leadership updates, success stories, or peer recognition.
Complex Navigation: Employees struggled to find critical information, leading to inefficiencies.
Outdated Content: A perception that the platform was obsolete discouraged frequent visits.

KEY PROBLEM

How can we redesign the intranet to be more engaging, community-driven, and intuitive, ensuring that employees find value in using it daily?

SOLUTION

The redesigned homepage and About Us page, optimized for a seamless and intuitive employee experience.

Research & design process

Our approach followed a structured five-step UX process, ensuring that research, analysis, ideation, and design aligned with user needs. By iterating based on continuous feedback, we delivered a user-centered solution that improved efficiency and engagement.

1. User research

To ensure our redesign addressed real employee needs, we first categorized the City’s diverse workforce of over 4,000 employees. Recognizing their varying usage patterns, we created coustomiza homepage versions while keeping the "About Us" layout consistent.

RESEARCH APPROACH

Before conducting primary research, we outlined key insights we needed:

Essential links and content required for different employee groups.
Challenges employees faced when using the intranet.
The organization’s identity and how it should be reflected on the "About" page.
Existing communication patterns and how information was shared internally.

RESEARCH METHOD #1

Surveys

We created a Google Forms questionnaire to quickly collect anonymous feedback from a diverse range of employees. This helped us validate assumptions, identify major pain points, and understand which features were most useful or missing.

The survey responses highlighted key frustrations, such as difficulty finding essential resources and a lack of relevant updates.

RESEARCH METHOD #2

Focus groups & interviews

We conducted small group discussions and one-on-one interviews with employees from different departments. These sessions provided in-depth insights into how employees interacted with KingNet, their most-used features, and what aspects of the platform felt confusing or redundant. The discussions also revealed the need for role-based personalization to accommodate different user needs.

RESEARCH METHOD #3

Unmoderated Card Sorting

To improve content organization, we asked employees to categorize intranet topics in a way that made sense to them. This exercise helped us understand how users expected information to be structured and guided our redesign of the intranet’s information architecture. The results led to clearer navigation and more intuitive content grouping.

2. Research analysis

After a week and half on intensive research, we focused on synthesizing the data we gathered to derive insights. We particularly checked for trends for the questions we had initially. Most people had the same opinion about the intranet.

AFFINITY DIAGRAMMING

We categorized and organized our findings to determine which key insights belonged where. This enabled us to develop design mandates and establish a content hierarchy.

Screenshot of affinity diagram for About Us screen

Screenshot of affinity diagram for homescreen

KEY HIGHLIGHTS

Employees avoided outdated pages, assuming they were irrelevant.
Navigation issues led employees to ask colleagues instead of using the intranet.
Lack of awareness of existing features reduced engagement.

Keeping these insights and design mandates in mind, we knew what we wanted to achieve through the user interface and decided to move onto the ideation phase.

3. Ideations & iterations

The required features, call to actions and pieces of information were pretty clear after the phases above. Moreover, the information architecture was fixed after the initial research. Hence we directly moved on to sketching paper prototypes of both the screens.

After a couple of paper iterations we had a general idea ready, so we switched to Figma, where it was easier to move things around. We created both wireframes and had couple of rounds of design feedback with our colleagues at St.Lawrance college. We used A/B Testing method to identify more useable design.

After multiple iterations, we hosted focus group sessions and interviews with the same city employees to gather their feedback on the design and information structure on the pages.

Documentation of employees’ feedback on Miro board

Once we had all feedback in place, we fixed a low fidelity mockup and worked on creating it a high fidelity prototype.

4. Visual design & high-fidelity prototyping

OPTIMIZED COLOUR PALETTE

We refined the color scheme to create a more engaging and visually cohesive experience. All colors were selected from the City of Kingston Design Guide to maintain brand consistency, ensure high contrast, and meet accessibility standards (WCAG compliance).

IMPROVED TYPOGRAPHY AND HIERARCHY

To enhance readability and minimize cognitive overload, we applied a clear type hierarchy. This ensured that key information stood out, making content easier to scan and comprehend across different screen sizes and devices. The selected typography adhered to the City’s guidelines, balancing aesthetics with functionality.

ICONOGRAPHY AND VISUALS

We introduced intuitive icons and supporting visuals to improve wayfinding and content discoverability. By incorporating meaningful graphics, we helped guide user focus to essential features and reduce navigation friction.

Redesigning the dashboard

The previous dashboard overwhelmed employees with excessive and irrelevant content, making navigation difficult.

Our survey results showed that over 50% of employees rated their intranet experience as complex, highlighting the need for a cleaner, more focused interface.

Previous Homepage Design

For frontline workers, the intranet primarily served as a tool to:

Stay updated on company news
Monitor payroll, attendance, and leave days

To improve usability, we designed a minimal yet highly functional dashboard, prioritizing only the most essential features.

New Homepage Design

Key features

QUICK LINKS

Only the 3 most-used features for frontline workers, reducing cognitive load.

CALENDAR INTEGRATION

Synced with Outlook to display upcoming meetings and events.

SUCCESS STORIES

Showcased employee achievements to boost morale and engagement.

JOB POSTINGS

Encouraged internal referrals and hiring, with a save-and-forward feature for easy access.

CELEBRATIONS SECTION

Recognized birthdays, anniversaries, and company events to foster connections.

NEW HIRES SPOTLIGHT

Helped employees connect with new team members, enhancing workplace relationships.

Redesigning the About us page

The previous design of the About Us page made it difficult for employees to find relevant information due to excessive clicking and a complex information structure.

Employees often struggled to locate key details about the City of Kingston’s mission, initiatives, and updates, reducing their sense of connection with the organization.

Previous About us (Corporate) page design

To address these challenges, we redesigned the page to make information readily visible, eliminating unnecessary navigation steps and ensuring a more engaging experience.

New About us page design

Key features

SIDEBAR NAVIGATION

Prioritized and organized key information with direct links to essential pages.

STRATEGIC PLAN SECTION

Ensured employees were aware of ongoing and future projects, fostering alignment with company goals.

AWARDS & RECOGNITION

Highlighted company achievements to boost morale and advocacy.

LOCAL HIGHLIGHTS

Brought visibility to city-wide initiatives, increasing employee engagement with the broader community.

RECENT PUBLICATIONS

Provided quick access to company updates, keeping employees informed.

5. Conclusion

USABILITY TEST & NEXT STEPS

We conducted usability tests with 17+ employees to evaluate the effectiveness of the redesigned intranet. The feedback validated our approach, highlighting significant improvements in ease of use, navigation, and overall engagement.

While the usability test provided valuable insights, an accessibility audit is still needed to ensure the final design is fully inclusive. This next step will help us address the needs of employees with diverse abilities, ensuring equal access and usability for all.

87%

Satisfaction Rate

80

SUS Score

Learnings & takeaways

Data-Driven UX: Incorporating insights from user research simplifies the visual design process by prioritizing needs and pinpointing pain points effectively.

Balancing Research and Design in a timeframe: Achieving equilibrium between research and visual design is crucial for creating user-centric designs. Both elements play equally significant roles in the design process.

Avoiding Assumptions: Validating assumptions is essential in UX design. User problems may differ from initial assumptions, emphasizing the importance of gathering concrete user feedback to inform design decisions accurately.