A Visionary Design for a Net Zero Tomorrow – Navigating the Path to Sustainability

 In this important campaign project, I had the responsibility of leading both the design and development of the web pages right from the beginning. I worked closely with our leadership team to transform their ideas into a tangible wireframe, guiding them through the entire design journey. Subsequently, I dedicated meticulous effort to create both low and high-fidelity mockups, bringing life into the 'Navigating to Net Zero' podcast promotion campaign. The result was an engaging platform that allowed our customers to delve deeply into the campaign's content.

Company

Company

Macquarie Group

Industry

Industry

Financial

Tools used

Tools used

Figma, AEM

Worked with

Worked with

Content owners

Overview

During my involvement in the "Navigating to Net Zero" campaign, I played a pivotal role in enhancing the user experience (UX) for both the campaign's main webpage and individual podcast episode pages. My primary responsibilities included designing wireframes and prototypes to showcase the campaign's podcast series, along with constructing detailed episode web pages to offer users valuable insights into the podcast speakers.

Key project contributions

  1. Wireframes and Prototypes: I created wireframes and interactive prototypes using Figma. These design assets served as the foundation for the campaign's digital presence, ensuring a seamless and user-friendly experience.

  2. Campaign Webpage: I collaborated closely with marketing teams to gather essential content and information necessary for the campaign webpage. This collaborative effort allowed me to align the design with the campaign's messaging and goals.

  3. Episode Web Pages: I extended my UX work to develop dedicated episode web pages. These pages provided users with comprehensive background information about the podcast speakers, enriching their engagement with the content and fostering a deeper connection to the campaign's mission.

Problem Statement

For the "Navigating to Net Zero" campaign, our goal was to develop an engaging online platform focused on sustainability podcasts. We addressed UX challenges like organizing content, promoting user engagement, ensuring information accessibility, and collaborating with marketing teams. The objective was to create a user-centric digital experience, optimizing the overall UX for the campaign's web presence through well-structured wireframes, prototypes, and effective collaboration.

Research & Discovery

To craft a user-centric digital experience for the Navigating to Net Zero campaign, we conducted thorough research and discovery activities. Key steps included:

  1. User Research:

  • Developed detailed user personas representing diverse segments of the target audience.

  • Conducted user interviews to understand preferences, content habits, and challenges related to accessing sustainability content.

  1. Competitive Analysis:

  • Examined sustainability and podcast platforms for best practices and differentiation opportunities.

  • Analyzed how similar campaigns presented podcast content and speaker information.

  1. Content Audit and Strategy:

  • Collaborated with marketing teams to audit existing content and develop a strategy for effective messaging through the digital platform.

  1. Information Architecture:

  • Created an information architecture (IA) defining the structure and hierarchy of the campaign website.

  • Considered user flow and navigation paths for accessing and engaging with content.

  1. Usability Testing:

  • Conducted usability testing sessions to gather feedback on early design concepts.

  • Iterated designs based on usability test results.

  1. Content Gathering and Collaboration:

  • Worked closely with marketing teams to collect updated content aligned with the campaign's messaging and goals.

  1. Design Inspiration:

  • Drew inspiration from sustainability-focused websites and eco-friendly branding.

  • Collected design references to inform the visual style of wireframes and prototypes while adhering to brand guidelines.

  1. Accessibility Considerations:

  • Ensured adherence to accessibility guidelines, including providing alt text for images.

The research phase deepened our understanding of the target audience, refined content strategies, and informed the design process. This approach ensured that subsequent wireframes and prototypes were visually appealing, user-friendly, and aligned with the campaign's goals of promoting sustainability and environmental awareness.

Design

Wireframes Creation:

Developed low-fidelity wireframes as initial blueprints for the campaign webpage's structure.

Information Hierarchy:

  • Defined a clear hierarchy, emphasizing key content like podcast titles and speaker profiles.

  • Designed a user-centric navigation menu for easy webpage section access.

Visual Design:

  • Incorporated eco-friendly color schemes and sustainable imagery aligned with the campaign's branding.

  • Ensured readability with legible fonts and appropriate contrast.

Interactive Features:

Designed clickable buttons and call-to-action (CTA) buttons, incorporating hover effects for enhanced user experience.


Mobile Responsiveness:

Ensured responsive design for seamless user experience on desktop and mobile platforms.

Prototyping Phase:

High-Fidelity Prototypes

  • Created prototypes in Figma, including finalized design and interactive elements.

  • Prototypes featured clickable links to simulate user interactions.

User Flow Testing:

  • Conducted testing to evaluate user flows, navigation, and content accessibility.

  • Gathered feedback on interaction intuitiveness.


Iterative Design:

  • Made adjustments based on user feedback to improve overall user experience.

  • Addressed usability issues identified during testing.

Episode Pages:

  • Designed and prototyped individual episode pages for detailed speaker information.

  • Ensured easy access to speaker profiles and interactive insights into speakers' backgrounds.


Collaboration with Marketing Teams:

  • Maintained close collaboration with marketing teams for content alignment with campaign messaging.

  • Incorporated real-time updates and revisions into prototypes.

  • Reviewed and approved final design elements for consistency with the campaign's branding.

The design and prototyping phase resulted in high-fidelity prototypes representing the campaign's visual identity. These prototypes offer a user-friendly platform for exploring and interacting with Navigating to Net Zero podcast content and speaker profiles. They serve as the foundation for subsequent development and implementation of campaign webpages.

Implementation Phase

Communication and Feedback:

  • Conducted design review meetings with the development team, emphasizing critical design elements.

  • Supported QA by addressing design-related issues to ensure the final product aligned with design specifications.

  • Content Integration:

    • Assisted in migrating and integrating content, ensuring accuracy and efficiency.

    • Established a process for seamless content updates to accommodate dynamic podcast content and speaker information.

  • Final Review and Validation:

    • Conducted cross-functional reviews to validate the implementation against project goals.

    • Collaborated on User Acceptance Testing (UAT) with marketing teams and end-users.

Results

Increased User Engagement:

  • Post-launch, metrics showed significant improvement in time spent, page views, and click-through rates.

  • Reduced Bounce Rates:

    • User-centric design strategies contributed to decreased bounce rates on both the campaign webpage and episode pages.

  • Enhanced Conversion Rates:

    • Improved call-to-action buttons and content accessibility positively impacted conversion rates.

Qualitative Results:

  • Business Impact:

    • Achieved greater campaign visibility and sustainable growth in subscribers and followers.

Challenges

Balancing Design Aesthetics with Accessibility:

  • Adopted a "progressive enhancement" approach, prioritizing accessibility and usability.

  1. Iterative Design Challenges:

    • Embraced iterative design, establishing regular feedback loops for prompt issue resolution.

  2. Managing Cross-Functional Collaboration:

    • Implemented agile project management methodologies for effective communication and flexibility.

Lessons Learned

  1. User-Centered Design is Paramount:

  • Prioritized user needs and feedback throughout the design process for better outcomes.

Accessibility is a Core Design Principle:

  • Integrated accessibility into the design process from the outset.

Effective Collaboration is Key:

  • Collaborative communication, especially between design, development, and marketing teams, is fundamental.

Adaptability Drives Innovation:

  • Embraced the iterative nature of design and development for innovation and improvement.

Conclusion

The Navigating to Net Zero project showcased our commitment to user-centric, accessible, and collaborative design practices. The journey, marked by challenges and lessons, resulted in increased user engagement, reduced bounce rates, and improved conversion rates. The positive outcomes reaffirm the power of design in driving meaningful change and contribute to a more sustainable future. The project's impact on our approach to UX design and understanding of sustainable initiatives will continue to shape our future endeavors. This case study serves as a testament to the importance of design in fostering user engagement and contributing to a net-zero world.

Vivienne Ho

Vivienne Ho © 2024.

Vivienne Ho

Vivienne Ho © 2024.