top of page
Textile Museum of Canada
Textile Museum of Canada
Client Redesign
I worked with the Textile Museum of Canada to redesign their company webpage, improve their website structure and optimization their navigation system. Additionally, the museum wanted to shift the website to an educational platform that could be used for a research purposes.
TEAM
3 Designers
ROLE
I conducted card sorting sessions, developed an information architecture, and crafted a responsive mobile navigation design.
SKILLS
Card Sorting
Content Strategy
Navigation Design
Prototyping
Information Architecture
PROBLEM
The existing website structure made it difficult for users to access key information about programs, community outreach, museum tickets, and donations. Users often struggle to navigate the site and, as a result, frequently call to complain about trouble completing essential tasks like purchasing tickets.
OUTCOME
A redesign of the museum's website that highlights its collection and introduces a filtering system and search features, making it easier for users to find what they’re looking for. I restructured the primary navigation to better align with users' mental models. Lastly, I added a dedicated education section to make the platform more effective for students across various generations.
DESIGN PROCESS
DESIGN PROCESS
DESIGN PROCESS
DESIGN PROCESS
DESIGN PROCESS
DESIGN PROCESS
DESIGN PROCESS
A redesign of the museum's website that highlights its collection and introduces a filtering system and search features, making it easier for users to find what they’re looking for. I restructured the primary navigation to better align with users' mental models. Lastly, I added a dedicated education section to make the platform more effective for students across various generations.
TEAM
3 Designers
ROLE
I conducted card sorting sessions, developed an information architecture, and crafted a responsive mobile navigation design.
SKILLS
Card Sorting
Content Strategy
Navigation Design
Prototyping
Information Architecture
Users
TARGET USER GROUP
USER GOALS
Engage with interactive content to supplement learning
Easily find relevant information like tickets, hours, and contact
Navigate through the museum’s comprehensive services
FINDINGS & RESULTS
7 of 10
Of users expect to purchase tickets under “Visit.”
9 of 10
Of respondents believe “Visit” should be a main category.
10 of 10
Expected to find “Jobs” when looking under “Get Involved.”
5 of 10
Of respondents were confused with the labeling of “Gatherings.”
7 of 10
Of participants expected to find the museums address in the footer.
Research
CONTENT AUDIT
I started by conducting a content audit using Dynomapper, which mapped around 1,000 links, including pages, sections, external resources, PDFs, and videos. I reviewed the content for relevance, accessibility, and opportunities to address gaps. I removed duplicates, inaccuracies, and repaired any broken links.
The goals of my evaluation were to:
-
Identify relevant content to highlight
-
Spot opportunities to add new content and address gaps
-
Remove duplicates or inaccuracies
-
Eliminate broken links
CARD SORT
To understand our users' mental models, I selected 50 pieces of content from the audit for a card sorting activity. The sessions were conducted with 10 participants in 30-minute intervals on Miro. During the activity, participants were encouraged to “think out loud” as they sorted and categorized the cards.
Example of card sort
Information Architecture
Based on our research, we designed the information architecture to meet both user expectations and the museum’s goals. I kept the navigation objectives. I limited the hierarchy to four levels to ensure everything was easy to find without feeling overwhelming, balancing depth and discoverability.
First Level: Primary Navigation - General labelling for intuitive exploration.
Second Level: Specific categories under the primary section.
Third and Fourth Levels: Deeper content accessible through second-level categories.
Navigation
In Figma, I redesigned the museum's current navigation system focusing on user conceptual models, accessibility, and discoverability
PRIMARY NAVIGATION
Before
The museum’s hamburger menu is hard to find, and when it’s open, it covers the main page, making navigation clunky and confusing.
After
I swapped the hamburger menu for a horizontal menu bar at the top of the page, featuring 7 main categories for easy access. The menu remains visible as users scroll, and a dropdown lets them quickly navigate through the hierarchy
UTILITY NAVIGATION
Before
The utility menu is tucked away in the hamburger menu and misses key features, like ticket purchasing, that users often search for
After
The utility menu is now placed in the header to reduce clicks for four key functions, making it easier to access essential aspects of the museum’s business
FACETED NAVIGATION
To keep users engaged and improve accessibility, we recommend embedding videos directly on the "Digital Collections" and "Tutorials and Demos" pages. Adding a filtering system will also make it easier for users to find the content they're looking for
Filters are integrated into the Digital Collection and Video Tutorials/Demos pages as a persistent side panel, remaining visible to users as they refine their search.
FOOTER
Before
The footer feels cluttered, with too much information shown at once and no clear hierarchy to guide users to what they need
After
Font weight is used to categorize items, and the footer is simplified to provide quick access to key information and resources.
Responsive Design
I created a mobile version of our website to provide a smooth, user-friendly experience on smaller screens, making sure users can easily navigate and access key content on the go
PRIMARY NAVIGATION
In my redesign, I incorporated a space-efficient hamburger menu. Tapping a downward arrow reveals the second level of the hierarchy in an accordion-style section, making content easy to scan while keeping the page length manageable
Hamburger menu opened
Accordion-style section expanded
The accordion allows users to get an overview of available sections while quickly expanding and collapsing different levels of the hierarchy to explore the content.
UTILITY NAVIGATION
I moved the utility bar to the bottom of the hamburger menu, using icons to represent each function. This saves space while making it clear and easy for users to understand what each utility does
Icons used to represent each function
FACETED NAVIGATION
Users can now filter content by "current," "future," and "past" options. To optimize screen space, I replaced the tab system with a filter that takes users to a dedicated screen for easy selection
Users view all available content on the "What's On" page.
When users tap the “Exhibition” tab, they only see exhibition-related content
Users can apply filters to narrow down their search
Users select the "current" filter to view ongoing content
Users return to the "What's On" page and see their selected filters
Final Design
Finally, here is the prototype with the final navigation design below. Feel free to check it out!
bottom of page