XELGUIDE

Design and writing standards for XELJANZ.

  • The Product

    XELGUIDE is a communication tool that maintains consistent branding across indications and customer segments. This is a style guide website for XELJANZ that approaches communication from a positive perspective, educating patients on how XELJANZ can put them back in touch with the things and people they love, rather than trying to connect with patients through their suffering or symptoms.

  • The Problem

    The existing XELGUIDE has become outdated, prompting me to update the layout. Consequently, I've devised wireframes that cater to both newcomers to XELGANZ and creative individuals seeking a refresher. These wireframes aim to provide a user-friendly interface, ensuring easy access to essential materials.

  • Skills

    Competitor Research, UX Design, Figma, Service Design, Sharepoint, Mira

    Duration: 3 months

Competitive Audit

Integrating a competitive audit with Mira into the process of creating wireframes for a pharmaceutical drug style guide brought forth numerous advantages. By examining the design and user experience of competitors' style guide websites, I gained valuable insights into industry standards and prevailing design trends. This analysis provided the opportunity to identify successful design elements and functionalities that resonated with users, enabling their seamless incorporation into the wireframes of the style guide. Equally important, the audit shed light on usability issues and pitfalls faced by competitors, empowering me to proactively avoid similar challenges. This approach ensures a smoother user experience and elevates the overall quality of the style guide.

Furthermore, drawing inspiration from innovative features observed during the audit encouraged the integration of fresh and engaging design elements into these wireframes. As I progressed through this process, a user-centered design perspective emerged, aligning these wireframes more closely with the needs and preferences of those seeking pharmaceutical information. By recognizing common design elements in the industry, the audit assisted in ensuring consistency within the style guide, while also guiding it towards areas of differentiation that could enhance the user experience. Ultimately, the insights gleaned from the competitive audit facilitated informed communication with the team and stakeholders, providing a robust foundation for well-justified design decisions throughout the wireframing process.

Pain Points

  • Required the integration of new navigation bar pages linking to the XELGANZ website, as well as a dedicated page for essential materials like important safety information regarding the drug.

  • Formatting was not consistent across all pages and needed to be made more uniform.

  • The content necessitates updating to align with current design standards and resources frequently referenced by employees.

  • While the website demonstrates certain accessibility features, there is room for enhancement through the integration of well-defined borders and a more coherent information architecture.

Site Map

Wireframes

Updated elements included are

  • This should be the Color Palet.

  • New Navigation that included a new page for important resources, archived materials, and an external link to the XELGANZ website.

  • Borders clearly laid out ideas that were designed to be grouped together

    • ex: icons, typography, drug info, etc.

  • Timeline to visually show previous projects done for XELGANZ over the years to serve as guidelines and inspiration.

Takeaways

This marked one of my initial significant endeavors, offering a valuable learning experience under the guidance of mentors at Wunderman Thompson. I gained expertise in crafting UX wireframes within a corporate setting for a prominent pharmaceutical enterprise. During the final website development phase, the decision was made to utilize Sharepoint, effectively minimizing the required development efforts for site publication. Numerous design elements couldn't be shared here due to licensing restrictions.

Next Steps

  1. Gain and implement further feedback in regard to content and organization.

  2. Perform usability tests on someone new to marketing for XELGANZ vs. someone who has been with the brand for some time.

LOW-FIDELITY MOCKUP

LOW-FIDELITY MOCKUP

Final Prototypes are protected by an NDA, kindly reach out for more information.