PROJECT
Hyland Community Web and Mobile Re-Design

Hyland Software is the developer of a leading enterprise content management and process management software suite called OnBase. 

Based in Westlake, Ohio, Hyland Software has over 30 offices located around the globe. 

Applications of the suite are used in healthcare, financial institutions, insurance, government, higher education and manufacturing.
MY ROLE
I was a User Interface and User Experience Designer and reported to the Product Manager. 

Worked closely with the team of developers and spent a lot of time in our usability lab to monitor the testing processes alongside our User Experience Manager. 

Developed UI mockups and prototypes that clearly illustrated how the Community website functions for our team. Created graphic elements, such as badges, menus, tabs and widgets.

Conducted layout adjustments based on user feedback.
HYLAND COMMUNITY
PROBLEM STATEMENT
Hyland Community website had grown organically on Telligent Community platform to provide modern community applications such as forums, blogs, wikis, ideation, media galleries, and calendars. 

The website needed a visual refresh and greater flexibility for its content. I had to recreate the "local" and "global" navigation systems to improve the content findability by users. A top priority was for everyone to have access regardless of ability, context, or situation. 

I wanted to boost user engagement with gamification methods to create a feeling of achievements by users. 

I designed and managed to implement our first instant messaging feature on the Community website to improve the quality of communication. 
APPROACH
The largest challenge going into this project for our team was scope, so I had to be incredibly resourceful with where I focused my time.

With that in mind, I figured that the priority was to focus on forums, the global (site-wide) navigation system and the local navigation systems which allow users to explore the immediate area.
FOCUS GROUPS
I met with the head of technical support department and some of our employees that were highly engaged with the Community website. 

The purpose of the meeting was to discuss the problems they were facing while interacting with the Community website and took notes on what they had to say to improve the website.
PAIN POINTS AND GOALS
NOTES
Hyland's technical support department is a vital element of the Community website. I wanted to create a better experience for them to improve the quality of customer support. 

The team was often buried in support tickets and live chats, answering the same questions over and over again, it was incredibly frustrating. 

I decided to dedicate a library of information (Knowledge Base) in the website about our products and services.

Negative feedback was often ignored. They were conscious of our hierarchical system’s order, believing that it was not working perfectly. 

The goal was to recreate the organization, labeling and navigation systems to optimize the search engine. 

I wanted to create a more controlled environment with the potential to not only solve problems, but strengthen relationships.
DESIGN
RESEARCH METHODS
Deep understanding of a target audience is fundamental to creating an exceptional platform. 

Personas helped my team find the answer to one of our most important questions, “Who are we designing for?” Empathy was my core value. I wanted to identify and gain a perspective similar to the end user's. 

I conducted a series of usability testing sessions in the lab to observe real users interacting with the Community website and mobile. 

Users were asked to complete a few tasks, while being observed by our UX Manager and myself. We wanted to see where they encounter problems and experience confusion. 

Performed a few card sorting sessions to redesign our information architecture systems. 

The goal was to help users find information fast by focusing on organizing, structuring, and labeling content in an effective and sustainable way. 

I created High-fidelity prototypes in order to gain more meaningful feedback. I had a solid understanding of what to build and started testing the prototypes with the real users right away. 

I checked the accessibility of the design using the axe chrome extension and found 17 violations that I needed to solve on the forum page alone. I was able to fix them in a few days by raising the issues to the developers.
PERSONAS
USABILITY TESTING
MORAE SOFTWARE
I used Morae for our usability testing sessions. I had it set up in the lab to observe the users in person or remotely. 

Each user had a few tasks with instructions to complete and I captured audio and on-screen activities for further studies. I often had my peers to join me in the lab to observe and share their ideas with me. 
TESTING SESSIONS
The goal of usability testing was to identify any usability problems with the design. I monitored our users to learn how fast and easy they accomplish tasks. 

Ran many testing sessions and, as a result, found some interesting facts about my design. While some results were anticipated, a few of them ended up surprising me!

Users had issues with their profile settings. They could not find the edit button easily. So on the next sprint, I made the edit button noticeable both on desktop and mobile. 

The bell icon in the top right corner of the website changed color from white to orange with new notifications. However, I found out that users did not notice it. Therefor I decided to change the design by keeping the bell icon white and adding a red circle with the number of pending notifications.

Users had a lot of problems finding information. I had to ask them to move on to the next task. Next step was to completely re-design the information architecture and fix the search engine.
ACCESIBILITY TESTING
I found out that participants who had low vision could find it difficult to read text from a background color with low contrast. 

Users with low visual acuity or color blindness had a hard time understanding the content that was not labeled and they often seemed lost using forms with placeholder text as labels. 

I noticed that users who used screen readers navigate through forms using the tab key, therefore any non-labeled text, as placeholder text was usually skipped over. 

In order to fix the accessibility issues, I labeled all of the form fields inside and outside of the placeholders and used WebAIM to check the foreground and background color contrast with web accessibility in mind. 
INFORMATION ARCHITECTURE
OPTIMAL WORKSHOP
I ran a closed card sorting session to identify what sections of the Community website were accessed most often and least often. 

Used Optimal Workshop for the card sorting sessions by involving Hyland customers from various business areas that were occasionally interacting with the Community website. 

I knew that the new navigation system should present the structure of the hierarchy in a clear and consistent manner. Users needed to know the current location so I created a breadcrumb menu. 

Tried to prioritize content in a way that worked for the widest possible group of users. 

Ran an open card sorting session with OptimalSort to figure out the categories. For this session I invited the head of technical support and our highly engaged developers with the Community website. 

I created information architecture site maps and dendrogram diagrams to present the results to the stakeholders.

Presented a systematic hierarchical view and clustering of the Community website with sitemaps and dendrogram diagrams to create the prototypes for testing. I used Adobe XD to create high fidelity mockups.
PROTOTYPE . TEST . REPEAT
GAMIFICATION
In order to improve the quality of the Community website, I had to find a way to keep the users engaged. I decided to create badges that users could earn reaching milestones or completing courses. 

User engagement improved dramatically right after my team launched the badges. They made the users feel important and skilled and since they were visible on public profiles, my team started seeing more visitors among our employees and Hyland customers. 
COMMUNICATION
I wanted to improve the way customers and employees communicated through the Community website. In addition to that Instant Messaging provides real time communication that is not as intrusive as when you are using a phone. It is a perfect way of communication in a business space.

I had a good combination of user feedback data and metrics to start working on this feature. I knew that it will have a positive impact on the community website.   
LESSONS LEARNED
Even though I asked users direct questions, they usually didn't reveal what they actually thought. They were either too nice to tell me or just wanted to finish the testing sessions as fast as they could to get on with their lives. 

So I used my intuition to understand what they really meant. Monitoring them live helped me a lot to see their moves.

I learned to appreciate any feedback, positive and negative!
OUTCOME
When I joined Hyland Software, the Community website had only 25% of the 15,000 customers and 3,500 employees engaging with the website. 

At the end of this project which took about a year, user engagement improved by 72%! 

Metrics are based on session duration over two minutes for each user. 
LATEST DESIGN

OTHER PROJECTS