The Bluebeam UI/UX Redesign project aims to enhance the usability and visual appeal of Bluebeam's Pre-portal training. The redesign addresses key issues with inconsistent styling, complex navigation, and a lack of user engagement, particularly for users with low to moderate technology comfort levels. The project focuses on creating a cohesive interface aligned with Bluebeam's branding, improving the user experience by simplifying navigation, and making the content more accessible and engaging for users.


Role in Team: Lead Web Developer & Co-Web Designer

Duration: 4 weeks (full time)

Tools: Figma, Skilljar, Illustrator, CSS, & JQuery

Screencap User Persona User Flow UX/UI Problems and Solutions Wireframes Code Snipit

User Flow & User Persona

face image
User Flow Image

UX/UI Problems & Solutions

Overall:

Problem - Default setup and styling were not cohesive with Bluebeam's visual branding. Text size and style were incorrect, line height was inconsistent, and buttons did not adhere to brand guidelines.

Solution - Applied styling using official brand colors. Standardized text style, sizes, and line height based on user feedback, favoring a slightly larger font size for older users. Standardized buttons to align with Bluebeam's brand standards.

Before

Before After

After

After

Before

Before
After

After

Before

Research & Wireframes

face image

Low-fi Designs with UX Solutions for Course Dropdowns

face image

Mid-fi Designs

face image
face image

Low-fi Designs

face image face image

Mid-fi Designs

face image

Sample JQuery and CSS Code

linkedin
Home UX/UI Resume