Preliminary results of a research project, aimed on investigation of correlation between UI graphic design (decoration) and UI efficiency. Experimental data and short methodology description along with analogues projects review are included.

1. Graphic design
and UI efficiency
Andrei Balkanskii, Artem Smolin PhD, Yury Solonitsyn
ITMO University, Saint Petersburg
UXCampEurope 16, Berlin
2016

2. Authors
ITMO University, Saint Petersburg:
• Andrei Balkanskii — senior teacher, Chair of Graphic Technologies;
• Artem Smolin, PhD — Head of the Chair of Graphic Technologies;
• Yury Solonitsyn — practicing interaction designer with background in
graphic design, technical writing and web development … a master
student of the Chair of Graphic Technologies ;)

3. Problem to be investigated
• Now “Flat UI” style is popular;
• But some well-known industry experts (e.g. Nielsen Norman) say,
that such graphic decoration reduces UI efficiency [1, 2];
• UI efficiency is critical. Especially in enterprise systems, financial
solutions, medicine and transportation [3, 4].

4. Some examples
UI fragment, decorated in “traditional” style
(“Heroes of Might and Magic III – HD Edition”, 3DO/UbiSoft, 1999)
UI fragment, “Flat UI” style
(Windows Phone Maps, HERE/Microsoft corp., 2016)

5. Flat UI — More examples
Piotr Kubicki, Szczecin Airport | redesign concept,
https://www.behance.net/gallery/37478667/Szczecin
-Airport-redesign-concept
David Perger, FADE APP UI KIT | FREEBIE,
https://www.behance.net/gallery/36367535/FAD
E-APP-UI-KIT-FREEBIE-
Roma Smirnov, Yandex.Electrichki
https://www.behance.net/gallery/36
466693/jandekselektrichki

6. Why should we care about?
• UI efficiency depends on both UI logic (structure) & UI graphics;
• UI efficiency = Time;
• Time = Money.
$$$ :)

7. Just one example … of many
Tickets terminal, S-Bahn station, Schonefeld Airport …
more than 20 minutes in line.
Pressing all and anything
on the screen, trying to
figure out, how to deal
with it.

8. Boring academic stuff — Definitions
• Cognitive load — the phenomenon, causing progressive growth of
mental efforts spent by user to operate the UI [3];
• NASA HCI research group consider the cognitive load as one of the
serious threats for the adequate human-to-machine interaction and
for the mission success [3];
• Information load — amount of data or factors user is to process to
complete the given task;
• The combined effect of cognitive and informational load leads to
decreased work efficiency [1, 2, 3, 4].

9. Boring academic stuff — Analogues
• Publications: Burmistrov et al [5], Fabio et al [6];
• Burmistrov et al:
• detailed review of the research method and results;
• but the test tasks have an artificial nature.
• Fabio et al:
• detailed methodology, information load measured;
• but results are mostly fundamental.
• Both projects — incorporated limited amount of respondents
(about 20 persons each, all university students).

10. Analogues — Examples
Burmistrov et al [5]: Fabio et al [6]:

11. Our approach to the experiment
• Involve as much users as possible via special experimental web-site;
• Ensure maximum compatibility of this web site;
• Use social networks to spread a link to the site;
• Metrics of the HCI effectiveness:
• type I () errors — amount of “inactive objects” considered to be an active
element … or just “tries”;
• type II () errors — amount of “active element not found” errors;
• task completion time.

12. Results — Respondents
0
50
100
150
200
250
Russia
Ukraine
Germany
Belarus
Austria
Estonia
Israel
USA
Australia
Bulgaria
Sweden
Thailand
TheNetherlands
Afghanistan
Azerbaijan
CzechRepublic
Finland
France
Honduras
Hungary
Ireland
Japan
Lithuania
Montenegro
Switzerland
UK
0
20
40
60
80
100
120
140
160
180
200
12-14 15-18 18-25 25-35 35-45 45-65 More
than 65
Total respondents: 571;
Complete records: 356.
Survey: 20 May — 19 June 2016.

13. Please, notice:
These are preliminary results, based on raw data.
Our project will continue with data processing and interpretation.
If you are running an academic project, we can share the raw data with
you. We are also interested in exchanging results with teams, running
similar researches.
Contact address: Yury Solonitsyn, solonitsyn.yury@adesignlab.ru

14. Results — “Select a button” task
0
50
100
150
200
250
300
0
2
4
6
8
10
Style:
Button selected,
times:
Average time, s:

15. Results — “Find a given button” task
0
0.1
0.2
0.3
0.4
0
2
4
6
Average errors:
Average time, s:
Style:

16. “Buttons vs distractions” & “ Digits” tasks

17. Results — “Buttons vs distractions”, “Digits”
0
0.1
0.2
0.3
0.4
0.5
0.6
0
1
2
3
4
5
6
7
3x3 5x5 7x7
Average errors:
Matrix size:
Average time, s:
Respondents:
Buttons:
• 3x3: 397 (128/140/129);
• 5x5: 389 (119/144/126);
• 7x7: 382 (127/130/125);
Digits:
• 3x3: 380;
• 5x5: 378;
• 7x7: 373.
Style:

18. Style:
Results — “Buttons vs dictractions2” task
0
1
2
3
4
0
2
4
6
8
10
Average errors:
Average time, s:
Respondents: 118 134 117

19. Thank you!
Any questions?
Andrei Balkanskii abalkanskij@yandex.ru
Artem Smolin, PhD artikus@inbox.ru
Yury Solonitsyn solonitsyn.yury@adesignlab.ru
ITMO University
Saint Petersburg, Russia

20. References
1. J. Nielsen. Windows 8 – Disappointing Usability for Both Novice
and Power Users. Nielsen Norman Group. Published on:
19 November 2012. Accessed on: 05 December 2015. Web:
http://www.nngroup.com/articles/windows-8-disappointing-
usability/.
2. K. Whitenton. Minimize Cognitive Load to Maximize Usability.
Nielsen Norman Group. Published on: 22 December 2013.
Accessed on: 17 November 2015. Web:
http://www.nngroup.com/articles/minimize-cognitive-load/.
3. K. Holden, N. Ezer, G. Vos. Risk of Inadequate Human-Computer
Interaction. NASA Johnson Space Center. Published on:
26 December 2013. Accessed on: 16 November 2015.Web:
https://humanresearchwiki.jsc.nasa.gov/index.php?title=Risk_of_In
adequate_Human-Computer_Interaction.
4. The human-machine interface as an emerging risk. European
Agency for Safety and Health at Work. Published in ~2006.
Accessed on: 16 November 2015. Web:
https://osha.europa.eu/en/tools-and-
publications/publications/literature_reviews/HMI_emerging_risk.
5. I. Burmistrov, T. Zlokazova, A. Izmalkova, A. Leonova (Laboratory
of Work Psychology, Lomonosov Moscow State University,
Moscow, Russia; InterUX Usability Engineering Studio, Tallinn,
Estonia). “Flat Design vs Traditional Design. Comparative
Experimental Study”, IFIP International Federation for Information
Processing 2015; J. Abascal et al. (Eds.): INTERACT 2015, Part II,
LNCS 9297, pp. 106-114, 2015.
6. A. Errante, R. A. Fabio, C. Incorpora, N. Mohammadhasni,
T. Caprì, C. Carrozza, A. Falzone. :The Influence of Cognitive
Load and Amount of Stimuli on Entropy through Eye tracking
measures”, EuroAsian Joint Conference on Cognitive Science.
September 25-27, 2015. Torino, Italy.