Pronoy Kapoor
Intranet Redesign
Client/College
To redesign the intranet for the City of Kingston. A real time client project which gave opportunity to explore various UX research and design methodologies in depth.
Roles
UX researcher & UX designer
Team size
5
Time frame
4 months
Tools
Figma, powerpoint
Figure: The city of Kingston employs over 1800 people
UX Problem
The City of Kingston employees find the current KingNet as having old content, dated design, and of limited value to their work. They would only visit KingNet in an as per-need basis or to merely serve as a jump-off point to other destinations.
Project Goal
The goal is to transform KingNet from an online repository to a communications hub and productivity tool for employees that would facilitate engagement and collaboration within the organization.
Target Audience
All KingNet users
Everyone working at City of Kingston and have access to a digital device
Office workers
Everyone working within the confines of an office building
Management
Managerial person and their in-office team members
Figure: Organizational structure of our target audience
Overview
Research methodologies
Every good project starts with a strong foundation based on research. To improve KingNet, we planned a two-pronged approach:
-
Surveying and interviewing the users of KingNet about their current experience
-
Research current best practices for any intranet design via a literature review and competitive analysis
Literature review
For literature review , we consulted three different type of resources
Blogs : The blogs we read gave us information about
-
Best practices of a successful intranet
-
An insight into features preferred by the employees (direct users of the intranet)
-
Latest trends in intranet design
PDFs : The documents we found gave us information about
-
How to setup an intranet – steps to follow while installing an intranet solution
-
Market practices followed to establish an intranet
-
Market policies governing the standards for any organizational intranet
Demo Sites : We visited 3 demo intranet webpages to
-
Find common features used in intranet designs
-
Identify design patterns frequently used
-
Distinguish between good intranet and bad intranet
Figure: Some intranet design trends identified in literature review
Survey and analysis
For our initial research into user mindset, we conducted an online survey with the City of Kingston employees. We asked them a total of 13 questions, the results for which generated interesting insights. Through this survey we gathered information on:
-
How do users access the intranet
-
How often they use the intranet and for what purpose
-
Choice of their device to access the intranet
-
Their top tasks on the intranet
-
Overall experience using the intranet
Survey results
Improvements recommended by the survey respondents can be categorized as follows
Features and content requested
-
Customizable dashboard
-
Advertising
-
List of local providers offering staff discounts
-
Area to access corporate public records (e.g., council/committee minutes, agendas, reports, and by-laws)
-
Quick links
User Experience
-
User-friendly interface
-
Clear and consistent navigation
-
Updated information and eliminate outdated one
-
Update forms
-
Improve search functionality
-
Easy access to info
-
Constantly updated news (internal corporate, local community, upcoming events)
Figure: Data results showing how KingNet users access the intranet(top); and the frequency of users accessing the intranet (bottom)
User interviews
For a deep dive into the mental model of the user, we conducted online interviews and found out a little bit in more detail, how the current user of the intranet views this resource. After recruiting participants, the consent letters were duly signed and all information collected was shared with the participant's permissions. These interviews focused on more detailed feedback and sought information on
-
Goal for KingNet
-
User/Client expectations
-
their thoughts and needs for a 'My profile' section
-
How they envision the intranet as a communication channel
Top tasks
Final Analysis
Once all the interviews were conducted, the results of the surveys and interviews were compiled. And, a comprehensive summary was generated in the form of 'Top Tasks'. This informed us about what the user do with the intranet and what the user want from the intranet
What users do
1. Survey results - 64.3%
Access HRMS
2. Survey results - 50.0%
Access Org Chart
3. Survey results - 42.9%
Access Policy Pages
4. Interview results - 2/6
Check Job Openings
5. Interview results - 4/6
Check New Hires
What users want
1. Interview results - 6/6
Check Updated News
2. Interview results - 5/6
Quick Links
3. Interview results - 5/6
Internal Communications
4. Interview results - 2/6
Role-specific Data Statistics
Figure: Collecting actual quotes made by the participants during the interviews helped shape the user mental model
Research & Analysis
Designing wireframes
In order to give the client design solution, we started with the first iteration of the intranet design. Our design pattern choices were based on the secondary research conducted in the previous phase. And our information architecture for the redesign was based on our primary research activity conducted with actual users of the intranet.
Level 0 - Home Page
Home Page
For our redesign of the intranet, we wanted to give a more personalized space to the user. Thus, we introduced a customizable dashboard. Keeping the design simple but at the same time delivering maximum information on the landing page was the aim. The following elements were introduced on this new home page :
Main Menu
The main menu contained a six departments only as opposed to extensive menu on the original, to reduce the cognitive load on the user.
Utility Menu
The utility menu contained a simplified search option , chats notification and link to user profile.
Left Panel
The left panel is designed as a personal space, which will be completely editable as there are different type of users with different needs.
Right Panel
The right panel is more of a resource center. It gives access to top priority elements like Quick links and third-party applications.
Central Content
Research indicated that users want updated information on the intranet, so it follows that news is the major focus of the central content area. Retaining the jobs/new hire section as t users find value in.
Footer
The footer contains links to secondary important links and social media links.
Figure: . Two options for the home page were designed with the only difference in the design of the left panel
Level 1 - News page
News Page
In order to define the design style of the level 1 pages, we took up the news page. This design pattern will be the blue print of all the sub-pages on the intranet. Keeping the design consistency across all pages, the news page also has a left/right panel and a centralized content. The left panel will be a personalized column with access to saved content from news clippings, videos and podcasts which the users can access at their leisure. The right column will contain more focused access to content which is not article related like the video link to their youtube channel and podcasts. The central content area will be populated by news items that has been pre-defined and pre-categorized by the client.
Figure: level 1 page keeping design consistency and making blueprint for all further level pages
Level 1 - My profile
Profile Page
As a proposal we asked the users if they would like a profile page. Thus, based on the research data we came up with this new page. Initially, we proposed this as a pop-up which will inform the user and viewer of important areas like skills, personal info, groups, team and other related information that would be useful to all users across the organization. This will again be an editable section with control given to the user as to optimally use this section to promote their growth within the organization.
Figure: level 1 page for 'My Profile' introducing to the user for the first time
Design & Wireframing
Testing Design
A/B Testing
As we have designed two options for the home page, an A/B testing was conducted with our peers and fellow UX designers. As a result, it was decided to keep the design with a more detailed and expanded left panel menu as the feedback was majorly on the visibility of content which will enhance usability of the dashboard panel.
Figure: A/B Testing done with peer group
Validation Sessions
For getting feedback on our initial wireframes we conducted two forms of validation session.
Feedback sessions with peers
To get a review on our initial wireframes, we conducted a 30 mins feedback session with our fellow UX designers. This gave us an opportunity to have first hand feedback on design, usability and accessibilty of the design from a designer point of view. Based on which we were able to make many enhancements to our future iterations of the design.
Focus groups with intranet users
To further get a validation of our design and concept, we conducted focus group sessions with the actual users of the intranet. This gave us an opportunity to record first reactions of the users. although, the user initially expressed shock at the information being provided, but as time lapsed they found value in the informaiton provided and gave us mostly positive reviews. this boosted our confidence to take our designs into the next phase.
Figure: Feedback given by peers to improve our design
Updated wireframes
High-Fidelity Wireframes
Based on the analysis from the A/B testing, peer and user feedback, we converted our low fidelity wireframes into High-fidelity wireframes and presented them to the clients for further critiquing. In order to do that we generated some design mandates.
-
the dashboard style, but provide more flexibility to user
-
Retain the wireframe layout and build prototype on
-
Apply City of Kingston branding as per accessibility guidelines
-
Maintain a consistent typographical hierarchy
-
Include context and visual cues to guide the user
