OMLP WEBPAGE
Bringing the on-boarding experience to the 21st Century
Project Summary
The Problem:
It's your first day on the job as a leadership-program member. You know that others have gone through the on-boarding process but you don't know who to ask. You're handed a laptop and told to get to work.
The Solution:
A one-stop hub for on-boarding information, providing resources to newcomers, members, and program alumni.
01 Define
I had the privilege of joining a leadership program focused on shop operations. When I joined, I remember feeling overwhelmed and unaware of how to get connected with other program members. Over time I accumulated a number of different websites and links that I wish that I had when I was on-boarding.
With the approval of the business program manager, I set out to create a website that would help simplify the on-boarding experience for newcomers.
My Role:
UX Researcher and Website Developer
Tools Used:
HTML, CSS, Javascript, Adobe Illustrator CC
02 Research
User Interviews
I conducted interviews with the most recent newcomers, program members in my class, and program alumni to understand how they felt about their on-boarding experience. Here's what they said:
Recurring Themes
1. The text is too small to read.
2. The hyperlinks are not organized in a logical order. Not all the links work for all users. Certain names of hyperlinks don't reflect the intended resource.
3. The page looks outdated. This reflects poorly on the brand of the program which has been around for 40 years.
4. Users had no idea that an on-boarding portal existed.
Requested Updates
1. Hyperlink Review: Ensure that the resources listed on the page are up-to-date. Many of the links shown on the on-boarding page no longer existed.
2. Hyperlink Access: Certain hyperlinks brought the user to a file that the user did not have access to. Collecting all files and hosting the documents locally would ensure that everyone can access the relevant documents.
3. Hyperlink Nomenclature: Rename (and resize) hyperlinks to make sure the name of the link correctly corresponded to the correct resource.
03 Analyze
Card Sorting & Information Architecture
From the interviews conducted, I was able to determine which links and resources were most important to the program members. I assigned each resource a sticky-note then experimented on best groupings for the resources. From these groups I created a taxonomy which would help determine the layout of the website.
04 Ideate
Wireframes
With the taxonomy in mind, I developed wireframes to generate possible layouts for the website. Based on ongoing conversations and user testing, certain features were added or removed. A progression of key wireframes are shown below.
05 Develop
Coding
After several rounds of user testing, the website was brought to life with HTML and CSS. During this process I learned ran into some digital security measures which restricted certain files types. I was able to overcome these issues and found a way to allow proper formatting and responsive design while staying compliant with company policy.
06 Launch
Stakeholder Approval
The website was launched with the approval of the business program manager. I had tested the website across different platforms, operating systems, and devices to ensure proper usability. A few minor changes were made to the access-rights to allow anyone to review the page.
The launch of the new website marked the retirement of the legacy page. This website is now the starting resource for new program members and is championed by the manager of the program.
Lessons Learned
Understand Software Limitations - I acted as both the UX Researcher and Developer for this project. The lessons I learned during the later development phases could have informed my approach during data collection and design iteration. For example, knowing that the HTML previewer couldn't reference CSS files would have alleviated some initial debugging headaches.
Data-Driven Decisions - There were instances when the design requests of an alumnus or manager would conflict with my view of an on-boarding member's needs. Having data to drive design decisions helps navigate conversations when design opinions are in conflict.