EXAMENSARBETE INOM DATALOGI OCH DATATEKNIK, AVANCERAD NIVÅ, 30 HP STOCKHOLM, SVERIGE 2020 Interaction Principles of 3D World Editors in MobilePhones with Focus on the User Experience VINCENT ERIK WONG KTH SKOLAN FÖR ELEKTROTEKNIK OCH DATAVETENSKAP Sammanfattning 3D v¨arldsredigerare anv¨ands omfattande i mobilapplikationer f¨or ma- nipulering av virtuella v¨arldar, men det finns ingen generell designram- verk f¨or de b¨asta interaktionprinciperna f¨or v¨arldsredigerare i mobiltele- foner. Genom att studera interaktionsprinciper, koncept, och funktioner som anv¨ands i konsumentbaserade v¨arldsredigerare, denna studies fokus ligger p˚autveckling och design av en prototyp, sedan evalueras inter- aktionsprinciperna, uppdelade i f¨oljande anv¨andaromr˚aden: urval, place- ring, manipulering. Resultatet fr˚an en heuristisk evaluering som st¨odjs av anv¨andartester visar p˚aatt det finns en majoritet som f¨oredrar f¨oljande kombination av interaktionsprinciper f¨or ett b¨attre anv¨andarupplevelse: en organiserad och simplifierad butiksgr¨ansnitt f¨or urval, rutn¨atssystem ¨over det friasystemet f¨or placering av virtuella objekt, och en kombina- tion av snabb- och l˚angsam tryck f¨or manipulering av virtuella objekt i 3D v¨arldsredigerar-prototypen f¨or mobiltelefoner skapad f¨or denna studie. 1 Interaction Principles of 3D World Editors in Mobile Phones with Focus on the User Experience Vincent Erik Wong [email protected] EECS School of Electrical Engineering and Computer Science KTH Royal Institute of Technology Stockholm, Sweden Abstract to overload the user interface, which is not an optimal solu- 3D world editors are widely used in mobile applications for tion in terms of UX especially for small touch-based screen manipulation of the virtual world, however, there are no devices (i.e. iPhones for this research). frameworks of design regarding the best practice interac- Broadly, the use-case scenario for 3D world editors is a tion principles for 3D world editors on mobile phones. By simplied version of the modeling softwares (e.g., AutoCAD, looking at methods, concepts, and functions used in general Maya, and Blender). world editors are not designed for users consumer world editors, this research focused on the devel- to invent something novel, but rather they are designed to opment and design of a prototype, which was then used to manipulate already existing items that are provided within evaluate the interactions principles divided in the following the software - to customize and decorate the virtual world use cases: selection, placement and manipulation. The results in an eortless and seamless way. from a heuristic evaluation backed up by user evaluations One main line of thought regarding 3D world editors: in- proved that there is in fact a majority that prefers the follow- corporate the virtual world with a grid-system.Agrid-system ing combination of interaction principles in terms of user in the context of 3D world editors acts as a guideline to assist experience: an organized and simplied shop interface for users by snapping virtual objects into the correct position selection, grid-system over the free-system for placement of in the virtual world. Grid-systems provide users a smaller virtual objects, and a combination of tap and hold to manip- window of error for placing objects as compared to when ulate virtual objects for the 3D world editor prototype for a free-system is utilized. On the other hand, a free-system mobile phones created in this research. provides more precision and less restriction for users. Both techniques certainly have their advantages and disadvan- tages. 1 Introduction For small screen devices, like the iPhone, simplifying inter- Virtual world editors, also known as world editors, are often actions and minimizing the degree of manipulation for the implemented both within the video game industry (e.g., in 3D world editor is very important. Many applications that the game genres of real-time strategy and real-life simula- use a 3D world editor employ a grid-system; however, there tion) and outside of the game world (e.g., interior-design ap- is not an agreed-upon standardized framework for 3D world plications). The purpose of using world editors is to provide editors. The purpose of this research is to compile a frame- the user with a simplied sense of control over customization work of interaction principles in regards to the user-journey in the virtual world. The simpler the interaction is - while and use cases for 3D world editor on mobile phones with maximizing degrees of customization - the better the user focus on the overall UX. Interaction principles includes the experience (UX) and the success rate are [1]. use cases: selection, placement and manipulation of virtual 1 2 3D modeling softwares such as Autodesk Maya and Blender object. require great levels of expertise that cannot be developed in This research is supported by a Swedish company called a short amount of time. These three software tools are most Friend Factory AB that is working to release a social-media commonly used to create 3D world scenarios and 3D models application called Frever. The Frever app is primarily devel- of the virtual world. The task of creating and modifying the oped towards Apple iPhone devices target towards teenagers, 3D virtual world can then be quite tedious, even the simplest which is why this research focuses on 3D world editors on tasks of translation and rotation can be hard to comprehend mobile phones. The resultant 3D world editor prototype, de- as they require immense background knowledge e.g., tech- veloped from this research, will become the foundation for nical jargon, key-combinations for dierent functions, and the Frever app’s world editor. mapping from 2D to 3D (from a 2D computer display to the 3D virtual world). Most of these modeling softwares tend 1https://www.autodesk.com/products/maya/ 2https://www.blender.org/ 2 Research Question to the navigation and orientation, selection, and manipula- What are the best practice interaction principles for 3D world tion of virtual objects within the virtual world, respectively. editors on mobile phones from a user experience perspec- Specically, the manipulation use case can be divided into tive? the subcategories of translation and rotation [15]. The nal use case system control, refers to the human-computer in- 3 Related Work teraction at the core of UX research. These four use cases makes up the user journey for world editors. While Mine’s This research has two main areas of focus: UX and develop- research focused on 3D world editors in virtual reality, the ment. The UX phase studies user interaction approaches of use case and user journey for 3D world editors on mobile 3D world editors on mobile phones. The development phase phones would essentially the same as it belongs to the same covers the research and principles of 3D world editors. involves the same concept and idea of manipulating virtual 3.1 User Experience world. UX research comes from the eld of Human-Computer In- 3.1.2 Heuristic Evaluation teraction where the focus moves beyond a traditional em- Nielsen and Molich introduced Heuristic Evaluation (HE) phasis on usability [11]. By examining usability, research as a method for identifying issues regarding the design and has focused primarily on eciency, satisfaction, error, mem- user experiences of UI designs [23, 26]. Nielsen later devel- orability, and learnability [24]. However, UX research also oped a set of ten heuristics [25] as a guideline of evaluation. studies users’ behavioral perceptions (e.g., visual, touch, and Evaluators of HE are often referred to as experts and typi- smell) and positive emotions (e.g., joy, fun, and pride) [12]. cally kept between three to ve [23, 26]. Thus, the ecacy The aforementioned UX principles of focus has previously of the HE is heavily dependent on the expertise of the cho- been researched on 3D world editors [1, 5, 13–15, 20, 22]. sen evaluators [19]. Huy and VanThanh created another set Ali et. al. studied UX in UI for The Sims 3 [1] where the of heuristics for the evaluation of mobile apps from three study was divided in three parts to measure dierent aspects dierent viewpoints: developer, user and service/content of the game and background information - namely, players provider’s viewpoint [5]. These heuristics were designed demographic information, game engagement, and UX on for the evaluation of mobile phones, as mobile phones are the UI (the latter two elements employed a questionnaire limited by smaller screens compared to other devices and using ve-point likert-scale). Towards the end of the study, often in conjunction with touch based interactions as men- overall thoughts and opinions of users were noted via a semi- tioned by Gomoz et. al. [29]. Gomez et. al. similar to Huy structured interview. In this format, participants are asked a and VanThanh created another set of heuristics for mobile series of questions that were prepared prior to the interview UI. [7]. 3.1.3 Empirical Evaluation 3.1.1 Dening User Journey Unlike heuristic evaluation, empirical evaluation focuses At the early stages of application creation, it is paramount on actual end users rather than experts [7]. While there that developers have a well dened user journey. Mapping are certain nancial advantages to conducting a heuristic out the user journey gives developers both a clear overview evaluation with a small sample (user) population, it is best of the use case of the app as well as a script to follow for that empirical evaluation utilizes a more representative, large development, according to Endmann and Keßner [8]. sample size. Merrick and Maher argued that virtual worlds, often seen Bowman et. al. utilized the empirical evaluation method in simulation games e.g. The Sims3, or virtual world applica- of testbed to study the dierence between a set of nine inter- tions, e.g.