A laptop and phone showing a preview of a species page of an eel swim bladder parasite. The GLANSIS logo is below the devices.

GLANSIS website redesign

Restructuring and refreshing GLANSIS to fulfill its purpose of aiding early detection, response, management, and education for invasive species in the Great Lakes.
role
UI/UX Designer
duration
4 months
type
Solo class project
tools/skills
Figma, Interactive Prototyping, UI Design, Mobile, Desktop

overview đź“„

For my Intro to UX class, I took client information and desk research to redesign the existing GLANSIS (Great Lakes Aquatic Nonindigenous Species Information System) website. The current website is considered too outdated and complex to be taken advantage of valuably  for the audiences that it serves. Using interactive prototyping in Figma, I refreshed the look of the website and intentionally redesigned the Homepage and Species List Generator to make it more friendly to its audiences—students, educators, researchers, natural resource managers, and federal decision-maker.

The Problem 🤔

How can we update the GLANSIS website to clearly show what tools and resources it has to offer?

The Great Lakes, the world’s largest freshwater system and home to 139 native species, faces a global threat to biodiversity—invasive species. Over 25 years, invasive species in the region have surged from 139 to 187 (MSU), with 41% causing significant harm. These invaders harm our ecosystems, economy, and society.

The GLANSIS website aids early detection, response, management, and education for invasive species in the Great Lakes, but users struggle with it due to its outdated, complex design.

the redesign đź’ˇ

I made the following design choices to improve the user's experience when navigating through the Species List Generator:

Informative cover pictures on homepage. Original: The links to each tool relied on minimal and non-descriptive icons. Redesign: Informative pictures for each tool to generate visual interest and more clearly describe the purpose of each tool.Grouping similar filter options together. Original: All the filter options are displayed one after the other, and it is unclear what the map displays (the selection for the “Lake” option. Redesign: Related options are grouped, along with clearer affordances and display of choices. Terms are given explanations as well.Simplifying search results. Original: Wide table format and multiple fields strains the eyes and can be overwhelming. Redesign: Information is limited but useful for identification—rest of info is in species profile.Making the species page easier to navigate. Original: Lots of text to scroll through. Redesigned desktop: Sticky table of contents to skim and skip to certain sections. Redesigned mobile - Expandable sections for easy skimming.A helpful 404 page. Original: The 404 page does not follow the website’s theme or provide possible solutions. Redesign: The message gives an explanation as well as possible solutions. It is also within the site.

the Prototype 💻📱

Desktop prototype

Mobile prototype

Thank you for reading! If you have any questions about this project, feel free to email me through bridgit@umich.com!