Responsive Intranet Portal

Heartland Employee Portal

Creating a collaborative environment for college faculty

Heartland Community College was in need of an intranet portal that would serve as the centralized information hub for all employees of the college. The main goal of this intranet portal was to enhance their existing methods of organizational document management, information gathering, and campus communications. They wanted to create a unified culture across the organization in order for all employees to work within a consistent experience.

 

ROLE
UI Designer

CLIENT
Heartland Community College

AGENCY
PixelMill

YEAR
2017

Overview

Heartland Community College was in need of an intranet portal that would serve as the centralized information hub for all employees of the college. The main goal of this intranet portal was to enhance their existing methods of organizational document management, information gathering, and campus communications. They wanted to create a unified culture across the organization in order for all employees to work within a consistent experience.

PHASE ONE

Research & Discovery

 
 

User Interviews

In order to obtain a better understanding of Heartland’s users, we conducted user interviews with focus groups with people from marketing, campus wide initiatives, service departments, and general users. From these user interviews, we were able to discover current work habits, common pain points, and areas where they seek improvement. With these results, we analyzed the common problems across all users and formulated use cases that defined the recommended requirements for the intranet. Below are some examples of our use cases.

 
  • Use Case #1:
    As a user, I want to be able to reach important organizational news and events in order to stay up-to-date on current events, along with time sensitive alerts on my home page. The lack of accessibility makes me feel disconnected from my organization and our goals.

    Recommendation:
    The homepage should serve as a place to easily redirect users to organizational information, news, and updates. This will help Heartland staff feel more connected to each other and provide an easy way to view updates from leadership, marketing, and facilities.

  • Use Case #2:
    As a site owner, I want to be able to set permission levels in order to easily determine which sites are private or public.

    Recommendation:
    To improve the security of sites by providing the ability to set permission levels for sites that are editable, viewable, or fully private. The identification of permission levels will give specific access levels for each site.

  • Use Case #3:
    As a user, I want to be able to quickly search, view, and access necessary information such as documents, meeting notes, task lists, and deadlines in order to work sufficiently on my tasks or projects.

    Recommendation:
    The search functionality should include an improved filtering system that will assist the user with closely matching what they are searching for. In addition, a bookmarking feature with the ability to save commonly visited sites is recommended for an easy and quick navigation tool.

  • Use Case #4:
    As a user, I want to be able to view all content related to me by having the ability to view all sites that I am a part of and view all tasks assigned to me.

    Recommendation:
    To create a prominent, easy to access roll up list on the homepage that displays the sites and tasks specifically related to the user. This will give users the ability to view their sites, projects, and tasks easily when they enter the Work Center which stands for increased productivity.

PHASE TWO

Initial Wireframes

 

Responsive User Experience

From the user interviews and defined use cases, we were able to create possible UX solutions through wireframes. These wireframes were produced with each pain point and user recommendation in mind, along with being mindful of how each functionality will work in desktop, tablet, and mobile. The wireframe process included multiple iterations while actively working with the client in creating the best solutions possible.

 
 
 

DESKTOP WIREFRAME:

TABLET WIREFRAME:

MOBILE WIREFRAME:

 

PHASE THREE

High-Fidelity Design Mockups

 

Final User-Interface Design Mockups

The finalized solutions were created to be responsive between desktop, tablet, and mobile.

 
 
Previous
Previous

Heartland Work Center

Next
Next

Growmark eResource