User Experience Design: Contrasting Academic with ...

User Experience Design: Contrasting Academic with Practice M. Bačíková Technical University of Košice, Department of Computers and Informatics, Košice, Slovakia [email protected] Abstract—User experience (UX) is an area of both research and software development, which deals the creation of human-friendly user interfaces. It is closely related to human-computer interaction (HCI) and usability. Teaching UX is often a difficult challenge for many educators. UX design is an intercultural, interdisciplinary, cross-field experience and requires extensive knowledge in multiple fields and the ability to awake creativity in our students. To force IT students used to program every day to talk with the customer and speak the user’s language is often hard to achieve. This paper describes my experience from designing and teaching a UX related subject. When creating the content of the subject “User Interfaces of Software Systems”, available research and teaching literature was used. In this paper, I contrast the subject with the knowledge from practice. Several useful techniques to support student motivation and engagement are also provided.

I. INTRODUCTION User experience (UX) and Human-computer interaction (HCI) deal with the creation of human-friendly user interfaces. Both areas deal with similar issues, however UX is more practical and HCI perceives UX from the perspective of science. My interest in HCI came from practice, as I have extensive experience in software development. The importance of teaching UX should be evident and well understood. Unfortunately, this sounds good in theory, but difficult in practice. Not only to teachers, but also many developers and IT companies, UX is usually considered to be a secondary matter. At the beginning, I could not imagine how hard it will be to persuade my students about the importance of UX. In Slovakia, UX is still “under wraps”. From the 6 largest universities in Slovakia, only one teaches a subject related to UX and the curriculum is quite obsolete. Our motivation was to spread the idea and design a fresh subject with current topics from the fields of UX and HCI. Teaching UX often represents a difficult challenge for teachers in higher education. Since it is an interdisciplinary field, teaching UX is an intercultural, interdisciplinary and cross-field experience for many educators [2]. It is difficult to adapt the teaching style to the current “anytime and anywhere” IT generation [3]. The importance of engaging the students with ongoing trends and best practices in the fields of UX was also stressed by Getto et al. [4]. In this paper, I will describe the subject curriculum and provide fundamental recommendations that help building a better curriculum matching the state of the art practice. I

also describe several techniques that help supporting student creativity and motivation. II. KEY TOPICS Since UX is a multidisciplinary approach, it is almost impossible for a teacher to create a subject about UX without the extensive knowledge in several fields including usability, cognitive sciences, ergonomy, sociology, computer sciences, engineering, business, graphic design, etc. [28]. A wide variety of literature is available, hence we selected here the most important ones that should help as a minimal set. We recommend to include the most important authors from the fields of UX and HCI starting with the oldest books and ending with the newest ones: • S. K. Card et al. [26] • D. Norman [27] • J. Nielsen, [25] • A. Dix et al. [28] • B. Shneiderman et al. [29] • Y. Rogers et al. [30] • J. Nielsen and R. Budiu [31] M. Wright’s (University of Edinburgh) and S. Bechhofer’s (University of Manchester) lectures were also very helpful, we recommend to use them, too. Of course, knowledge of universal guidelines (usability, accessibility), usability heuristics and platform design guidelines is necessary. After collecting and analyzing the available literature, we have identified 11 topics most important for a UX designer: • History of HCI, Communication interfaces and technologies, Fundamental literature and dictionary. • Interaction to user interfaces (UIs) and principles of their design, types of UIs. • Fundamental principles of UI design, interaction conceptualization, cognitive model. • Data collection, principles and guidelines, usability, accessibility, domain usability. • Usability evaluation. • Technical means for creating UIs. • Psychological aspects of UI development. • Modern human-sensing UIs (speech, movement, virtual and augmented reality). • Development of UIs. • Web, mobile and unix UIs.

We recommend to use similar topics in current UX curricula. The last three topics relate to specific platform guidelines, since both web, mobile and Unix UIs have their specifics in multiple aspects. III. CONTRASING THEORY WITH PRACITCE When leveraging the more or less scientific literature, the teacher often encounters a problem: Could it be that I teach a theory that is not actually used in practice? If the educator has little experience and was involved only in development of medium-sized projects in small teams, then it is not always clear if such methods are really used in practice and if they generate the desired results. In small countries such as Slovakia the question is even more frequent and important. The awareness about UX in the IT community is still very small here. In such times, contrasting with practice comes on stage. This is impossible without at least some previous experience and without interviews with UX experts. I leveraged my own development experience for customers but also expert knowledge. Ján Rojček is a UX designer with 15 years of industrial practice. Apart from other small projects he participated on the UX of the Netbeans development environment platform in Sun Microsystems. Currently, he works at AVG, which deals with anti-virus protection software. Since UX, HCI or usability is an unknown phenomena in Slovakia, students often think it at the last place during software development. Even during final exams many master students refuse to believe that their design is flawed. They believe that in industry UX is useless. We solved this problem by inviting Rojček to perform a lecture in our university. The goal was to show to the students that the principles and methods of UX, which we teach them in school are really used and, in fact, directly affecting them. Since the students use Java and Netbeans on a daily basis and Rojček worked for the Sun Microsystems developing the platform, it was very simple to explain them the direct impact of usability on them. For these reasons the lecture had a great success and stimulated student’s activity. Last but not least, mentioning the salary of UX designers being higher than the average programmer’s was very motivational. We recommend to involve as many UX experts as possible in lectures. When comparing our curriculum with Rojček’s work in industry, we found multiple matches, the following being the most significant: • Key terminology, identifying related research or development areas to UX such as HCI, usability, usefulness, etc. • The process of iterative design, prototyping, and development used in UX. • The importance of work domain analysis and actions/objects analysis for design. • Techniques of UI design: personas, scenarios, screen sequence diagrams. • Techniques of prototyping – wireframing, prototyping. • Techniques of UX evaluation – remote and personal user testing, quantitative vs qualitative results.

• • •

The importance of abiding to the rules and heuristics of usability. The importance of supporting accessibility. The importance of abiding to the platform design guidelines.

At the same time, these areas represent the most important facts, which should not be missing in any UX subject curriculum. Moreover, we identified a new method, which was not included in the curriculum, specifically: • Customer journey mapping In practice, it is very difficult to persuade managers and project financiers about the importance of solving a particular UX problem and to explain to them that solving it will need a larger amount of finances. Customer journey maps are very suitable for communicating with managers, since it is necessary to point out to the summary results and points, where multiple problems and negative experiences during usage occur. Such negative experience might be the reason for the users to stop using the system. The customer journey maps are used as result summaries of multiple rounds of user testing. The example is in Fig. 1. The diagram is a recording of the test in time from left to right. In Fig. 1, the screens the users have seen and activities they performed are displayed in the stripe marked by violet color. Problems they experienced and emotions they had during the process are in the bottom stripe. Because they represent an important knowledge of a UX design expert, customer journey maps were added to my curriculum. IV. DESIGNING LECTURES AND EXCERCISES In this section I will describe the design of interactive lectures and creative exercises. A. Supporting Teamwork and Creativity on Exercises As many researchers including Getto [6] confirmed,

Figure 1.

Example of a customer journey map [Source: uservision.co.uk]

Figure 2. Best usable remotes of our students

one of the fundamental ways to support creativity in a UX classroom is teamwork. I will add three more: • give them a puzzling, interesting and practical problem to solve, • make it entertaining, • start early. When designing a UX-related subject, it is often a problem to “fill” the first few exercises with some meaningful activity, because the students do not have any extensive knowledge about usable and accessible design yet. The tasks have to be simple enough for them to manage and the problem should be practical and coming from a well-known area of daily use. At the same time, detailed specifics should not be obvious. We recommend to give them simple assignment right from the start of the semester so they can build on the gained knowledge further. To involve entertainment, we recommend applying the approach of learning by a bad

Figure 3. Best usable remotes of our students

example. Properly selected tasks will get the students motivated and involved in the subject. Right in the first two weeks the students got the following two assignments: • Design the most unusable universal remote control (task for the first week). • Design the most usable universal remote control (task for the second week). The students worked in groups of 3-4 students to support collaboration and teamwork. From experience we can say the groups of 4 produces better results. It is important to select a common daily problem known to the students. A universal remote is a hard nut to crack for designers, because a total universality is hard to reconcile with UX. There are multiple devices to control with different features (a TV, a Radio, etc.). It is difficult to map all functionalities of the target device types and at the same time to create a usable and not overly complex product with too many features.

•

How to support left and right handed people? It is not possible to place the buttons in mirror positions.

These questions arose naturally during the design. Since they were to solve the problem of accessibility, we also asked them questions such as: • Will visually impaired or disabled people be able work with the device? • Will your grandmother be able to work with the device? • Will a child be able to work with the device? For example, how do I prevent my 1 year old child accidentally triggering the button for opening the doors on my car? As a pre-requisite, it is necessary to explain the most fundamental guidelines of usable design to them in the scope of the first exercise. Norman’s “Design of Everyday Things” was a great inspiration: • physical, logical and cultural constraints, • identifiable affordances, • correct feedback in the right time, • natural mapping, • abiding to the existing standards and conventions.

Figure 4. Best usable remotes of our students

In software products, everything is highly abstract and it is always possible to do things several ways. For this reason we decided for a physical device. In physical products, the physical world creates natural constraints for the design. It creates a natural design obstacles that do not exist in the digital world. The condition was the devices should be at least theoretically manufactorable. Students solved problems and questions such as: • How to put everything on such a small device? How to not make the device too big to be used by one hand. • How not to overcrowd the device? • How to provide a meaningful way of telling the user which controls are and which are not available for the current device? • How to prioritize features when you cannot put everything within the reach of the right-hand thumb.

The first task is fun and simpler than the second one. Their goal is to violate as many rules of HCI as possible. To support creativity, it is essential not to constrain the students too much therefore we allowed them as many possibilities as possible: • Unusual methods of input (touch, voice, physical gestures). • Unusual materials (such as glass, wood, bendable materials, transparent displays). • Different components, devices, sensors (such as gyroscope, Kinect, natural language recognition, compass, tracking of eye cornea movement etc.). • Devices unusual for universal remote controls such as car lock, garage door, home security and lights, microwave, fridge, air conditioning etc. The remote should control at least 3-4 devices, including TV and Radio. The challenge is to support a huge amount of functionalities and to design a so called “pig in a poke”: a very attractive, beautiful design, but at the same time a highly unusable one. In the second week’s exercise, the groups were to present their unusable remotes in front of the whole class. After that, a discussion about the “unusability” of the product followed. The students were active, creative, had fun and produced highly creative designs. Some of them even decided to create a 3D model of the remote or a web page, which sells the product as if it was already developed. Approximately 90% of the students correctly understood the ideas of (un)usable design. Many of them even identified the aspect of (non-)ergonomics and aesthetics in the design. After their presentations, we assigned them the second task and explained the higher difficulty: usually, a usable design is much harder to create than an unusable one. They could create a new device or remake the older one to

Typical student’s attention span is about 10 to 15 minutes long and after that it rapidly decreases [7]. Yet most university classes in Slovakia last 90 minutes. It is very difficult to hold the attention for such a long time even for a trained individual (usual time is 45 minutes). Quizzes and voting are a very effective technique to solve this problem. There are many tools that are supported directly during presentation. However, the problem is how to get the students to answer the quiz or to vote. In lectures, I ask questions through Facebook and students answer by selecting one poll options or optionally add their own. The advantage of Facebook is, that the students nowadays are all connected, therefore there is no need to gain the target audience each time the question or quiz is posted. It is better to use physical clickers, however in cases where the clickers are not available, Facebook is the next option to choose. Students were also to perform activities through Facebook, e.g. creating the best icons for a camera to: • Delete the last photo. • Delete all camera photos. • Format the memory card.

a)

b)

c)

Figure 5. Examples of student’s icons for a camera

be usable. The rules were the same, except the addition of three new features: • ergonomic handling, • learnability, • appealing, aesthetic design. The results were again highly creative, the students were fully engaged and many of them presented highly usable design. Almost everyone fully understood the fundamental ideas of UX. Teams helped each other and had many fresh ideas. Some of the most usable remotes are presented in Fig. 2, 3 and 4. B. Supporting Activity and Rewarding Students One of the fundamental problems of Slovak universities is the missing activity and involvement of students at lectures. Due to the didactic teaching style in the elementary and high schools, involvement of students in the teaching process is rare. Young people are strongly accustomed to absorb knowledge and listen to the teachers. This is usually combined with the need to blend with the crowd. On lectures, the students are not used to ask questions, nor to answer them. When initiating any such activity, the answer is usually silence. One of the very effective ways is to use social media. I have three years of experience of using social media for supervising and mentoring (described in Ref. [8]). Although social networks such as Facebook are still feared by many educators [17][18][19][20][21][22][23][24], variety of universities have successfully applied them in their curricula [9][10][11][12][13][14][15][16]. Rather than restricting the students from using it, we should leverage Facebook as means to get closer to them. The goal is usually to collaboratively create materials for the subject. In the UX subject, I used Facebook to motivate, maintain focus, and also to reward students for their efforts.

The actions have a small semantic difference. For example, the icons for formatting the memory card in Fig. 5 a) and b) metaphorically evoke an image of throwing away the card, deleting or cancelling it. The student who uploaded the icon depicted in Fig. 5 c) was the only one who correctly identified the metaphor of formatting (cleaning) the memory card. The task was assigned at the lecture and in 60 minutes the students uploaded 17 sketches to the album. After that, they voted for the best icon set. The first three authors were rewarded with activity points. It is good to assign tasks on several lectures. For students it is imperative to get feedback on their ideas. Thus after the upload of icons and voting for the best icon took place, the metaphoric meaning problem was discussed at the next lecture. To keep the group alive, we recommend to post a new interesting article at least every week. In the post, students should be asked to express their ideas regarding the subject. As for motivation, we created an album called “Hall of fame of usable designs” on Facebook. The pictures of the most brilliant designs were added and the authors were tagged in the photos of their designs. This has brought to the group even the last students that were not yet its members. V. SUMMARY OF RECOMMENDATIONS I described the design of the subject curricula, lectures and exercises. Now I will draw conclusions and provide a summary of recommendations to abide when creating a new UX subject in a fun, interactive way that supports student motivation, involvement and creativity. 1) Include key literature mentioned in section II. 2) Include key topics enumerated in section II. 3) In lectures, involve as many UX experts from practice as possible. 4) Make lectures and exercises interactive and entertaining. 5) Exploit the full potential of social networks.

6) In exercises, make the tasks interesting, creative and fun. Support critical thinking during discussions. Some examples of how to implement recommendations are described in this paper.

these

CONCLUSION In this paper one possible way to build a UX related subject was described. Recommended key literature and UX topics that should be included in the curriculum are listed. The key in UX is to promote activity, creativity and critical thinking. Therefore several ways of making the lectures and exercises more motivating, interesting and fun for students are also presented.

[11]

[12]

[13]

[14]

[15]

ACKNOWLEDGMENT This work was supported by VEGA Grant No. 1/0341/13 Principles and methods of automated abstraction of computer languages and software development based on the semantic enrichment caused by communication.

[16] [17]

REFERENCES [1]

G. Eason, B. Noble, and I. N. Sneddon, “On certain integrals of Lipschitz-Hankel type involving products of Bessel functions,” Phil. Trans. Roy. Soc. London, vol. A247, pp. 529–551, April 1955. [2] Ch. Rusu and V. Rusu, “Teaching HCI: a challenging intercultural, interdisciplinary, cross-field experience,” Proc. of the 1st international conference on Intercultural collaboration (IWIC'07), Springer-Verlag, Berlin, Heidelberg, pp. 344-354, 2007. [3] R. Halstead-Nussloch and H. Reichgelt, “Leveraging HCI in teaching mobile, "anytime and everywhere" IT,” Proceedings of the 14th annual ACM SIGITE conference on Information technology education (SIGITE '13). ACM, New York, NY, USA, pp. 13-18, 2013 [4] G. Getto, L. Potts, M. J. Salvo, and K. Gossett, “Teaching UX: designing programs to train the next generation of UX experts,” Proceedings of the 31st ACM international conference on Design of communication (SIGDOC '13). ACM, New York, NY, USA, 65-70, 2013. [5] B. Plimmer and R. Amor, “Peer teaching extends HCI learning,” Proceedings of the 11th annual SIGCSE conference on Innovation and technology in computer science education (ITICSE '06). ACM, New York, NY, USA, pp. 53-57, 2006 [6] G. Getto, “Doing UX: A Workflow for Teaching and Training,” Proceedings of the 32nd ACM International Conference on The Design of Communication (SIGDOC '14). ACM, New York, NY, USA, 3 pages, 2014. //ux is not usability, je to ovela viac; collaborative projects – zdoraznuje ich dolezitost [7] Duncan Folley, Steve Wilkinson and Simon Thomson, “Rebooting the student’s attention span by using Personal Response Systems,” Assesment, Teaching and Learning Journal (Leeds Met) number 6 (Summer), pp. 21-25, 2009. [8] Bačíková, M., "Using social networks for supervising and mentoring," 12th International Conference on Emerging eLearning Technologies and Applications (ICETA) 2014, IEEE, pp.17-22, 4-5 Dec. 2014 [9] B. Allen, H. Caple, K. Coleman and T. Nguyen, “Creativity in practice: Social media in higher education,” Future challenges, sustainable futures, Proceedings ascilite Wellington, pp. 15-20, 2012. [10] K. P. Brady, L. B. Holcomb, B. V. Smith, The Use of Alternative Social Networking Sites in Higher Educational Settings: A Case Study of the E-Learning Benefits of Ning in Education, in:

[18]

[19] [20]

[21]

[22] [23]

[24]

[25] [26] [27] [28] [29] [30] [31]

Journal of Interactive Online Learning, vol. 9, no. 2, ISSN: 15414914, Summer 2010. N. Selvin, “Social Media in Higher Education”, in: The Europa World of Learning – 62nd edition, Europa Publications, ISBN 10: 1857436202, London, Routledge, November 3, 2011. L. F. Philips, D. Baird, M.A., & BJ Fogg, “Facebook for Educators”, Retrieved October 2010 from https://www.scribd.com/FacebookforEducators/documents. R. Reuben, “The Use of Social Media in Higher Education for Marketing and Communications: A Guide for Professionals in Higher Education”, in: Seminario Académico, Tendencia sen la Formación Online, State university of New York, New Paltz, 2008. C. Casado-Lumbreras, and R. Colomo-Palacios, "Online coaching in thesis supervision: a qualitative study," Proceedings of the Second International Conference on Technological Ecosystems for Enhancing Multiculturality, pp. 489-495, ACM, 2014. L. Dunn, "Teaching in higher education: can social media enhance the learning experience?" 6th Annual University of Glasgow Learning and Teaching Conference, Glasgow, UK, 1 page, Apr 2013 Ho, Won. "Integrating social network service into learning management system." E-Learning Week 2010: Conference. 2010. P. Drotar, J. Mekyska, I. Rektorova, L. Masarova, Z. Smekal, M. Faundez-Zanuy, "Decision Support Framework for Parkinson’s Disease Based on Novel Handwriting Markers," Neural Systems and Rehabilitation Engineering, IEEE Transactions on , vol.23, no.3, pp.508,516, May 2015 M. Nosáľ, J. Porubän, “XML to Annotations Mapping Definition with Patterns,” Computer Science and Information Systems, Vol. 11, No. 4., 2014 S. Šimoňák, “Verification of Communication Protocols Based on Formal Methods Integration,” Acta Polytechnica Hungarica, Vol. 9, No. 4, pp. 117-128, 2012 M. Tomášek, “Language for a Distributed System of Mobile Agents”, Acta Polytechnica Hungarica, Vol. 8, No. 2, pp. 61 – 79, 2011 M. Paralič, P. Bednár, J. Paralič, "Personalized and Adaptive Access to Services – The Semantic Web Services Approach," Semantic Hyper/Multimedia Adaptation: Schemes and Applications: Studies in Computational Intelligence, vol. 418, Berlin Heidelberg : Springer-Verlag, pp. 231-247, 2013 C. Szabó, S. Korečko, B. Sobota, “Data Processing for Virtual Reality,” Intelligent Systems Reference Library, 26, pp. 333-361, 2012. M. Nosáľ, J. Porubän, “Program comprehension with four-layered mental model”, 13th International Conference on Engineering of Modern Electric Systems, EMES 2015, art. no. 7158420, 11-12 June 2015 J. Porubän, S. Chodarev, “Model-aware language specification with Java,”. 13th International Conference on Engineering of Modern Electric Systems, EMES 2015, art. no. 7158424, 11-12 June 2015. J. Nielsen. “Usability Engineering”, Morgan Kaufmann Publishers Inc., San Francisco, CA, USA, pp. 362, 1993 S. K. Card et al. „The psychology of HCI“, Lawrence Erlbaum Associates, February 1986, pp. 469, 1986 D. Norman, „The Design of Everyday Things, Revised and Expanded Edition“, MIT Press, pp. 288, 2013 A. Dix et al., „Human-Computer Interaction“, 3rd ed., Prentice Hall, pp. 602, 2004 B. Shneiderman et al., „Designing the User Interface: Strategies for Effective Human-Computer Interaction“, 5th ed., pp. 672 2009 Y. Rogers, H. Sharp, J. Preece, „Interaction Design“, 3rd ed., pp.602, 2011 J. Nielsen, R. Budiu, „Mobile Usability“, Nielsen Norman Group, pp. 203, 2012