CO State Employee Assistance Program Site Improvements
Colorado State Employee Assistance Program, two-month site improvement
May and June, 2017: While working for the Colorado Department of Personnel & Administration, I worked to improve the Colorado State Employee Assistance Program (C-SEAP) site. The website, like all Colorado State Agency websites, is provisioned by the Statewide Internet Portal Authority (SIPA) and is a very basic and limited installation of Drupal. 

I worked directly with the site owner of C-SEAP to make iterative improvements to the site. We chose a color scheme first, then we improved content page by page, and cleaned up old content. Lastly, we made changes to the top navigation and home page.

An example of the original color scheme and navigation is below:
BEFORE! This is a screenshot of the Locations page before any colors were changed.
C-SEAP home page color palette and footer change. We opted for no border color and a white background. I added the footer logo for brand awareness.
I used Slickplan to create this proposed site map for C-SEAP content. The yellow pages at the bottom are having their content recycled into different pages within the new structure.
I used Adobe XD to create some home page potential redesigns. The client was not sure if she wanted the slider to stay on the home page, so my two versions below show the difference between using the slider and using a free-form block of welcome text instead. I added a mobile version to remind the client that the blocks will stack in numerical order at cell phone width.
I provided some design services for this project. I hand-drew some icons and I used my own photography for new sliders on the home page. The design refresh for the Locations page is below:
The Locations page after improvements. I drew the icon of the map pin, changed the color scheme and navigation.
The state has limited budgets and complex approval processes for signing up with third-party services such as stock imagery. I hand-drew the following six icons for C-SEAP to use as they see fit. The Employee Assistance Program offers counseling, so a conversation bubble theme fit their needs. 
Home Page Slider Images
Starting with my own photography, I added the text requested by the client for a home page slider refresh.
Home Page Improvements
The event calendar proved to be a challenge. The C-SEAP client wanted an agenda view but SIPA's out-of-the-box events calendar did not offer this feature. I researched, then taught the client how to request a neutral Google mail account that several staff can access. Once the dedicated office-wide email account was provisioned, I could hand-code a new home page block with an agenda view of their Google calendar. 
After: This home page screenshot shows my work on the color scheme, navigation changes, rearrangement of the content blocks, new slider image, new Google Calendar block, and new hand-coded inline-styled buttons for "Contact Us" and "Urgent Help Now". 
CO State Employee Assistance Program Site Improvements

CO State Employee Assistance Program Site Improvements

Web site usability and visual improvements for C-SEAP


Adobe Photoshop
Adobe Illustrator
Adobe XD

Creative Fields

Copyright Info

Attribution, Non-commercial, No Derivatives

Read More