Website Search

OVERVIEW
Led a user-centric redesign initiative for the Garrett Corporate website, leveraging extensive research to understand user behavior regarding content search, filtering, and sorting. 
OBJECTIVES
Redesign Garrett's search functionality to improve the overall user experience and increase conversion rates.
TIMELINE
5 weeks
KEY RESULTS & IMPACT
Enhanced Search Experience: Introduced auto-suggestions, smart filtering, keyword highlighting, and clear error handling.
Business Outcomes: Increased user engagement and improved conversion rates across desktop and mobile views.
DESIGN PROCESS
1. Research & Analysis: Conducted qualitative research to identify user expectations and friction points during site search.

2. Competitor Analysis: Evaluated industry-standard search features to establish baseline UX requirements and feature gaps.

3. Design Phase: Designed wireframes in Adobe XD with a focus on usability, accessibility, and responsiveness across different devices. Incorporated elements such as search bar placement, auto-suggestions, filtering options, and result presentation.

4. Feedback & Iteration: Gathered feedback from the product owner on the initial designs and iterated on the design to ensure alignment with project objectives.

5. User Testing: Ran usability tests with key end-users to validate navigation flow and correct usability issues.

6. Front-End Handoff: Worked alongside developers to implement responsive components and verify technical compatibility.
7. Quality Assurance & UAT: Completed thorough UAT to ensure design fidelity, cross-browser consistency, and functional accuracy.
Homepage Search Bar
Garrett homepage header with search bar and hero banner reading 'We are Technology Champions

Garrett homepage with a redesigned search bar, positioned prominently in the global header to encourage instant user discovery.

Garrett Search Redesign
Garrett search results page showing 63 results for 'eturbo' with filter and pagination controls

Garrett redesigned search with prominent result notification, filtering by type, an option to highlight keywords, and intuitive results showing content type alongside a large thumbnail image.

Search Filter by Type
Garrett search results page with the Type filter dropdown open, showing Webinars and Product Information selected

Garrett redesigned search with a filtering by type menu, letting users narrow the 63 results by content category, such as webinars, white papers, or product information, with counts shown for each.

Highlighted Search Keywords
Garrett search results page with 'Highlight keywords' enabled, showing 'E-Turbo' highlighted in the result titles

Garrett redesigned search with an option to highlight keywords, making it easy to spot the "eturbo" search term directly within the titles of matching results.

Related Searches Suggestions
Garrett search results footer showing related search suggestions and pagination

Garrett redesigned search with related searches, suggesting alternative terms so users can quickly refine or broaden their query beyond the original "eturbo" search.

Mobile Search Filters
Two mobile views of the Garrett search results page, side by side, comparing the filter panel collapsed and expanded

Garrett redesigned search with filtering applied on mobile view, showing the collapsed filter icon alongside the expanded filter panel with applied tags and highlighted keywords.

No Search Results Messaging
Garrett search results page showing a 'no results found' message with search tips and suggested keywords

Garrett redesigned messaging when no search results are found, pairing a clear empty state with helpful search tips and suggested keywords to guide users toward a successful search.

Redesigned 404 Page
Garrett 404 error page with 'page not found' message and site footer navigation

Garrett redesigned 404 message page with a customized image, replacing the "0" with a magnifying glass icon and pairing it with a full footer of navigation links to help users find their way.

↑Back to Top