I led the website redesign, focusing on accessibility, responsiveness, and user engagement. We prioritized a mobile-first approach, starting with mobile wireframes, and gathered insights through surveys distributed to our internal teams.
Digital Marketing Manager
Director - Marketing Program
Full Stack Web Developer
September 2022 to February 2023
Figma, Adobe Photoshop, Adobe Illustrator, Framer, Typeform
As a UX designer for Doxim, I lead in shaping an exceptional user experience. My process begins with in-depth user research, guiding the design to meet specific audience needs. I prioritize web accessibility, ensuring the site is usable for all. Through strategic interactions and rigorous user testing, I refine the user journey. My work involves creating visually compelling designs, structuring the site with wireframes, and detailing designs through mockups. These evolve into interactive prototypes, allowing for thorough testing and iteration before finalizing the user-centric Doxim website.
In 2022, the team made the definitive choice to embark on another website redesign. I was entrusted with leading the website refresh project, collaborating with a skilled developer, to ensure that the company's website adhered to Accessibility standards and successfully passed all required accessibility checks. This time, our objective was not only to enhance the site's responsiveness but also to refine the navigation categories and ensure that the call-to-action buttons remained consistently accessible to foster user engagement and encourage conversions. In this instance, I chose to adopt a mobile-first approach, where I began by designing the mobile wireframe before moving on to the desktop version. Prior to delving into wireframes, conducting user research on the current website is an essential step. The team made the decision to distribute a survey among the Sales, BDR, and marketing teams, with the aim of gathering insights from our internal users.
Where can I locate the webinar? Where should I look for the eBook or whitepaper relevant to my industry?
Sometimes I struggle to locate the resources I need; the website feels outdated, reminiscent of the 1980s.
According to the user survey, the majority of users visit the website at least once or twice a week. Some users access it daily and have expressed confusion regarding the extensive items within the mega menu. On the content side, users encountered challenges in locating documents and information, largely due to the existing content categorization, which proved to be user-unfriendly. Furthermore, the website was not particularly welcoming to prospects, with an excessive number of sign-up forms and call-to-action buttons. From a visual perspective, the website design appears outdated and lacks a modern look and feel. The presence of a horizontal scroll further complicates the navigation experience.
Addressing these pain points is crucial in designing a user-friendly website that caters to a broad audience, enhances user satisfaction, and ultimately drives engagement and conversions.
The website's complex structure, inconsistent navigation, and outdated design hinder user engagement and accessibility. The overwhelming number of forms and CTA buttons, coupled with non-compliance with accessibility standards, further alienate users, especially on mobile devices. These issues collectively compromise the user experience, potentially affecting the brand's credibility and conversion rates. Addressing these pain points is crucial for creating an inclusive, user-friendly, and efficient online presence.
The next phase I implement is creating a user journey map for the website, as it helps me understand users' needs and address pain points, allowing me to design an intuitive and user-friendly experience.
Following creating a user journey map, the next crucial step is to develop the information architecture with the team. This is a vital process that enables me to enhance the current website navigation. Establishing a coherent information hierarchy simplifies how users perceive the relationships between various pages and sections of the company's site. Furthermore, for this project, I've chosen to adopt a mobile-first approach. The information architecture proves instrumental in crafting a mobile-friendly design, guaranteeing a responsive and accessible user experience across various screen sizes.
Adopt a responsive, mobile-first design approach. Ensure the website is fully functional and aesthetically pleasing on various devices, especially smartphones and tablets, with touch-friendly menus and readable content.
Redesign the navigation menu to be consistent and user-friendly. Include breadcrumb trails and clear category labels, ensuring users always know their location on the site and can navigate back easily.
Streamline the number of forms and CTAs, focusing on the most critical actions you want users to take. Ensure each CTA is clear and compelling, guiding users naturally through the conversion funnel.
Comply with web accessibility standards (AODA, ADA and WCAG) to make the site usable for everyone. Include features like alt text for images, keyboard navigation, and screen reader compatibility.
Update the visual design to be more contemporary and align with modern web standards. Use clean, appealing aesthetics that reflect the brand's identity and enhance user engagement.
Implement a cycle of user testing and feedback to continually refine the user interface and experience. Use the insights gained to make informed adjustments, ensuring the website meets the users' needs and expectations effectively.
In a short period, I developed the mobile wireframe, laying the groundwork for our new mobile site while anticipating further enhancements. This project was a significant endeavor; alongside a developer, I balanced this initiative with demands from sales and marketing, tackling an expanded role that included branding, presentations, video production, statement redesigns, and tradeshow materials. Regular meetings with our managers and the Vice President allowed us to align on progress and insights. Ultimately, the decision was made to forgo a traditional prototype, opting instead to construct the site directly in the staging environment. This approach streamlined the process, allowing us to move efficiently from staging approval to launching the site live, marking a shift in our typical development workflow.
I conducted two rounds of usability studies, a valuable practice that offered crucial insights to refine my wireframe design and enhance the overall user experience.
Based on the insights from the usability studies, I promptly tackled the issues and made necessary adjustments to my design. This involved ensuring that the menu and CTA buttons remained consistently visible on the mobile screen, making it easier for users to access the CTA. I also implemented a "back-to-top" functionality, enabling users to quickly return to the top of the page, both on mobile and desktop versions.
Additionally, I chose to enhance the desktop site's interaction elements by establishing clear standardization and categorization, distinguishing between clickable and non-clickable elements. To facilitate the developer's workflow, I also provided all visual elements, including images and icons, for easy export and seamless integration into the website.
Please check out the live site at https://www.doxim.com/ (The site may undergo alterations to meet the company's evolving needs after my departure.)
We prioritize accessibility in our digital environment to create an inclusive space for all users, including those with disabilities. Our efforts include optimizing web content and applications for compatibility with screen readers, featuring descriptive alt text for images, and structuring content for screen reader accessibility. Our website design also adheres to our branding guidelines, incorporating high-contrast color schemes to improve readability. We are meticulous in crafting user interactions, ensuring button text and links are descriptive and clear, and providing meaningful alt text for images to cater to users with visual or hearing impairments. Additionally, our design maintains a consistent layout and style throughout the site, aiding users with cognitive or learning disabilities in navigating and engaging with our content effortlessly.
The website undergoes a significant transformation with a central focus on establishing a clear and user-friendly information hierarchy, ensuring content is effortlessly accessible. Navigation elements are thoughtfully reevaluated and enhanced to simplify user comprehension and streamline the browsing experience. A contemporary and appealing redesign in harmony with current design trends and user expectations enhances both aesthetics and usability. Additionally, a critical review results in the reduction of forms and call-to-action buttons, eliminating clutter and fostering a more user-centric interface. Most importantly, the website commits to full compliance with accessibility standards (AODA, ADA, WCAG), ensuring inclusivity and accessibility for all users, including those with disabilities.
This journey has underscored the critical importance of digital accessibility, particularly for individuals with disabilities, emphasizing adherence to standards like AODA, ADA, and WCAG for inclusivity. A well-organized information hierarchy and simplified, user-friendly navigation are key to enhancing the user experience. Balancing contemporary design with functionality remains vital, ensuring an aesthetically pleasing yet practical interface. Streamlining forms and CTAs further declutters the space, prioritizing user-centric interactions. Recognizing the need for continuous evolution, regularly updating design and accessibility practices is essential to maintain a relevant and accessible digital space. Overall, this experience highlights the significance of accessibility, user-centered design, and constant refinement in creating a comprehensive and welcoming digital environment.