Amtrak.com

Amtrak.com Analysis

Homepage

Unconventional Homepage

The prominent feature on the homepage is a carousel-like promotional banner. The design of this particular element obscures the top navigation (Destination, Experience, Schedules, Deals) by sharing a continuous aesthetic with the navigation.

Buying tickets seems to be a second-tier function as this element is placed further down the page and can easily go unnoticed by the dominance of the promotional ads surrounding it.

Homepage with menus

Menus

The homepage consists of four different menus: the main navigation menu across the top of the page, a rewards menu in the top right-hand corner, the tabbed menu in the middle of the page where users can buy tickets and modify their trips, and an extensive footer menu.

Having four different menus to navigate through can be frustrating when trying to perform a specific task. Also, the organization of the dropdown menus within the main menu seem to highlight specific pages for no apparent reason.

City Guides & Walking Tours page

Redundant Content Flows

While creating a content inventory of the entire site we noticed there are many different ways to get to a specific page. This was likely an attempt to make navigation easier; however, it ends up creating cluttered pages with too many menus to browse through.

The City Guides page houses links to different guides and attractions. It also contains a left-hand menu with duplicated links from the main menu as well as a window where the user can purchase tickets or check the status of their trip.

The redundant content flows end up overcrowding every page on the website. A simplified IA structure will allow users to navigate the site with ease while also creating a more aesthetically pleasing experience.

Card Sort

Partial dendrogram results from card sort

To establish sortable content for a card sorting exercise we developed an inventory by gathering every link from amtrak.com, resulting in 72 terms. From here we entered these terms into OptimalSort, where participants can perform card sorts electronically. After collecting 13 completed results, we analyzed the results and discussed the general patterns in the data.

Travel Site Comparisons

Our team felt it was necessary to consider industry standards in order to create an intuitive IA structure. Therefore, we analyzed several other travel websites. In the image below the light blue color represents main menu items, light green is a footer item and the blue-green color is anything mid-page that seemed relevant to note.

Analysis of other travel site structures

Sitemaps & Wireframes

After agreeing upon patterns in the card sorting results, we worked separately to generate proposed information structures, eventually combining them into a final sitemap. With a new information architecture, we produced and annotated low-fidelity wireframes individually then consolidated our best ideas into a final homepage wireframe.

Sitemap

Individual Wireframes

Consolidated Wireframe

To maintain a goal-oriented approach, we simplified the “above the fold” section of the homepage to prominently display the ticket purchasing element. The main menu has been adjusted to take the full width of the page, making its presence more evident. A smaller utilitarian menu is placed above the main menu bar.

The more exploratory elements like user testimonials and links to secondary Amtrak.com pages are placed further down the page. The use of contrasting colors used for element backgrounds will help visually break down the organization of the page.