Transforming Complex Filters into Clear, Actionable Workflows

Transforming Complex Filters into Clear, Actionable Workflows

Transforming Complex Filters into Clear, Actionable Workflows

Home

About

Projects

Resume

Fatimah Hylton

Reimagining the filter, sort, and group process, transforming complexity into clarity and boosting efficiency.

Problem

Goal

Role

Product Designer

Biotechnology

3 months

Product Designer

3 months

Design Thinking

Prototyping

Competitive Analysis

User Research

Skills

Industry

Duration

While Transnetys' existing system provided basic functionality, the user experience was hindered by high cognitive load and navigational friction. Specifically, researchers faced:

Discovery Friction: Users struggled to locate specific filter choices quickly, leading to significant time constraints.
Functional Ambiguity: The process for sorting and grouping data was non-intuitive, making it difficult for users to organize results effectively.
Visual Noise: A lack of clarity in the ascending/descending formats slowed down the data analysis workflow.

Establish a clear user journey for the filter, sort, and group system to help researchers quickly and efficiently group and analyze their research data.

Reimagining the filter, sort, and group process, transforming complexity into clarity and boosting efficiency.

While Transnetys' existing system provided basic functionality, the user experience was hindered by high cognitive load and navigational friction. Specifically, researchers faced:

Discovery Friction: Users struggled to locate specific filter choices quickly, leading to significant time constraints.
Functional Ambiguity: The process for sorting and grouping data was non-intuitive, making it difficult for users to organize results effectively.
Visual Noise: A lack of clarity in the ascending/descending formats slowed down the data analysis workflow.Time constraint finding filter choices

Company Accomplishments

99.7%
Result accuracy

45 million
Samples genotyped

$25 M
Profit by 2030

Solution

Following a series of stakeholder working sessions and requirement gathering, I defined a strategy centered on operational efficiency and information density:

Maximized Data Real Estate: Engineered a permanent collapsible panel that provides immediate access to filtering tools while ensuring researchers have maximum screen space to analyze high-density genomic tables.
Accelerated Search & Discovery: Integrated an intelligent search function within the filter sets, allowing users to bypass manual scrolling and jump directly to specific variables in seconds.
Workflow Optimization: Eliminated the dedicated "Sort" section and integrated the logic into a more intuitive path, minimizing user clicks and reducing the cognitive load required to organize complex datasets.

Following a series of stakeholder working sessions and requirement gathering, I defined a strategy centered on operational efficiency and information density:

Maximized Data Real Estate: Engineered a permanent collapsible panel that provides immediate access to filtering tools while ensuring researchers have maximum screen space to analyze high-density genomic tables.
Accelerated Search & Discovery: Integrated an intelligent search function within the filter sets, allowing users to bypass manual scrolling and jump directly to specific variables in seconds.
Workflow Optimization: Eliminated the dedicated "Sort" section and integrated the logic into a more intuitive path, minimizing user clicks and reducing the cognitive load required to organize complex datasets.

RESEARCH

I collaborated with the Product Manager to lead a discovery phase focused on auditing the current workflow and identifying core user pain points. By aligning on project goals and technical constraints, I established a clear roadmap to ensure the redesign would directly improve researcher efficiency and meet high-level business objectives.

Target Audience: Researchers at various institutions who test samples to drive advancements in human health.

Personas

Competitive Analysis

Key Callout

Competitive Analysis

Transnetyx

Strengths: Market leader in scalable, automated genotyping for large-scale pharmaceutical and academic research.

Focus: High-volume efficiency and integrated data management for enterprise-level automation.

Softmouse

Strengths: Affordable, niche solution specifically optimized for small genetics and neuroscience labs. Weakness: Lacks sequencing and custom scalability, making it a specialized but narrowly scoped tool.

mLIMS

Strengths: Highly customizable, cross-disciplinary data tracking designed for complex, multi-lab environments.

Weakness: High-cost entry point ($5k–$30k+) limits its accessibility to smaller research teams.

LGC Genomics

Strengths: The most comprehensive provider, offering a unique combination of both genotyping and sequencing.

Focus: Leverages advanced technologies (NGS/PCR) to provide custom, end-to-end solutions for biotech firms.

Transnetyx

Strengths: Market leader in scalable, automated genotyping for large-scale pharmaceutical and academic research.

Focus: High-volume efficiency and integrated data management for enterprise-level automation.

Softmouse

mLIMS

Strengths: Highly customizable, cross-disciplinary data tracking designed for complex, multi-lab environments.

Weakness: High-cost entry point ($5k–$30k+) limits its accessibility to smaller research teams.

LGC Genomics

Strengths: The most comprehensive provider, offering a unique combination of both genotyping and sequencing.

Focus: Leverages advanced technologies (NGS/PCR) to provide custom, end-to-end solutions for biotech firms.

DESIGN

Following the competitive audit, I curated a series of initial sketches to explore new layout possibilities. My objective was to evolve the user journey while strictly adhering to the established component system, ensuring a cohesive experience and a streamlined hand-off for development.

Iteration Round 1

Users will select drop-

down menu of their

desired filters.

Select filter icon to

expand Sort & Filter

panel from its

collapsed state

Select filter icon to expand Sort & Filter panel from its collapsed state

Panel will expand

exposing all filter

options showing

both primary and

secondary filters

Panel will expand exposing all filter options showing both primary and secondary filters

Once searched and

selected the data

table will automatically

update

Once updated users

can now view desired

data information

leaving filter panel

expanded or minimized

Type in corresponding

letters for data type

users are searching for

Users will select the drop-down menu of their desired filters.

Once searched and selected, the data table will automatically update

Once updated, users can now view desired data information, leaving the filter panel expanded or minimized

Type in the corresponding letters for the data type users are searching for

Peer Review 1

Stakeholder Requirements & Success Criteria Through our alignment sessions, we identified four critical requirements for the redesign:

Information Density: Prioritize maximum screen real estate to support the analysis of large-scale datasets.
Intuitive Navigation: Ensure a clear on-screen hierarchy with recognizable iconography to reduce cognitive load.
Frictionless Workflow: Optimize the filtering logic to eliminate time constraints and unnecessary steps.
User Journey Clarity: Simplify the interaction model so the path from "Search" to "Result" is self-explanatory.

Stakeholder Requirements & Success Criteria Through our alignment sessions, we identified four critical requirements for the redesign:

Information Density: Prioritize maximum screen real estate to support the analysis of large-scale datasets.
Intuitive Navigation: Ensure a clear on-screen hierarchy with recognizable iconography to reduce cognitive load.
Frictionless Workflow: Optimize the filtering logic to eliminate time constraints and unnecessary steps.
User Journey Clarity: Simplify the interaction model so the path from "Search" to "Result" is self-explanatory.

Iteration Round 2

Select the desired

filter to the data being analyzed

Initially: a button with a filter icon

Now: a button labeled "Sort & Filter +"

to expand the panel.

Panel will expand

exposing all the filters

options that can be

applied to the data.

Minimize the panel when filter is applied for maximum screen space.

Once desired filter

is selected the data

table will update

automatically.

Once desired filter is selected the data table will update automatically.

Minimize the panel for more screen space with update data table

Select the desired filter for the data being sorted through.

Panel will expand exposing all the filter option that can be applied to the data.

Initially: a button with a filter icon.

Now: a button labeled "Sort & Filter +" to expand the panel.

Peer Review 2

During the refinement phase, I focused on three key usability challenges to ensure the interface was optimized for professional researchers:

Efficiency vs. Convention: Analyzing whether checkboxes or a multi-select search would be more time-efficient for users managing hundreds of variables.
Logic Simplification: Evaluating if removing the dedicated Ascending/Descending buttons in favor of header-integrated sorting would clarify the user journey or cause friction.
User Autonomy: Determining the optimal behavior for the collapsible panel—balancing the convenience of an auto-collapse feature against the user's need for manual control over their workspace.

During the refinement phase, I focused on three key usability challenges to ensure the interface was optimized for professional researchers:

Efficiency vs. Convention: Analyzing whether checkboxes or a multi-select search would be more time-efficient for users managing hundreds of variables.
Logic Simplification: Evaluating if removing the dedicated Ascending/Descending buttons in favor of header-integrated sorting would clarify the user journey or cause friction.
User Autonomy: Determining the optimal behavior for the collapsible panel—balancing the convenience of an auto-collapse feature against the user's need for manual control over their workspace.

Started design with a simple

sort and filter button on the to

conserve space leaving room

for other buttons or valuable

screen space for data on the

table.

Started design with a simple

sort and filter button on the to conserve space, leaving room for other buttons or valuable screen space for data on the table.

Iteration #1

Iteration #2

Iteration Process Summarized

Changed design from a simple

filter button to a label "Sort &

Filter" with a plus sign. This

allows for the user journey to be

much clearer to the Sort and

filter panel. The plus sign was

added to correlate with the

minimize button when the panel

is in its open state.

Also removed the white space

between the filter panel and the

side navigation allow freeing up

screen space for the data table.

Changed design from a simple filter button to a label "Sort & Filter" with a plus sign. This allows for the user journey to be much clearer in the Sort and filter panel. The plus sign was added to correlate with the minimize button when the panel is in its open state.

Also removed the white space between the filter panel and the side navigation, allowing for freeing up screen space for the data table.

Final Designs

REFLECTION

Reflections & Key Takeaways My tenure at Transnetyx was a pivotal period of growth, specifically in navigating the intersection of complex data systems and user-centric design. My core takeaways include:

Designing for Specialized Industries: I mastered the ability to translate high-stakes biotech requirements into intuitive digital workflows, ensuring precision without sacrificing speed.
Strategic Problem-Solving: I refined my design thinking process to identify areas where UI simplification could directly impact business efficiency and user retention.
Cross-Functional Communication: I strengthened my ability to advocate for the user while collaborating closely with stakeholders to meet technical and product objectives.
Iterative Excellence: This experience highlighted the value of continuous refinement and the importance of identifying personal growth areas to remain a versatile, impact-driven designer.

Reflections & Key Takeaways My tenure at Transnetyx was a pivotal period of growth, specifically in navigating the intersection of complex data systems and user-centric design. My core takeaways include:

Designing for Specialized Industries: I mastered the ability to translate high-stakes biotech requirements into intuitive digital workflows, ensuring precision without sacrificing speed.
Strategic Problem-Solving: I refined my design thinking process to identify areas where UI simplification could directly impact business efficiency and user retention.
Cross-Functional Communication: I strengthened my ability to advocate for the user while collaborating closely with stakeholders to meet technical and product objectives.
Iterative Excellence: This experience highlighted the value of continuous refinement and the importance of identifying personal growth areas to remain a versatile, impact-driven designer.

Reflections & Key Takeaways My tenure at Transnetyx was a pivotal period of growth, specifically in navigating the intersection of complex data systems and user-centric design. My core takeaways include:

Designing for Specialized Industries: I mastered the ability to translate high-stakes biotech requirements into intuitive digital workflows, ensuring precision without sacrificing speed.
Strategic Problem-Solving: I refined my design thinking process to identify areas where UI simplification could directly impact business efficiency and user retention.
Cross-Functional Communication: I strengthened my ability to advocate for the user while collaborating closely with stakeholders to meet technical and product objectives.
Iterative Excellence: This experience highlighted the value of continuous refinement and the importance of identifying personal growth areas to remain a versatile, impact-driven designer.

During my time at Transnetyx, I gained invaluable insights not only into design but also into my personal growth as a designer. This experience taught me how to approach design in a specialized industry, enabling me to create tailored solutions for unique products and services. It also helped me pinpoint areas for improvement, particularly in my design thinking and process. Furthermore, the role strengthened my presentation skills, highlighting both my strengths and areas where I can continue refining my approach. Overall, it was a rewarding experience to collaborate with a team that is genuinely passionate about their work and committed to making a meaningful impact on the industry.

Next Project

During my time at Transnetyx, I gained invaluable insights not only into design but also into my personal growth as a designer. This experience taught me how to approach design in a specialized industry, enabling me to create tailored solutions for unique products and services. It also helped me pinpoint areas for improvement, particularly in my design thinking and process. Furthermore, the role strengthened my presentation skills, highlighting both my strengths and areas where I can continue refining my approach. Overall, it was a rewarding experience to collaborate with a team that is genuinely passionate about their work and committed to making a meaningful impact on the industry.

Email

X (Twitter)

During my time at Transnetyx, I gained invaluable insights not only into design but also into my personal growth as a designer. This experience taught me how to approach design in a specialized industry, enabling me to create tailored solutions for unique products and services. It also helped me pinpoint areas for improvement, particularly in my design thinking and process. Furthermore, the role strengthened my presentation skills, highlighting both my strengths and areas where I can continue refining my approach. Overall, it was a rewarding experience to collaborate with a team that is genuinely passionate about their work and committed to making a meaningful impact on the industry.

Next Project

During my time at Transnetyx, I gained invaluable insights not only into design but also into my personal growth as a designer. This experience taught me how to approach design in a specialized industry, enabling me to create tailored solutions for unique products and services. It also helped me pinpoint areas for improvement, particularly in my design thinking and process. Furthermore, the role strengthened my presentation skills, highlighting both my strengths and areas where I can continue refining my approach. Overall, it was a rewarding experience to collaborate with a team that is genuinely passionate about their work and committed to making a meaningful impact on the industry.

CONNECT

CONNECT

CONNECT