Pateel Bedoyan
UX & Product Designer

McMichael Art Gallery

Development Pages Re-design

Image alt tag

My Role

Project, Content and UX Lead, Front End Designer

Project Timeline

September 2022 - December 2022

Tools

Adobe XD & Photoshop, Miro, Excel, Wordpress

Project Background

Home to the Art of Canada and the Group of Seven.

The Development pages of the McMichael Gallery are important public facing pages for the gallery as it houses information for membership, donation and sponsorship that support the funding and revenue generation for the gallery.

The content strategy of the development pages is to reflect a current and contemporary brand image focusing on diversity and inclusivity, while increasing membership and donations revenue streams.

McMichael Art Gallery

Project Scope

A complete review, audit and redesign, across 7 + 1 new Development Department pages, that fall under Join & Support:

  1. Support & Join main landing page

  2. Donation

  3. Membership

  4. Registration & Renewal

  5. Patron's Circle

  6. Women's Art Council

  7. Corporate

  8. Sponsorship

  9. Contemporary Art Circle (new page)

McMichael Art Gallery

Problem Definition

To create a more contemporary, inclusive, intuitive and accessible user experience across the Development pages.

Key areas:

  • The Development pages does not showcase current brand image and its diverse artists.

  • Membership tables and charts content format do not meet accessibility.

  • Page titles and name are not clear to all users, and not consistent with page URL: (membership -> registration & renewal)

  • Redundant pages with same information that could confuse users (Sponsorship and Corporate Membership)

  • Copy, headlines and CTA are lengthy and outdated.

  • Typography font style and colour don't meet UX and accessibility standards.

McMichael Art Gallery

Solution

To create an improved and accessible experience for targeted users as they navigate through the pages to find critical information about donations, membership and contact persons, and convert them to donations and membership registrations or renewals.

  • Modify information hierarchy across all Development related pages.

  • Include visible call to action for during user journey

  • Reduce click time and include only relevant information on the page.

  • Include readable charts and tables for accessibility.

  • Create clear page navigation menu names and links that are industry standard.

  • Correct broken links and outdated contact information.

  • Created consistent design and UI across all Development Pages

  • Condense pages where needed to avoid redundancy, duplication that may confuse the user.

  • Revise and update copy, headlines and CTA's.

  • Reduce lengthy copy, make content concise and relevant to the reader.

McMichael Art Gallery

Research Methods

I managed the project from end to end and I utilized internal and external resources to obtain relevant intel and apply my findings and expertise through the different milestones of the project. Given the limited timeframe and department budgets, I performed the following research methods:

Department Testing and Interviews

Met with each of the Development team members to understand their department , available donation and memberships programs, the target audience, needs and challenges of the current website, and goals for growth.

As a project lead, I held a general biweekly meetings with Development and Marketing teams, where we review website requirements, prototype iterations and findings, and suggest solutions.

McMichael Art Gallery

Competitive Review

I conducted a competitive review of relevant donation and membership pages across major Canadian galleries and museums, including the Royal Ontario Museum, Art Gallery of Ontario, Aga Khan and Glenbow Museums.

This review helped audit what the digital landscape looked like in the gallery and museum industry, ensure use of common terms and language that is familiar to users, while incorporate eleme

McMichael Art Gallery

Target users

The McMichael main demographic has consisted of older adults. Part of the gallery's new brand strategy is to attract younger demographic (Millennials) to the gallery by offering more current and contemporary programing.

For the development pages project, I incorporated elements of accessibility, sleek and modern design, as users require easy and intuitive navigation experience, with the goal of:

  • Retain and attract current and new gallery visitors and members across a diverse audience (adults, families, seniors)

  • Highlight the Gallery's diversity through works of contemporary, women and indigenous artists presented to donors, corporate sponsors and patrons.

Interviews and Usability Testing

Initial user testing and feedback have been conducted with the Development team and Visitors Services team who who handle visitor and donors inquiries and issues on a daily basis, and are familiar with their needs and pain points.

McMichael Art Gallery

Information Architecture

I created the site architecture of Development pages to review redundancy and content overlap. Reviewing the site map was an important first steps as there were duplicated pages with outdated design that may have been created overtime and links have not been updated or removed. Also, the user journey can be disrupted by some of these inconsistencies. The goal was to create an easy navigation for the target users to sign up or donate.

Below are snap shots of the previous and revised sitemaps for the developments pages.

Image alt tag

Old Development Pages Site Map

Image alt tag

Revised Development Pages Site Map

Wireframes

Created initial wireframes to provide a blueprint for the hi-fidelity prototype. Completing this step in the design process helped me to see the layout of the design and make quick iterations before transferring to prototype and further usability testing.

Prototype

Across the 7 newly created pages, I conducted usability testing in phases to ensure the project meets its initial requirements. Internal and departmental staff tested the prototypes before launching to the live site. I observed each participant as they completed the tasks and answered any questions they had. I welcomed any feedback and recommendation to improve the user experience of the product. Upon launch, I continued to collect user's feedback to make iterations to enhance the overall experience.

6
Interviews
5
Usability Tests
4
Iterations

Project Reflection

Having managed the entire project has allowed me to truly experience the design thinking process from identifying a problem, research, design, testing to production. Being a small team, I incorporated strong time management and organization skills to launch the project per the the set timeline.