Clearcom
Re-platforming the existing digital product to create a more user-friendly interface, optimize performance, and align with WCAG's AA standards for accessibility.
Type
UX consulting, Design systems, Accessibility
Team
Nagasai Vardhan — UX Designer
Fernando Acevedo — Supervisor
Emma Rizzo — UX Writer
Agency
ITX Corp
Overview
Technologies that connect teams
Clearcom empowers customers through market-proven communication technology, providing broadcast solutions globally
Problem
The website hosts technical information about their products and also provides downloadable manuals, datasheets, and software updates but the experience of accessing the data did not meet user expectations.
Process
Empathize
Define
Ideate
Design
Usability analysis
Stakeholder interviews
Analyze pain points
Synthesize and document
Present to client
Problem statement
HMW statements
Lo-fi designs
Technical feasibility
Present to client
Design systems
Information architecture
Hi-fi design for web and mobile
Present to client
Empathize
Usability analysis and
stakeholder interviews
User insights
Issues
Users are professionals & familiar with clear-com products
Seeks quick and straightforward website experience
Easy support access for a seamless user experience
Users were not able to navigate through the website
Difficulties accessing and downloading product-related files
Complex content filtering system
The website is not compliant with WCAG 2.0 AA Standard
Strategy
Building a scalable style guide that is accessible
Making intuitive user flows and choosing the right UI pattern
Rearranging the information architecture
Design
01
Information architecture
Pain points
Certain links were strategically placed under multiple menu items to address the user’s difficulty in locating them within the menu
Inadequate menu structure posed challenges for users in recalling and locating menu options
02
Resource filtering page
Pain points
The page had a dual filtering system, but users could not utilize it
Users struggled to identify the page location and found excessive and confusing tags
03
Download center page
Pain points
Users struggled to filter search results by content type, resulting in a time-consuming browsing experience
Despite having a search bar, users had to manually scroll through multiple pages to find specific product versions, causing frustration
Users encountered difficulties accessing and downloading product-related files when offline or in areas with limited internet connectivity
Approach
Design system
Atoms
Elements that ensure consistency and style for a seamless user experience
Molecules
These UI components systematically combine atoms, creating cohesive and functional structures
Organisms
Pre-built interface blocks composed of molecules, providing ready-to-use components for a consistent design
Atoms
Grids
Color System
Updated the color system to adhere to WCAG AA standards, ensuring accessibility for a wider range of users with varying visual abilities.
Type System
Visual hierarchy is created using type weights, effectively emphasizing important elements. For smaller-sized text, the Inter typeface is recommended due to its broader and taller letterforms, enhancing readability and legibility