List Pages Redesign
Project summary
Tasks: Web Design, UI/IX Design, Visual Design, Creative Direction
Client: Act-On Software
Year: 2018
Overview
As with most B2B & B2C websites, Act-On’s website included various pages that listed resources, showcased customers, and curated press and news. Unfortunately, through years of re-branding and redesign, most pages were outdated and the UX became fragmented. I was brought in to come up with a more elegant and consistent design and experience.
The challenge
The following were examples of Act-On’s previous resource library, success story page, and news/press landing page which represented pages that showcased news items, content, resources, case studies, etc.
Key Issues identified:
- Dated & unappealing look and feel
- Navigation was not intuitive
- Fragmented experience and inconsistent UI
- Key content got buried; certain content is hard to find
- Not every responsive
Click on the image to browse 3 examples:
Approach
Using a universal card UI, I was able to create a more unified look and experience throughout the entire site that can be leveraged beyond the original 3 pages that were intended to be redesigned.
Using global UIs such as tabs and side filters also significantly improved the user experience. It enabled users to quickly view, drill-down and filter through various categories.
For important and event content, a hero banner up top served to bubble up this critical piece of content.
One other important feature I added is a filter by topic section. The idea is that a lot of people may not really care what format the content is in so category tabs like ebooks, videos, podcasts, etc. may not be as useful. Topic filters let users view topic contents regardless of media or format.
Results
The result was a template that addressed the original issues and more:
- A UI that is consistent across page and page categories creating a more seamless user experience.
- Content that previously got buried now tend to get level or better exposure
- Users were able to quickly find relevant information they needed based on their intent and interest.
- More appealing content thumbnails add visual interest
- A more responsive layout.
Click to browse 3 examples:
Let's connect
Email me at audie(dot)roldan(at)gmail(dot)com or connect with me via social media.