WikiTELL Search Feature: UX & Technical Problem Solving
UX Design • Information Architecture • Search & Filtering • WordPress • Responsive Design
UX Design • Information Architecture • Search & Filtering • WordPress • Responsive Design
My Role and Responsibilities
Role: Website Designer and Graphic Design Coordinator
Organization: TELL Japan
Period: October 2020 – Present
Primary Platform: WordPress / Elementor
Additional Tools: Figma, TaxoPress, JetEngine, JetSmartFilters, WordPress themes, HTML/CSS, troubleshooting
Key Responsibilities:
Search feature update
Database architecture
Custom post types, filtering
Improve navigation by improving search results layout
Create design mockups for a better responsive mobile web design
WordPress and Elementor implementation
Front-end testing, troubleshooting, and optimization
The Problem
The TELL website highlights many of the organization's services, including WikiTELL. WikiTELL is a curated database that houses over 4,000 entries to help users go about their everyday lives in Japan. The database includes a lot of information, such as contact details for immigration lawyers, embassies, police stations, international hospitals, birth control options, mental health clinics, and networking groups. Community members and Lifeline Support Workers alike use the search function, so it needs to be in excellent shape.
In 2025, the search function began showing incorrect results. I narrowed the problem down to the JetEngine and JetSmartFilters plugins, which were updated after a recent WordPress update. I contacted an external backend developer, and we began working on the parameters, hierarchy, and mobile design issues.
Mobile View of TELL Website Before Search Feature Update
The Process
Because the search function showed incorrect results when queried, we started there. For example, when someone searched for 'Lifeline,' the first result was a Lifeline staff member's professional bio rather than the Lifeline page or even the Lifeline phone number. This was because JetSmartFilters wasn't pulling information from the correct source on the website, resulting in poor search-term accuracy. To fix the hierarchy issue, I used the Taxopress plugin to add tags and categories to better manage the website's taxonomy.
Adding terms to website posts and pages using the TaxoPress plugin
After improving the hierarchy, the mobile and desktop user interface became the next top priority. We worked on the mobile view in Figma because the updated plugins had completely broken the search function. Before we updated the search function, the mobile experience was poor.
Communication about UX/UI with an external backend developer using Figma
The Outcome
The updated search function restored reliable search results and made it easier for users to find specific resources across TELL's large website, which houses almost 20 years of content. The improved parameters and filtering structure delivered better results, while the updated mobile layout made the search experience easier to use on smaller screens.
The update also resolved issues caused by the WordPress and plugin changes, allowing the website to continue serving both community members and Lifeline Support Workers without requiring users to manually navigate through hundreds of individual resources.
TELL Website Search Feature Update - Desktop View Iteration 1
TELL Website Search Feature Update - Desktop View Final Iteration
Mobile View Before Search Feature Update
Mobile View After Search Feature Update
In the updated mobile search layout, we chose the magnifying glass search icon because it is a widely understood visual cue. Once tapped, it triggers a pop-up with a query field and search results that populate as the user types.
I constantly monitor the plugins that make up TELL's search function to ensure they work together correctly. Further search result optimization using the Taxopress plugin, Yoast, and Google Analytics is expected.
View My Other Web Design Case Studies