MyAmgen Redesign

OVERVIEW

Redesigning MyAmgen website which is an internal site used by Amgen employees worldwide. Amgen has more than 20,000 employees across different countries and "MyAmgen" is the intranet site that enables all employees to access essential company information and resources.

 

Before

After

MyAmgen Old.jpg
MyAmgen after.png

Team

Maryam Habibi (Amgen UX Lead) MyAmgen Product Team, External UX/UI Designers.

My Role

Led UX/UI design, Created Design Guidelines and Governance Rules, Conducted User Researcher and Interviews

The Challenge

  • Employees spend too much time finding resources and they have to rely on other people to find important documents. This results in less time spent on productive tasks and not being able to take advantage of all benefits.

  • The navigation on the site was unintuitive and complicated

  • The Home page was cluttered with too many links

  • Search results are old and irrelevant

  • Steep onboarding curve for new hires   

Project Focus

Redesigning MyAmgen

The Outcome

A new employee portal was successfully launched in September 2021 to users globally. As a result of my engagement with MyAmgen product team, the new design enables employees to easily navigate and access documents and resources. It also increased self-service and allowed employees to search and find information without relying on others.

Duration

Jan 2020 - Sept 2021

Tools

Adobe XD, Sketch, Zeplin, Miro

My Responsibilities 

  • Established specific design guidelines to educate team members on basic design principles

  • Designed concepts for the employee page, onboarding pages, and news section

  • Identified rules for all components and page patterns used throughout the site

  • Performed multiple heuristic evaluation of the site during different stages of product cycle

  • Consulted the designer to provide feedback on UI design of the site

  • Conducted two rounds of usability reviews during different phases of the project

  • Focused on improving content analysis strategy, structure and information architecture of the site 

In This case study, I am focusing on showing the work for design concepts, guidelines, and rules for MyAmgen project. 

 

Design Concept

The profile page wasn't designed as part of the MVP and the designer from the external team used Salesforce template that they had. I created a design concept for the team to depict the information on the profile page cleaner, organize, and easy to scan with a better visual hierarchy of information.

Before

StaffProfile-before.jpg

After

StaffProfile-after.jpg

Design Guidelines

There was a gap of UI designer at a certain time during the project from the external partners and I uncovered some design problems within the MVP site while conducting a heuristic review. There were issues with basic design principles such as proper use of white space, alignment, hierarchy, consistency, and grouping. Therefore, I created the below file using MyAmgen design example with description of basic design guidelines to educate the team members on the topic.

Screen Shot 2022-04-12 at 10.54.34 PM.png

Design Rules and Governance

Created some specific rules/guidance to provide a clear structure for building the content on MyAmgen pages based on the specific goals/intent of the page from the users' point of view. These rules are also useful for ongoing governance to maintain consistency and cohesiveness across pages/sections in MyAmgen. The rules are for all components on the site and seven different page patterns that were used throughout the site. 

Components Design Rules

Here is the screenshot view of all the rules and guidelines for MyAmgen components.

components-screenshot.png

Below are three examples of components with rules.

Components-rules.png

Page Pattern

Identified seven page patterns and each page pattern included:

  • Goals of the page pattern

  • An example image of the pattern

  • General page layout rules and variations

  • Listing of associated components that are "allowed" on the pattern

  • Provide guidance/rules on relationship to other page patterns

Here is the screenshot view of some rules and guidelines for MyAmgen page patterns.

Pagepattern-screenshot.png

Here is an example rules for one page pattern with all the components.

Functionpage-1.jpg
Functionpage-components.png