Empower® 2023 Conference

• Objectives
• Solution
• UI/UX Testing
• Summary

Objectives

Empower 2023 marked Laserfiche's first in-person conference post-COVID, requiring the creation of a multi-purpose website to balance promotion and information dissemination. The event spanned three diverse locations: Texas, California, and Florida. Additionally, it marked Laserfiche's first use of the CVENT platform, requiring rapid proficiency. Platform limitations led to the development of four tailored CVENT event websites for each city, alongside a cohesive umbrella site. Our primary focus was to promote the event while maintaining a unified visual identity across all web properties.

Solution

Design

Implementing Established Design Frameworks

In my role as an in-house designer, I joined a team where user flows, personas, and testing were already established. I focused on implementing these frameworks, translating research into tangible experiences. While I didn't create these elements, I ensured my designs aligned with goals and user needs. Unfortunately, due to non-disclosure and confidentiality reasons, I'm unable to provide specific examples.

Brand Extension

At Laserfiche, we took pride in our users, fostering a sense of community and belonging often referred to as the "Laserfiche family." In line with this ethos, I spearheaded the creation of a brand extension for this project. I infused the event's website with a vibrant and engaging design to underscore its community-centric atmosphere. My primary goal was to elevate the website's appeal by integrating elements that resonated with the essence of the event—nurturing networking, championing learning, and embracing the spirited party ambiance. This encompassed meticulous selection of visual elements, color palettes, and typography to effectively convey the desired tone and message.

Design Implementation

As the lead designer, I was responsible for crafting the overall look and feel of the website, ensuring that it aligned seamlessly with the event's branding and objectives. This included sourcing and curating site photography to evoke the energy and excitement of the event, as well as applying touch-ups to enhance visual appeal. One of the key aspects of my role was determining the hierarchy of information on the website. Drawing from my design expertise and insights gathered from previous Empower conferences, I strategically organized content to optimize user experience and engagement. This involved prioritizing essential information such as event details, schedule, and registration, while also highlighting key features and attractions to entice visitors. Overall, my contributions to this project encompassed not only the visual design aspects but also strategic decision-making based on customer feedback and industry best practices. By leveraging my design expertise and understanding of the event's goals, I was able to create a compelling and effective website that resonated with attendees and contributed to the success of the event.

Collaborative Story Building

The Empower website project began with a blank canvas, devoid of both theme and content. As the request came in, the initial approach was to create templated elements, providing a structural foundation. Upon the selection of the conference theme, I was partnered with the lead copywriter, initiating a collaborative journey to give the site narrative depth and clarity. Through numerous working sessions, we meticulously dissected the essence of Empower, sculpting its story to resonate with the audience. Our goal was twofold: to elevate registration rates and to ensure clear communication with users. This close collaboration fostered a dynamic synergy, allowing us to craft a website that not only informs but also inspires action.

Cross-Platform Design Consistency

Complementing our design and technical milestones, I spearheaded several ancillary initiatives. Crafting a captivating 'Coming Soon' splash page set the stage for anticipation, while developing assets for the CVENT App ensured seamless integration and enhanced user experience. Collaborating closely with the design team, I orchestrated a unified and recognizable identity for the graphics and themes across web, video, and print design for the event. These diverse responsibilities underscored my commitment to delivering a comprehensive and cohesive event experience.

Project Management as Design Lead

I take great pride in my role as project manager for the web properties associated with Empower 2023. My responsibilities encompassed a wide array of tasks, including addressing intake, design, development, technical challenges, overseeing content development, managing scheduling, and conducting thorough design reviews with stakeholders. To ensure seamless execution, I meticulously crafted and executed a 4-month project schedule, drawing from initial outlines provided by our Events team, guiding the project to successful completion.

Development

In embarking on the development phase, we encountered various challenges that required innovative solutions and meticulous attention to detail. Navigating the constraints of the CVENT platform posed notable technical hurdles:

• Overcome limitations posed by restricted CSS and JS capabilities.
• Ensure seamless navigation between the different event sites with custom drop-down menus.
• Implement robust tracking mechanisms to monitor user activity effectively.

Custom CSS Extensions

CVENT allows for basic customizations with their theme designer tool, but it isn’t built for fully customized websites. In order to extend the CVENT template styles, I needed to assign unique classes to each widget type, its sub-elements, and the sub-parts of those elements. I utilized BEM methodology, short for Block Element Modifier, to be able to navigate the sheer size of classes required. This strategy allowed me to maintain uniform styling across the required 4 event websites.

CVENT's limitation in copying elements between events posed a challenge. To overcome this obstacle, I adopted a sequential approach, completing one site before cloning it to each state, ensuring consistency while mitigating redundant effort. Throughout the project, as style elements evolved, from navigation to content layout and registration flow, I remained vigilant in ensuring uniformity across all sites. Despite the necessity for manual updates with each iteration, the meticulous implementation of the master CSS file facilitated cohesive and visually appealing websites tailored to the unique requirements of each state, demonstrating adaptability and problem-solving prowess within the constraints of the platform.

Navigation

Ensuring seamless navigation across the site required innovative thinking, particularly in implementing a drop-down menu functionality, which isn't natively supported by CVENT. Initially, I crafted a CSS-only drop-down menu to sidestep the need for JavaScript. However, integrating it with the menu elements posed a challenge due to JavaScript limitations within the platform. Unable to place inline JS code in the event itself, I discovered I could add a line of code to the GTM script that could inject an external JS file via DOM manipulation.

This allowed me to remove the standard navigation widget and replace it with a text list element instead. Since individual CSS classes can’t be added to text elements in CVENT, I had to get creative. I strategically applied text formatting (bold, underline, strikethrough, superscript, and varying font sizes) I was able to create targetable HTML elements. Leveraging pseudo-CSS, I successfully transformed the text into the desired drop-down menu appearance while adhering to platform constraints. This approach ensured a seamless navigational experience for users.

Tracking

The final hurdle was devising a method to track user engagement across the four sites. While CVENT offered integrated tracking, it was restricted to individual events or sites, falling short of our cross-site tracking needs. To bridge this gap, I uncovered an elegantly simple solution leveraging unconventional tagging techniques within Google Tag Manager (GTM).

Implementing this solution involved creating new GTM variables, triggers, and tags meticulously orchestrated to distinguish between the four sites. The culmination of this effort involved deploying sniffer JavaScript to pinpoint specific on-page elements, JavaScript variables capable of distinguishing between the four sites, and a specialized tag tailored for the confirmation page. This comprehensive approach not only facilitated seamless cross-site tracking but also provided valuable insights into user engagement across the entirety of our online presence.

UI/UX Testing

To optimize UX on the Empower website, I led thorough UI/UX testing with Laserfiche colleagues in two phases. Firstly, we honed the messaging, using a set of tester questions to assess prototype interaction. Minor adjustments were made, such as relocating sections from the homepage to L2 pages. However, the content and narrative, crafted in tandem with the lead copywriter, stayed largely unchanged and resonated with our audience.

Our second phase utilized a systematic approach where I created a detailed spreadsheet with sheets for each of the four websites. These sheets outlined every page and step of the registration process. By gathering feedback from this testing phase, I gained invaluable insights into areas for improvement. This feedback was instrumental in enhancing the UI of the navigation system and refining the messaging throughout the registration journey. Through iterative testing and refinement, we were able to make significant enhancements that positively impacted the overall user experience of the Empower website, ensuring a seamless and intuitive interaction for our users.

Summary

• Led development of Laserfiche's inaugural post-COVID in-person conference website spanning three diverse locations: Texas, California, and Florida, utilizing the CVENT platform for the first time.
• Spearheaded the creation of a vibrant brand extension, fostering a community-centric atmosphere and enhancing event appeal through meticulous design selection and integration.
• Orchestrated the design implementation process, ensuring seamless alignment with the event's branding and objectives, while strategically organizing content to optimize user engagement.
• Managed cross-platform design consistency, crafting captivating 'Coming Soon' splash pages and coordinating unified graphic and thematic identities across web, video, and print mediums.
• Overcame technical challenges of the CVENT platform by developing innovative solutions, including custom CSS extensions and creative navigation implementations, ensuring a seamless and engaging user experience.
• The success of the project hinged on my ability to work cross-departmentally with the following teams: Creative, Lead Generation, Customer UX, Events, Infrastructure, and IT.