Role: UX Designer Intern, Remote Position 
Description: Designed a website that increased employee engagement by 
improving the way users access information.
Duration:  September 2019 - April 2020
Tools: Figma 
Client: U.S. Office of Personnel Management (OPM) ​​​​​​​
_____________________________________________________________________________________________
The Vision
Breaking Down Silos ​​​​​​​at the U.S. Office of Personnel Management (OPM)
OPM wanted to use a microsite to highlight the participant success stories to increase engagement in the Open Opportunities program. ​​​​​​
With nearly 18,000 active users, Open Opportunities is a professional development platform that allows all federal employees to collaborate on projects and share skills across government.
The Solution 
A One-Stop-Shop
​​​​​​​Through the design and development of the microsite project, I advocated that information related to participant success stories should be integrated into the existing Open Opportunities website instead of a standalone microsite.  Reflecting on the marketing of the microsite and analyzing the user journey, approaching engagement in Open Opportunities program through a microsite proved to be confusing.  ​​​​​​​​​​​​​​

Breaking Down Informational Silos 
Aspects of the Open Opportunities website features information for both public and credentialed access. I advocated that participant stories should be included as part of the public facing information on Open Opportunities.​​​​​​​ 

The Adventure
Understanding the landscape by learning about OPM's motivations for a microsite 
Requirements
1. Public Facing Microsite 
2. Showcase Participant Stories
3. Not another bogged down government website
Pain Point
OPM has an archive of many wonderful stories of Open Opportunities participants, but they are limited to the newsletter, which is not publicly distributed.  ​​​​​​​
Discovery 
With the microsite being positioned as something that would be used to attract prospective Open Opportunity participants, I was interested in learning more about brand identity, and storytelling. 
How Do Government Organizations Brand Themselves?​​​​​​​
Through Patriotic Palettes & As Information Powerhouses 
Many sites included in my evaluation were dense. Clear information hierarchy, use of icons/infographics, and call to actions from the navigation were critical features of most sites. 

What websites does OPM admire when it comes to storytelling & why? 
Inspirational Copy & Large Visuals for an Immersive Experience
Using a personal and friendly tone, feature stories inspire users to want to engage with both the article and the featured service/product. Large images immersed users in the experience of the story. 


Brainstorm
You can't tell stories without providing context 
Reviewing the sites from discovery, showed that in addition to stories, the  microsite would need an about or contact page. 

Breaking information silos through social connections 
Initial ideas also looked at how the microsite could include a social element or collaborative space, connecting the public, prospective, and former Open Opportunities participants.  
Initial Sitemap
Original Site Map 
Home Page: Getting involved with the Open Opportunities program &  Featured participant stories
About Page: Origin, Mission, FAQ,, Contact 
Stories Page: Open Opportunities participant stories & Blog
Connect Page: Collaboration space 
Get Involved: Process/Tips,  External Link to Open Opportunities website, FAQ,, Contact  
Wireframe
There was a cyclical process of design reviews and incorporating relevant feedback from internal stakeholders to include community members, developers, and management. 
Addressed Security Concerns 
The Connect Page was a security risk, and was removed. It was replaced with a Forum Page where users could discuss specific program related topics. ​​​​​​​​​​​​​​
Prioritized Additional Articles from the Monthly Newsletters
The Blog Page was removed from the sub navigation under the Stories Page and became apart of the navigation to bring awareness to other topics from the newsletter
Blog Page Sketch
Blog Page Sketch
Blog Page Wireframe
Blog Page Wireframe
Blog Page Hi-fidelity mockup
Blog Page Hi-fidelity mockup
Streamlined the User Journey
Users would need to go to the Open Opportunities website to apply for projects. The Get Involved Page became an external link to the Open Opportunities Home Page.  ​​​​​​​
Revisiting the Sitemap 
Final Site Map 
Home Page: Getting involved with the Open Opportunities program & Featured participant stories
About Page: Mission & Community programs
Stories Page: Open Opportunities Participant Stories
Blog Page:  Stories from the monthly newsletter that prior to the microsite were reliant upon a listserv 
Forum Page: FAQ 
Get Involved:  External Link to Open Opportunities website
Designing a Hi-Fidelity Mockup 
Creating A Visual Language that would work in tandem with Open Opportunities website. 
I started with the Open Opportunities website and logo for color and typography. Using findings from my discovery about government websites brand identity, and feedback from OPM, I put the stories and partcipant photos to the forefront. 
Color 
Typography 
Buttons & Links 
Icons 
Samples
Prototype 
The Microsite relied on the Open Opportunities website
​​​​​​​While the microsite provided users with an opportunity to learn about stories of Open Opportunities participants, ultimately they would have to be redirected to the Open Opportunities website to apply for the program.


Microsite Homepage showing  links to external Open Opportunities Website 

Feedback & Evaluation 
Critical to each iteration of the microsite was feedback, evaluation, and collaboration. As a remote team member, pre-Quarantine era, I presented my designs remotely, and would collaborate with team members to incorporate feedback from members physically present in the office. 
The Rationale 
Integrating the Microsite into Open Opportunities proved to be necessary 
The User Journey on the Microsite was confusing
Users would need to go to the to the main Open Opportunities website to sign up for an opportunity, or learn about how to post opportunities. ​​​​​​​

The Microsite could not assume users already knew about Open Opportunities 
However, including more context about Open Opportunities created redundancy between the Microsite and the Open Opportunities website. ​​​​​​​

The marketing of the Microsite made the distinction between Open Opportunities and the Microsite unclear. 
The Microsite felt like an improvement to the Open Opportunities website. There wasn't a separate name or logo. Without a separate identity, how could you effectively direct users to the Open Opportunities website and the Microsite? 
Sitemap with purple color to distinguish areas of redundant information and reliance on external links to Open Opportunities website. 
Orienting Users to Open Opportunities
With stories on the microsite coming from both individuals that participated in opportunities and those that posted opportunities, orienting the user to Open Opportunities by explaining how and why they could get involved. 

Showing the benefits of the program  
As a relatively new program, I highlighted the benefits of the Open Opportunities program through the lens of actual participants by leading with their inspirational quotes throughout the Story Pages. 
The Implementation
Incorporating the Solution into the Open Opportunities website
My internship concluded before this project was migrated over to the Open Opportunities website. However, you can view how my solution to break down information silos, and advocating for a one-stop-shop was incorporated into the Open Opportunities website  Home Page , Stories Landing Page, and Stories Subpage
Open Opportunities Homepage 
Open Opportunities Stories Landing Page & Sub Page

You may also like

Back to Top