Competitor Analysis - Usability Heuristics Matrix
 Share
The version of the browser you are using is no longer supported. Please upgrade to a supported browser.Dismiss

 
View only
 
 
Still loading...
ABCDEFGHIJKLMNOPQRSTUVWX
1
Usability HeuristicsTripAdvisorSygic Travel (formerly Tripomatic)TripHobo
2
Visibility of System Status
The system should keep users informed at all times, through quick feedback
- Status of actions is not communicated in any way that is immediately obvious. No error/update/pending type markers etc.
- There is no loading animation for page loading and transitions.
• Site dynamically changes underneath the modal as options in the modal wizard are selected, reducing the amount of time for page loads.
• Animation feedback is generally very fast and responsive, and doesn't keep the user waiting for something to complete.
• Inline placeholder loading shows the user that the UI is processing changes without breaking overall interactivity and control.
• Animation feedback is generally quick and responsive, although some modals have slow animation transitions which can take time to scale in.
• Inline placeholder loading shows the user where parts of the UI is loading in content.
• There is inline "loading…" text in places to alert the user to loading content, which helps provide active feedback on the status of the application.

- Site loads a semi-transparent overlay on top of the viewport when loading site content, which breaks interactivity temporarily.
3
Match System & Real World
Language should be clear, concise, easy to understand, and free of lingo. Info should appear in a logical order.
• Language used is generally consistent, utilising very little technical terminology in the operation of the site's various features.• Index page opening modal is in plain language and explains the primary goal of the site in two short sentences.
• Language on field inputs is in plain English, and has secondary help labels where required. Language is concise and clear.
- It is not apparent what "Change Mode" is on the Trip Planner screen - this button is used to change flight details - until the button is clicked, which is confusing to new users.
- Site uses "No Records" to denote when a database search is unsuccessful, rather than using plain language.
4
User Control & Freedom
Allow for exits, undos and redos as users often make mistakes. Changes should be quick and returnable.
• Actions are auto-saved in a Draft format, with the ability to return to the draft at any time via the Review button in the top-most navigation bar.

- No visible undo or redo controls on some forms.
- To exit a form entry, the browser's back button must be used. Drafts are still saved, and this does follow platform conventions, but can be inconvenient on mobile viewports.
• Primary action interface buttons contrast well against the general user interface.
• Back buttons are arrow-marked as a standard convention for the UI, and are provided whenever there is an option to step backwards through the workflow.

- No "Clear" or "Reset" functionality to reset the trip planner to an initial state.
- Trip Builder does have "remove" buttons to clear currently loaded selections, however the buttons are quite small and require precise clicking.
- No "Clear" or "Reset" functionality to reset the Trip Builder to an initial state.
- Previous state is not saved in memory on section change - all work is lost unless saved manually beforehand.
5
Consistency & Standards
Follow platform conventions - words, actions and situations should be the same. Be consistent in everything.
• Uses typical website layout with multiple horizontal navigation bars.

- Not all elements have a hover state, which could make it difficult for a user to find interactive elements (notably on top-most bar eg Join etc).
- Hover state differs between various elements of a similar nature eg tabs for sections and tabs for content.
- Different colours used for primary interactive elements (yellow, green, dark blue).
- UI has a tendency to change structure based on the content, which can be confusing.
• Site behaves like a typical mapping application, which is unsurprising as it appears to be built on top of Google Maps, and follows familiar interaction conventions. As a result, most interactions are inherently familiar.
• UI is consistent throughout, in terms of colour, structure, interface styling etc, which reduces cognitive load.
• Site behaves like a typical mapping application, which is unsurprising as it appears to be built on top of Google Maps, and follows familiar interaction conventions. As a result, most interactions are inherently familiar.
• UI is consistent throughout, in terms of colour, structure, interface styling etc, which reduces cognitive load.
6
Error Prevention
Design to eliminate errors, use confirmation where possible.
• Forms have inline AJAX-based verification, which helps stop form input errors.• Forms have inline AJAX-based verification, which helps stop form input errors.• Forms have inline AJAX-based verification, which helps stop form input errors.
7
Help & Documentation
Provide clear, searchable documentation.
• Clicking "Help Centre" in the footer or primary navigation pops up a modal first, offering some commonly asked questions and links to their respecive answers.
• Help Centre provides a search utility to look through the database of questions and answers.

- "Help Centre" is not loaded immediately, and the intiial dialog is a modal, which has the potential to error if scripting is disabled or the viewport is smaller than expected.
- No inline help for various site features.
• Site provides dynamic onboarding to teach new users most of the common features in each step of the workflow.
• A "Help" section is provided on the primary navigation separate from the rest of the main features, and pops up a modal with common help access points.
• The main Help Centre is searchable and provides access to frequently asked questions.

- "Help Centre" is not loaded immediately, and the intiial dialog is a modal, which has the potential to error if scripting is disabled or the viewport is smaller than expected.
- No inline help for various site features.
- Site help and documentation is provided as an unorganised collection of links in the footer - no single link to a collection of help topics.
- "Site Map" displays a list of countries showcased on the site, rather than a hierarchy of site sections.
8
Recognition Rather Than Recall
Make objects, actions and options visible. Instructions should be visible or easily accessible.
- It is not immediately clear how to create a new travel guide from the approrpriate section of the site. (No visible action to create new guide.)
- Most acton buttons are visible but the styling between them is inconsistent.
• Main action buttons on the UI such as Skip are bold and distinct.
• Interactive UI elements are either high contrast, or animate in some way to make it obvious that they can be interacted with.

- Action buttons such as Sign In and Close are not distinct on the initial modal wizard.
• Trip Planner system is relatively easy to understand and use, as it uses a drag-and-drop system to build out daily activity plans.
• Drag-and-drop system hinted at via a visual animation.
• Primary action buttons are highly contrasted against the light background and easy to see.

- Moving from the Map to the manual Trip Planner is difficult as the button to do so is at the bottom of the left sidebar, and in an identical visual style to a button next to it that "suggests a plan" for you.
9
Flexibility & Efficiency
Allow users to tailor frequent actions - accellerations can cater to both inexperienced and experienced users.
- Site is fairly challenging to use - the primary function is in review writing, but appears to offer other features such as guide writing, without explicitly showing the user how to use those functions at the top-most level.
- Site assumes some level of technical knowledge without the ability to tailor site features to your liking.
• Custom places can be set and saved if you have an account and are logged in first, which helps save time if you're planning trips to places you've been to before.• Custom places can be set and saved if you have an account and are logged in first, which helps save time if you're planning trips to places you've been to before.
10
Aesthetic & Minimalist Design
Reduce the amount of information to only that which is required.
• The information that is provided is clear and concise.
• Navigation is organised in a logical order, starting with an Overview and continuing on with guides, accommodation etc.
• Down-scrolling leads to visibly separated sections for all the assorted resources available.
• The initial index is designed as a search engine with the search utility taking prominence at the top of the page.
• Colour scheme is muted but consistent, and follows a general convention of green for branding, and blue for links.
• Tags on the "Travel Guides" cards are descriptive and useful.
• Travel guides contain useful tips and timescales which can be helpful for travellers when planning daily activities.

- Index page has two separate search utilities visible above the fold, which can be confusing to new users.
- Animations on modal bars eg "Was this guide helpful?" have a very slow transition duration.
- Interactive elements can he hard to distinguish eg "See more photos" button.
- Design is minimal but also too compact - not enough padding between elements.
- Typography is very small on larger desktop viewports.
• Site opens up with a search modal, making it clear what the primary function of the site is.
• Duration for travel guides is denoted in a tag format and is clearly visible in the UI.
• Navigation is short and uncluttered, and presents all primary functions at the top level.
• Information within content is short and concise, and has all of the important information visible at all times.
• Detailed content can be accessed at any time via typical actions such as "Read more…".

- Duration tag could perhaps use a larger font size as it is barely legible on large viewports.
- Main issue with site design is that all primary content is relegated to a sidebar, reducing the amount of usable space, especially on desktops.
• Index page has a typical layout with a search-focused header, displaying a single prominent search widget - makes it clear what the sole focus of the site is.
• Top navigation bar is ordered in site function priority first - with the primary function Trip Planner taking the first position.
• Site index is laid out in a product advertising-style, makes it easy to understand what the site goals are.
• Planner timeline is visual and easy to understand.

- Card navigation in the Trip Planner is overloaded with information and interface controls.
- Planner timeline feels a little cramped, and tries to cram in too many interface elements and controls at once.
11
Help Users Deal with Errors
Errors should be in plain language, precisely indicate the problem, and constructively outline a suitable solution.
• Inline errors on forms are in simple, not technical language. They don't explain much, however.• Inline errors on forms are in simple, not technical language.• Inline errors on forms are in simple, not quite technical language.
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
Loading...
 
 
 
Sheet1