STA redesign
Enhanced for usability
STA redesign is a a pure UX project, focusing on reorganizing hierarchy and producing detailed wireframes to improve usability. Final wireframes were produced after multiple rounds of testing and revisions. View full details in the attached case study.
About STA Travel
STA is a one-stop-shop for flights, working holiday visas, study abroad programs and more. STA Travel caters to young adults and offers discounted fares for students, adults under 31, as well as teachers.
Poor organization of STA Travel made it time consuming to understand the layout of the site, which would likely cause users to leave and go to another similar site. The subjects who participated in user testing for this project expressed frustration at how long it took to complete a simple task.
The problem
Too many options can be overwhelming to the user, as well as make it hard to find information. The original STA had 11 options in the navigation bar, and it was not clear where to find certain options. The main navigation was inconsistent. It changed when visiting certain pages, and was missing from other pages.
User testing showed that it wasn’t just a long navigation that caused problems, but the entire hierarchy neeed to be re-thought. Detailed wireframes needed to be produced to provide an intuitive and consistent user experience.
The solution
Revise the entire site hierarchy with clear and consistent navigation.
- “Round the World” moved under “Tours” since they are a related category.
- “Rail, Car, Bus” moved under new nav option “Getting Around,” which will include related subject matter.
- The “Insurance” navigation option is eliminated. It already shows up when booking a flight, is listed with the live abroad options, and would fit nicely on the “Tours” and “Round the World” pages.
- “Discount Cards changed to “Discounts” since it covers all the discounts.
- “Planning” changed to “Live Abroad” and includes studying, interning, working and volunteering abroad.
- “Live Abroad” and “Destinations” swapped, since “Destinations” is a broad overview with suggested itinerary, it would fit well as the last navigation option.
Changes based on user testing
Homepage
- Search bar added to easily find info.
- Scroll bar eliminated that advertises deals on the original homepage. Rather than making the user do the work, these should populate with different deals when the user visits the home page. This will keep the content fresh.
- Block around text on hero image removed for easier readability and so that it won’t compete with pictures.
Search results page
- Navigation has been added to this page.
- The calendar and results are now on the same page, saving the user time and an extra step from waiting for the new page to load. The selected dates are shown, and the cheapest date is highlighted. The number of steps have been cut in half.
- Filters are now on the side of the page rather than the top of the page. This new model follows the styles of competitors, it saves space and looks cleaner, and testing showed it was faster for the subject to use.
Form page
- Navigation has been added to this page in case the user is not ready to book.
- There is now an option to sign in for faster booking. This way the user can store information for convenience and a quick checkout, which will likely bring the user back to the site next time they are booking travel.
- On the current site, the insurance is listed first. The redesign has the passenger information first, similar to other travel sites. This helps create a sense of familiarity before the user is pressured into purchasing insurance.
- A checkbox was added to remind the user that they are responsible for fees if they decline coverage. This is good for both the company and the user. It may make the user take a moment to consider the consequences and then purchase the insurance, and by checking the box, the interaction makes the user understand the process rather than just skimming the boxes with insurance coverage.