top of page
Frame 3.png

LINCS Portal Navigation

Project Type

UX Research, UX Writing, Information Architecture

Role

UX Designer at LINCS

Duration

3 Months

I was tasked with the design of the LINCS Portal—a main website for users to visit for links to the 12 data visualization and data conversion tools, documentation for their use, explanations of linked data concepts, and information on the project.

Top
Frame 5.png

Context

The LINCS Research Project is a team of researchers, developers, designers, and data experts spread across Canada. It aims to create a multi-tool research platform for linked open data unlike anything currently available for researchers.

LINCS_System_Diagram_2020_11_small.png

Section of the LINCS System Diagram (External Link)

Discovery

​I was completely new to the fields of Linked Data and Digital Humanities. I conducted one on one expert interviews with LINCS staff, a comparative analysis of websites for similar organizations, and a content audit of the current website.

Understanding the Field

  • Global navigation serves as an introduction to an organization. It is the first place to find context.

  • The landing page should immediately show the most common tasks on a website.

Understanding the Project

  • The new website will need to have a less technical, academic tone so new users can understand the befits of using LINCS for their research.

Understanding the Users

LINCS will be have beginning users learning the basics and highly technical experts. What does the Portal need for users of all levels to find the information they need? How can we make sure they know where to start?

 

Users visiting the Portal will need to be able to:

  • Access tool documentation

  • Complete the onboarding process

  • Learn about complex linked data concepts

Frame 6.png

Research

My discovery phase gave me a question to answer: will users want to navigate the LINCS Portal based on the tools available or by the task they are trying to achieve? I focused my efforts on global navigation as the most prominent opportunity for context.

Card Sort

I conducted a moderated, open card sort to better understand how users wanted to be able to navigate the Portal.

LINCS Landing Page Card Sort - CS Template Title example Card Sort P01 Moderator Nem Brune

I used Miro to conduct the test with 9 participants in May 2022

LINCS Card Sort Affinity Map - Frame 1(1).jpg

I collaborated with UX Designers within LINCS to find qualitative patterns (click to view)

Screenshot 2022-08-08 173822.png

I used Google sheets to create a Similarity Matrix to collect quantitative data

Major Findings

  1. Users wanted to be able to navigate the website by what they wanted to do. Seeing all of the tools at once was “overwhelming”   
    Result: Sorted content by 6 broad function categories

     

  2. Users wanted examples of practical use cases
    Result: Added a page for examples, testimonials and user stories

     

  3. Users wanted to see what the tools looked like in action before they clicked on an external link.
    Result: Created tool overview pages with screenshots of the tool

Stakeholder Presentation

I presented the findings of the card sort (PDF) at the LINCS Summer Tech Retreat in June 2022 to leaders on the development, research, content, data, and design teams. We collaboratively created a site map for further testing. 

 

Major Findings

  1. The 6 broad functions could be further grouped to mimic two categories used internally
    Result: Created two top-level categories called ‘Explore Data’ and ‘Create Data'

Tree Test

I conducted an unmoderated tree test to validate the side map and navigation.

maz test.png

I used Maze to administer the test to 11 participants in June 2022

nav tree.png

I collaborated with the content and development teams to confirm site map

Major Findings

  • One-word labels were too vague for complex contexts
    Result: expand the labels to verb phrases
     

  • Users start as broadly as possible if they don’t know exactly what to look for
    Result: Provide overview pages for all top-level categories
     

  • Separating function information into ‘Create Data’ and ‘Explore Data’ was intuitive
    Result: Continue use of these labels in navigation

Research

Content

The Portal needed top-level navigation labels that gave users a clear understanding of their contents. These labels have the added goal of showcasing the purpose of LINCS as a platform. I worked with many stakeholders to iterate.

1st Iteration: Collaboration with Users

Used in the Tree Test, these labels were too vague to understand their contents.

 

‘Learn’ proved to be especially problematic.

2nd Iteration: Collaboration with Content Team

Collaboration with the Content/Documentation Team illuminated back-end constraints on folder structure that we aimed to solve with this iteration.

 

The combination of Create and Explore proved confusing, and the ‘community’ category was split and its contents sorted into ‘About’ or ‘Get Started’. 

Final Iteration: Collaboration with Leadership

Working with the Portal Committee as a whole, we moved to two-word phrases to expand information, and split 'Explore' and 'Create' into separate categories. 'Tools' was created as a top-level element.

Content
lincs not feasible.png

Design & Development

The platform that we used to develop the Portal was chosen to be easily editable for years to come, but provided many feature limitations. I worked with the development team to ensure that our designs were usable and feasible.

Dropdown Navigation Menu

I designed a global megamenu to provide as much context as possible for users. I wanted to allow them to navigate through complicated information and personalized experience flows on every page according to need.

Medium fidelity mockup of global dropdown menu. The text links at the bottom remain static on each menu to provide easy access to top questions

Unfortunately, halfway through the project our website platform pushed an update that severely limited the customization available for global navigation. We could not provide the context that users needed.

Instead, I returned to our discovery work: what was it that we needed the navigation to do, and were there other parts of the website that we could rely on for this? 

 

We needed needed to provide clear direction for many personalized user flows. We needed to showcase the benefits of using LINCS for research.

Development

Final Navigation Design

After completing research, facilitating rounds of stakeholder feedback, and adapting to technical setbacks, I was able to balance the needs of many parties to create a navigation system that provided needed context to a complex system.

lincs connects.png

Global Navigation

Without the ability to use a megamenu for context, I focused on the landing page and internal overview pages to provide as much information as possible.

Landing Page

The Landing Page provides high-level information on the project and its tools

Main Page Edits Feb 2023.png

Internal Overview Pages

Category pages provide an overview of the information within and gave specific direction

Coming Soon!

Tool Page(1).png
Final Design

Lessons

Learn as much as you can from the people around you. I was completely new to the field of linked open data, and had a lot to learn to understand the basics. I kept myself humble throughout this process, and asked questions whenever I had them.

Designs will change at any point in the process. Due to technical limitations, I had to pivot the navigation experience very late in the project. Instead of holding fast to my original design, I reconsulted the original user needs: project context, direction, and clear example of benefit.

Frame 5.png

Acknowledgements

The LINCS Portal navigation project was completed in Summer 2022 for the LINCS Project based out of the University of Guelph. The Portal is still in development.

bottom of page