Support Center Redesign
I worked on drafting what a redesign of the Givelify Support Center could look like. I designed a new hierarchy for the site, and created high fidelity wireframes of what that new site could look like for top-level pages.
Challenge
Our Support Center was in need of attention, it had remained unchanged for a while due to other projects taking precedence. The Support Center suffered from these key areas.
- Information architecture and navigation were unintuitive.
- Many duplicate pages existed.
- Pages were outdated and some information is now incorrect.
- Design system is outdated and unappealing.
- Strange elements appeared onscreen, such as empty buttons and images with no context.
Questions
- How can we rearchitect the site so that the hierarchy of pages makes sense?
- How can we reorganize the site so that both Donors* and Donees** can troubleshoot successfully?
- How can we reduce the need for duplicate pages?
- How can we build the credibility of our Support Center while not creating more work for developers to create more documentation?
- How can we recreate the design system on the Support Center without creating a huge amount of work for developers?
Process
- Analyzing and ideating on how to solve the most fundamental issues, hierarchy, navigation, and duplicate pages. The most appealing solution was to essentially split the site into two parts, one for donors, one for donees. This would reduce the amount of duplicate pages from as many as 4 duplicate articles per original article to 0.
- Going back to the drawing board for the categorization of articles. The old articles were categorized by type of user, and left uncategorized after that. So, now that users can only fall under 2 user types instead of 5, the remaining articles can be categorized by area. Categories for donors were easily sorted into 4 pillars of content, but categories for donees could only fit into 6.
- Design Exploration begins. The general user flow is modeled, and a low-fidelity wireflow is created. At this time, I revisited the categories, and minimized the existing 6 categories into 4.
- Based on exploratory materials, I begin designing an end-to-end user journey for a organization. This user starts at the primary landing page, where they select they are an organization. They then search for "account help", then click on an article. Unable to find the help they need, they fill out a support request form.
- I create 5 high-fidelity wireframes for the user journey to exhibit the new design. These wireframes represent the typical organization user journey, with the added support request if their problem isn't resolved with articles/documentation.
Solution
Created to revise the current issues without creating a large amount of work for developers, I revamped the site information architecture, and created a wireflow map, user flow map, and high-fidelity user user journey.
Initial Brainstorming & Process
Donee Category Redesign
User Journey
User Journey Wireframes