We demonstrate a prototype mobile application designed to support individually collecting personal sources of inspiration on mobile phones, and then the sharing and curating of these collected materials in a face-to-face situation

Fischer, Joel E.

Lucero, Andrés

Porcheron, Martin

Nottingham ePrints

Lucero, Andrés and Porcheron, Martin and Fischer, Joel E. (2016) Collaborative use of mobile devices to curate sources of inspiration. In: 18th International Conference on Human-Computer Interaction with Mobile Devices and Services (MobileHCI 2016), 6-9 September 2016, Florence, Italy. Access from the University of Nottingham repository: http://eprints.nottingham.ac.uk/44570/1/MobileHCI16-Demo-Lucero.pdfCopyright and reuse: The Nottingham ePrints service makes this work by researchers of the University of Nottingham available open access under the following conditions.This article is made available under the University of Nottingham End User licence and may be reused according to the conditions of the licence.  For more details see: http://eprints.nottingham.ac.uk/end_user_agreement.pdfA note on versions: The version presented here may differ from the published version or from the version of record. If you wish to cite this item you are advised to consult the publisher’s version. Please see the repository url above for details on accessing the published version and note that access may require a subscription.For more information, please contact eprints@nottingham.ac.uk Collaborative Use of Mobile Devices to Curate Sources of Inspiration   Abstract We demonstrate a prototype mobile application designed to support individually collecting personal sources of inspiration on mobile phones, and then the sharing and curating of these collected materials in a face-to-face situation. Author Keywords collocated interaction; handheld devices; smartphones; ideation; mood boards; interaction design.  ACM Classification Keywords H.5.m. Information interfaces and presentation (e.g., HCI): Miscellaneous. Design Based on relevant literature on collecting and sharing sources of inspiration, the use of mobile devices in conversation, and designing mobile interactions for use in public settings, we decided to design and implement a prototype mobile application (Figure 1) that: 1) allows a group of collocated people to bring together digital sources of inspiration that they have collected individually on their mobile phones, 2) allows people to individually and collaboratively curate their collected materials, and 3) uses mobile phones as resources in the context of natural social interactions. Permission to make digital or hard copies of part or all of this work for personal or classroom use is granted without fee provided that copies are not made or distributed for profit or commercial advantage and that copies bear this notice and the full citation on the first page. Copyrights for third-party components of this work must be honored. For all other uses, contact the Owner/Author.   Copyright is held by the owner/author(s).  MobileHCI '16 Adjunct, September 06-09, 2016, Florence, Italy ACM 978-1-4503-4413-5/16/09. http://dx.doi.org/10.1145/2957265.2961830  Andrés Lucero Mads Clausen Institute University of Southern Denmark Kolding, Denmark lucero@acm.org  Martin Porcheron The Mixed Reality Laboratory School of Computer Science University of Nottingham, UK porcheron@acm.org  Joel E. Fischer The Mixed Reality Laboratory School of Computer Science University of Nottingham, UK joel.fischer@nottingham.ac.uk       Figure 1. The prototype mobile application. Bringing Together Digital Sources of Inspiration Whether actively involved in a project or not, designers continuously collect information and diverse sources of inspiration as part of ongoing design processes [4,6,8]. While these materials can be physical, for instance handwritten notes and clippings from magazines, such sources of inspiration also increasingly consist of digital media, such as photos, videos, or websites. However, these materials can be spread across devices (i.e., desktop, laptop, tablet, mobile), and stored over long periods of time (e.g., months, even years). We support collecting different types of sources of inspiration directly on people’s mobile phones. To limit complexity, we focus on ephemeral sources of inspiration that people have collected over the previous couple of weeks. Older material is automatically deleted from people’s collections. Making Sense of Sources of Inspiration At the start of a project, designers bring their sources of inspiration to their first project meeting to decide on a design direction. Students can use their laptops, tablets and mobile devices to share these materials. However, collaboratively making sense of and curating these materials as a group can be tedious, difficult and time-consuming. We support both individual and collaborative sense making with sources of inspiration. People first curate their materials presented on a personal timeline on their mobile devices. When they feel they are ready to start discussing materials as a group, people can share their personal timelines and engage in a collaborative curating process. Mobile Phones as Resources in Conversation The initial stages of group design projects present students with the need to discuss and collaboratively review their independently collected sources, however, requiring individuals to focus on using mobile phone within a conversation may present the individual with high attentional demands that detract from this conversation. Therefore, the design of the mobile experience should not distract or draw an individual’s focus away from the conversation but support act as an resources embedded in, but not the focus of, the conversation [5].  We selected a number of device and screen gestures that can be performed imprecisely by individuals whilst they hold the device in their hands and are interacting with it. The gestures chosen avoid the need for users focus too heavily on their interactions with the mobile application and thus allowing them to interact with co-present others.   Figure 2. Sources of inspiration (i.e., Note, Photo, Website, and YouTube Video) are laid out chronologically on a timeline.  Interaction Browsing Individual Collections Upon starting the app on their mobile phones, people are presented with their collection of sources of inspiration laid out chronologically on a timeline (i.e., one timeline per device) (Figure 2). Representing materials as a timeline allows for designers to critically reflect on the sources collected over a period of time [10]. Timelines are color coded to allow people to easily identify their own timeline (i.e., blue, green, pink, and peach). A welcome message is displayed near the right end of the timeline to indicate the present, thus separating past sources of inspiration from future ones. People can browse their timeline by swiping to the left or to the right. A white semi-transparent tab provides feedback when the end of the collection is reached.  People can add four types of content to their timelines: Photo, Note, Webpage, or YouTube Video. Each source of inspiration is represented as a thumbnail on the timeline using different sizes to easily identify them (i.e., 180x180 pixels for photos, 220x220 pixels for notes, 280x280 pixels for webpages, and 330x180 pixels for YouTube videos). Tapping on a thumbnail results in that item being displayed full screen, which in the case of a Webpage or YouTube Video opens a full screen view of Chrome or YouTube, respectively. To return to the timeline, people must press the phone’s back button.  In addition to the timeline, a grid-based overview of all displayed materials can be accessed with a simple gesture. To access the overview, people must perform a pinch-in gesture, typically used to zoom out on mobile and desktop platforms, which results in uniformly presenting materials as a 5-by-3 grid of tiles (i.e., 306x306 pixels each tile). Each thumbnail is color-coded to identify its creator. This general view can be browsed by swiping up and down, which is similar to browsing boards on Pinterest1, and all collected sources can viewed by tapping on the displayed thumbnail. To exit the overview, people must press the back button. Curating Individual Collections To add a new source of inspiration, people must perform a long press anywhere on the screen, other than where other materials currently exist. A floating dialogue screen prompts users to select the type of material that they would like to add. A Photo is added from the native photo gallery where people can pick any image. A thumbnail of the chosen photo will be automatically generated and added at the end of the timeline. Picking the Note option results in the opening                                                   1 Pinterest. https://www.pinterest.com  of a standard text input screen with an on-screen keyboard. A Note is restricted to 140 characters (i.e., the length of a tweet) to ensure readability. After typing in the desired text and pressing the button labeled ‘Done’, the new Note will be inserted into the timeline. For the purposes of annotation, a Note can be added anywhere on the timeline by performing a long press at the desired destination. The Webpage and YouTube Video options work similar to the Note, except that a thumbnail is automatically generated when the material is added to the timeline. Curating individual collections also entails pruning a timeline by further modifying or deleting existing materials. To achieve this, an existing material must first be put in edit mode by performing a long press on the chosen thumbnail (1 second). In edit mode, a larger version of the thumbnail will appear floating on top of the timeline. Here, people have a choice of modifying (i.e., by tapping it), deleting (i.e., by swiping it to the left), or doing nothing to it and returning to the timeline. Deleting a material triggers a paper scrunching sound to play. The swipe left to delete metaphor was inspired by the Tinder2 dating app. Sharing Individual Collections We leverage existing natural uses of our mobile phones by taking the currently used gesture of turning a mobile device screen toward a person to show them something [1,7,9]. To start sharing collections of sources of inspiration, two (or more) people must synchronously rotate their phone 180 degrees. We made this action work in all directions to allow individuals to select the most comfortable orientation [2]. People can naturally                                                   2 Tinder app. https://www.gotinder.com hold their devices in their hands when performing this gesture, as opposed to having to be flat on a table [7], or to be within arms-reach of others. When the device gesture is detected, tactile (i.e., a single vibration) and auditory (i.e., a cymbal sound) feedback is triggered for confirmation. As a result, both (or more) timelines will fade out and appear on both (or more) devices and all materials will be rearranged to appear in chronological order (Figure 3). The timeline that is not local to that device and all of its contents will appear faded (i.e., 50% opacity) to aid in differentiating one’s own materials from others’ content quickly.  The shared timelines can be independently browsed from each mobile device by swiping, thus getting different views of the collection. The vertical order in which the timelines are stacked will differ between devices to ensure that the owner’s timeline always appears on top. Otherwise, the vertical order in which the remaining colored timelines are stacked depends on the order in which the timelines are connected.   Figure 3. Sources of inspiration of the blue device plus three other timelines stacked and arranged chronologically together.   People can join the group by performing the same gesture with an existing group member, allowing them to see all group materials. To connect three devices, a member of an existing group must perform the same gesture with the new person. Forming a group of four people can be achieved in a number of combinations: the same gesture can be performed by adding one member at a time to the group, two connected pairs joining through one member from each pair performing the device gesture, or all individuals performing the device gesture synchronously. If an individual wishes to disconnect, they do so by pressing the back button on the timeline view, and in doing so, they leave the group (i.e., others will no longer see their timeline once they have disconnected). Co-Curating Shared Collections Once two or more collections are browsed together, people can engage in triaging [3] or co-curating the sources of inspiration while having a conversation. In addition to having the same functionality that was available while browsing and curating their individual collections, people can also perform similar actions to other people’s materials. People can either seek consensus and verbally negotiate what they think is missing or could be added, or directly act upon someone else’s content.  Additionally, a person can draw others’ attention to a particular position on the timeline by double tapping, which results in displaying a pulsating dot (in their particular color) at that same position on all devices in the group, similar in practice to a laser pointer used in presentations. If the dot is out of view, it appears at the edge of the screen corresponding to the direction that the dot is placed.  People can individually trigger the grid-based general overview by means of the pinch-in gesture on the timeline, which will this time show the entire group collection of sources of inspiration from all timelines. The design presents people with a personally controllable view of the group collection that is independent, but linked to the group’s contributions. Furthermore, all modifications to the collection are reflected on all devices, encouraging collective ownership over materials when connected. Implementation The prototype was developed for the Android operating system and was implemented using four identical LG Nexus 5 phones running a ‘stock’ version of Android 5.1 “Lollipop”. For ease of implementation, the application is designed to use many of the operating system’s built-in development tools, and communicates with other collocated devices over a Wi-Fi or cellular data connection. The phone’s accelerometer and magnetometer (i.e., digital compass) were used to deduce the device orientation and detect when the device was rotated enough to trigger the sharing action. The prototype also relied on a central computer that served as authentication service for the installed applications as well as a database for all materials collected using the prototype applications. This server also handled more computationally complex tasks (e.g., fetching screenshots for Webpage and YouTube Video materials) to allow the application to remain responsive. Each mobile device maintained a local copy of the database of all materials created within the group, and this allowed connections to be triggered and displayed instantaneously across devices. During  development it was identified that only retrieving materials when the sharing between devices occurred was found to be slow and interrupted the flow of the experience, a limitation of the network speeds that we sought to work around. References 1. Karen Church, Antony Cousin, and Nuria Oliver. 2012. I Wanted to Settle a Bet! - Understanding Why and How People Use Mobile Search in Social Settings. In Proceedings of the 14th International Conference on Human-Computer Interaction with Mobile Devices and Services (MobileHCI '12). ACM, 393-402. http://dx.doi.org/10.1145/2371574.2371635 2. Andrew Crossan, John Williamson, Stephen Brewster, and Rod Murray-Smith. 2008. Wrist Rotation for Interaction in Mobile Contexts. In Proceedings of the 10th International Conference on Human Computer Interaction with Mobile Devices and Services (MobileHCI '08). ACM, 435-438. http://dx.doi.org/10.1145/1409240.1409307 3. Abigail Durrant, Duncan Rowland, David S. Kirk, Steve Benford, Joel E. Fischer, and Derek McAuley. 2011. Automics: Souvenir Generating Photoware for Theme Parks. In Proceedings of the SIGCHI Conference on Human Factors in Computing Systems (CHI '11). ACM, 1767-1776. http://doi.acm.org/10.1145/1978942.1979199 4. Scarlett R. Herring, Chia-Chen Chang, Jesse Krantzler, and Brian P. Bailey. 2009. Getting Inspired! Understanding How and Why Examples are Used in Creative Design Practice. In Proceedings of the SIGCHI Conference on Human Factors in Computing Systems (CHI '09). ACM, 87-96. http://dx.doi.org/10.1145/1518701.1518717 5. Oskar Juhlin and Elin Önnevall. 2013. On the relation of ordinary gestures to TV screens: general lessons for the design of collaborative interactive techniques. In Proceedings of the SIGCHI Conference on Human Factors in Computing Systems (CHI '13). ACM, 919-930. http://dx.doi.org/10.1145/2470654.2466118 6. Ianus Keller, Gert Pasman, Pieter Jan Stappers. 2006. Collections designers keep: Collecting visual material for inspiration and reference. CoDesign 2, 1, 17-33. http://dx.doi.org/10.1080/15710880600571123 7. Andrés Lucero, Jussi Holopainen, Tero Jokela. 2011. Pass-Them-Around: Collaborative Use of Mobile Phones for Photo Sharing. In Proceedings of the SIGCHI Conference on Human Factors in Computing Systems (CHI '11), ACM, 1787-1796. http://dx.doi.org/10.1145/1978942.1979201 8. Andrés Lucero. 2012. Framing, Aligning, Paradoxing, Abstracting, and Directing: How Design Mood Boards Work. In Proceedings of the Designing Interactive Systems Conference (DIS '12), ACM, 438-447. http://dx.doi.org/10.1145/2317956.2318021  9. Martin Porcheron, Joel E. Fischer, and Sarah Sharples. 2016. Using Mobile Phones in Pub Talk. In Proceedings of the 19th ACM Conference on Computer-Supported Cooperative Work & Social Computing (CSCW '16). ACM, 1649-1661. http://dx.doi.org/10.1145/2818048.2820014 10. Moushumi Sharmin, Brian P. Bailey, Cole Coats, and Kevin Hamilton. 2009. Understanding Knowledge Management Practices for Early Design Activity and Its Implications for Reuse. In Proceedings of the SIGCHI Conference on Human Factors in Computing Systems (CHI '09). ACM, 2367-2376. http://dx.doi.org/10.1145/1518701.1519064 

Collaborative use of mobile devices to curate sources of inspiration

Abstract

Similar works

Full text

Available Versions

Nottingham ePrints