Mockup of final design
Scroll down to see more images, and to read about our process and the methods we have employed to collect the data for a scientific approach to the redesign of Suvarnabhumi Airport's website.
About the project
The design for Suvarnabhumi Airport where conducted during my studies at Tilburg University in spring 2013.
A fellow student and I did a thorough research phase in this project, which included a qualitative task analysis, where participants were recorded on video while solving crucial tasks on the current website, using the usability tool Silverback 2.0. Face expression and activity on screen was recorded, and participants where asked to 'think-out-loud' while doing the tasks. Further, we did several attention-tests in order to get a more quantitative understanding of the website. This was done with Usabilla.com
By understanding the exact problems at the website as well as getting a better familiarity of what the user needs, expects or wants, and by including research reviews summing up most former studies within the scope of web design and usability, we believe that we did a new and better solution for suvarnabhumiairport.com.
Co-designer: Rune Weise Kofoed
Current website
"Attention-test" of current landing page
This is a heatmap showing results from one of 10 click-tests. We asked the users to click the elements they found most prominent on the website, and the problem was obvious: 40% of the participants’ attention were drawn towards elements of little or no relevance to the main goal of the website (e.g. a “close”-button, pop-up etc.).
Research and design phase
Researchers in the field of website usability state that usability is crucial since it has shown to give a positive attitude towards a website, increase stickiness and revisit rates, and that testing is important to understand the full impact on the user (Lee & Kozar, 2011). Website usability constructs and measurement instruments, like Naviga- bility, Simplicity and Readability, can be used by researchers and practitioners to measure the design quality of websites thus to understand the impact on the end-user (Lee & Kozar, 2011). Additionally, recent research shows that, similar to traditional stimuli in for example physical stores, colors online also provide information about the company behind. The impressions have a big impact on the users and can ultimately make them feel aroused and trust the site more (or less) (Pelet, J. et al., 2013).
Furthermore, the importance of font size and typeface is something that should be considered. It is shown that it can reduce the mental workload and ultimately make the user feel more relaxed when a website is using a sans serif font in size 14 in contrast to a serif font in size 10 or 12 (Banerjee et al., 2011).
"Design is where science and art break even" (Matthew, R., u.å.)
Wireframe ideas and sketches
The excact problem
On the basis of our own experience, conducted empirical user research studies and the measurement instruments and constructs provided in the systematic review by Lee and Kozar (2011), we determined problems within the following three dimensions on Suvarnabhumi Airport’s website:
1) Navigability: The menu structure and position makes it hard to locate sought information that ultimately leaves the users puzzled and lost. Tasks take an unnecessary amount of effort to comprehend. Menu interactivity is poorly designed thus many users do not use the main menu and instead use the extra menu on top of the page or waste time searching other places.
2) Disorientation: Users tend to spend a great amount of time orienting themselves on the website. Often information is not found thus forces the users to give up.
3) Incompatibility: The website is not compatible on mobile platforms and present itself badly on screens with 1024x768 or lower. Users can hardly use the site and some elements cannot be loaded on iPhones.
Final design for desktop screens
Results
The “attention”-test showed that focus was aimed towards elements regarding 'departures and arrivals' as well as the 'logo', 'menu bar' and 'travel inspiration' instead of towards elements of little or no relevance to the main goal of the website (e.g. a “close”-button, pop-up etc. old design).
The test also revealed that 31% of the participants found flight information the most prominent, 30% found travel inspiration the most prominent, and 11% found the menu and logo elements the most prominent.
Furthermore, results from tests and the expert interviews regarding the new menu feature, found the menu to be clearer and easily comprehensible to the user.
In the new design, the completion time of the simple “attention”-test was cut in half from 50.5 sec to 25.2 sec.
Final design for tablets
Final design for mobile devices
Menu on mobile
