deco3500-2019 / Moo-Young-Rain

0 stars 0 forks source link

Prototype Testing #5

Open elvalpw opened 4 years ago

elvalpw commented 4 years ago

Low-fidelity Prototype

Based on insights derived from the users in the previous interview and workshop session and the summary of related literature, it is included that people will pay attention to the following factors when they are engaged in offline social activities, that is, interest, distance, safety. As computer-mediated technology is beneficial for increasing the speed of connection (E. N. Torres, 2017) and mobile application is praised for its easiness to use and can be used at anywhere and can be accessed at any time (Ghose & Han, 2014). So, we decided to design an app in consideration for the above three advantages to promote the relationship between people. This paper prototype shows the main features of our app and the overall layout of our app content.

Since paper prototype cannot give the user a good interactive process, and the main information of the product in the form of paper-based sketches is not intuitive enough, plus the comprehensive consideration of the remaining time, we decided not to involve the relevant user test of paper prototype, and will paper prototype as a sketch for subsequent product designs. This prototype shows the four main interfaces of our application: home, favorite, join, and my profile. I will briefly introduce the features contained in these four main interfaces. Once the selection is complete, the user will be taken to the event page where they can view the brief description and the organizer of the recent activity and have the option to post events related to the topic.

Home: People can choose the topics they are interested in on the homepage. By clicking on an activity of interest, the user can view the details of the event, including the event description, number of interested parties, number of participants, time information, geographic location, per capita consumption, and the user can also communicate with the organizer in the comment area. If the user is interested in the activity, he can click the interested button. Similarly, if the user wants to join the event, he can click the join button. Interested: Events that are of interest to the user will be displayed on this page. Join: Events users would like to join will be displayed on this page. My profile: Personal information such as personal profiles, historical records and historical records that have been held will be presented in this page.

The picture below is our low fidelity prototype and the wireframe for our product:

Sketches

image

Wireframe

image

Medium-fidelity prototype

According to the insights gained from the background research and use the above wireframe as the structure of our prototype, we use adobe XD to create the medium-fidelity prototype. Due to the uncertainty about the users’ preference of the layout of the content and for the pursue of the visual-pleasing product, we have designed two versions of the prototype and have conducted the testing session by inviting the potential users to walkthrough all the functions contained in the prototype. In the testing session, we use A/B testing as our test method, A/B testing refers to making two (A/B) versions for the App interface, allowing the same tester to randomly access these versions, in order to collect user experience data, and finally analyzing and evaluating the best version. In the testing session participants are required to experience two versions of the prototype by finishing the task assigned to them, after they finish all the task, we will conduct following interview related to the experience of the usage. Through subsequent interviews, we can assess whether the usability and functionality of our products meet user needs. The data collected in this session would be beneficial for the modification of the follow-up products, the provide ideas for the production of high-fidelity prototype.

The picture below are the homepage two versions of the prototype, full details about these two prototypes can be found by visiting the link below: Version 1 image

Version 2 image

Function

The functions of our medium fidelity prototype are divided into the following sections:

  1. Join/mark the activity of your interest: Users can achieve this function simply by selecting the interested topic -> browse through the activity page and choose the activity the user want to know more about -> read the detailed description of the certain activity -> click join/interested button (if the user have some concerns about certain activity, he can add comment and get in contact with the organizer) -> participate the offline activity as planned.

  2. Host your own activity: Users can host their own activities and invite people to join in this activity by using our platform. This function can be achieved by selecting the topic user would like to host -> click host an activity -> filled in the detailed information as requested -> confirm the information -> attend the activity as planned.

  3. Manage the events you would like to join/ you are interested in. Users can browse through the event they would like to join/ they are interested in in the corresponding page. The edit button appeared on the top right corner of the page can manage the event.

  4. View personal profile. Users can view and edit their personal information and view the history for the activities they have participated and hosted.

How content is organized and structured in two versions of our prototype are different in the following aspects: 1). Different security level, which has different information about activities, different score rates and comment, with or without a real name and profile photo. 2). Different group classification, version one use interests to categorize content while version two is categorized by different functions. 3). Different way display distance, version one use google map to display the geographic location while version two only use words to show location. 4). Different layout in the homepage. Version1 uses text and image to present the types of activities and arranges the content in a left and right structure while Version2 uses different colors to distinguish different sections, and the upper and lower structures are used to place the content sections.

Test

In order to get the user's comments on the two versions of the prototype and feedback on the features and content, we conducted the user test session. Testers are required to finish 3 tasks to walkthrough the main functions of our application and we will conduct interviews related to the experience of usage to the participants. Overall, we collected a total of 10 data in this test session. In general, users are satisfied with our products, but there are still areas for improvement.

Tasks the users are required to walkthrough:

  1. Add one activity into my favorite
  2. Post an activity
  3. Mark the organizer and the participants

Feedback

By analyzing user feedback at this stage, 80% of participants prefer version1 and praised version1 of its intuitive layout and clear display of the information, however, there is still 20% of the participants prefers colorful display of content and suggested that the usage of different color it can attracts people’s attention. Based on these feedbacks we choose to adopt version1 as our main improvement object and will take the suggestion for colorful display of content in consideration in the future design.

As for the complaints, some participants suggested that the content for interested page and joined page is similar, it would be better to sort these functions in one page. It is suggested that we can use calendar to display the date of activities and distinguish the different category by color. Through the interview, some participants mentioned that it would be better to build relationship online to have a brief chat with other in previous and would be better to add private chat function which can make them have a private chat and would maintain the relationship after the completion of the activities. When it comes to the content part, people complaint about their unwillingness to see so many texts on one page, and they would be annoyed when seeing a page that is overloaded with information. There are other aspects that the tester often mentions are security and privacy issues. Although our app is involved in these two aspects, they still have doubts about the security of offline activities and the privacy of personal information. Their concerns are mainly about the unwillingness to share personal profile and how to verify the safety of the event.

Based on the feedback, we will conduct the following modification of our prototype in the following aspects: 1). Combine the participation record and upcoming event information in the calendar 2). Add the function of chatting with other users 3). Reduce text information on the event page 4). Add the recommendation section in the homepage 5). Add rating function 6). Provide the option for those who don’t like to share the private information to reveal personal profile from others.

Final prototype

Function

In combination with insights from bibliography and feedback of the first prototype,we have identified several directions that require significant changes:

  1. Combine the participation records and upcoming event information in the calendar; 2 Increase the ability to chat with other users;
  2. Increase the recommendation section;
  3. Add the rating function;
  4. Add the hidden personal information function;
  5. Combine the personal information content. In addition, some minor features have been improved, such as the deletion of text, the replacement of uniform types of icons and the re-enactment of personal information types.

Calendar

image

On this page, activities that participated and have been signed but not participated are put together. Gray circles indicate history, while red circles indicate that they have not yet participated. In the module that shows the activity information in the lower part of this page, the elements that distinguish the different types of activities are whether it has the comment button and the font color.

Chatting

image

image

The user can send an edited message to the organizer on the event information page. This message will appear in chatting, and after that, the user and the organizer can have multiple conversations. In addition, we have added the emoticon feature.

Recommendation

image

There are activity recommendations at the bottom of the homepage, but these recommendations only contain some general information and the operation of participation and like.

Rating

image

Hide personal information

image

In the user's Me, the user can show or hide personal information by clicking on the eye. This information includes academic qualifications, constellations and hobbies.

Combine personal information

image

In addition to comments and ratings, we also added historical and hosted events to the bottom of the page. But when there are more than 2 activities involved, the system will hide parts. Users need to click see all to expand. Although this prototype is still designed and changed in Adobe XD, we changed the Pluralistic walkthrough in the testing protocol (the second prototype) because this method tests the user's usability for the product, and the participants are the combination of a user, a developer and an usability expert, which allows us to get richer results and future plan (the second prototype) from different respective. The link of the second prototype

image

2. Insights from bibliography

Safety and privacy:

Due to the various uncertainties of the Internet, vigilance against strangers is the reason for online social interaction (Ortiz, Chih & Teng, 2017). An effective way to reduce user perception uncertainty is to look at other members' past online behaviors and access more relevant personal information through an online platform (Kunz & Seshadri, 2013). While disclosing personal and identifiable information can increase trust and reduce perceptions of uncertainty and vulnerability, users feel more at risk when disclosing more information. When they think the information makes them feel uncomfortable, they will post fewer comments and information. So the amount of information disclosed online is a key factor (Mesch, 2012). In addition, some of the user profile information displayed can help them find their social group (Baker & Oswald, 2010).

Chatting:

Nowadays, teenagers mainly use social networks to connect with others (Subrahmanyam, Reich, Waechter & Espinoza, 2008), and passing instant messages is the way they keep in touch with their peers. For them, online socialization not only increases their exposure to strangers in their daily lives, but also strengthens their relationship with online and offline friends (Reich, Subrahmanyam & Espinoza, 2012).

Recommendation:

In social software, the recommendation system is very important, it can help users quickly find the information they need from a large amount of information and help users make decisions (Colace, De Santo, Greco, Moscato & Picariello, 2015). The recommendation function is based on the user's preferences and activity predictions, which encourages users to participate in the event (Zhang & Lv, 2018).

Emoji:

Shy people always encounter obstacles in the social process, and when these people are interacting online, if they can use emoji instead of expressions, use words instead of spoken language, which is very helpful for them to overcome obstacles. And can help them make up for the shortcomings in face-to-face communication (Reich, 2017)

3. Prototype Iteration II

The application used in the third prototype was a combination of an application made by Adobe XD and a website made by HTML, CSS and JS. The content of the application displayed using Adobe XD is roughly the same as the second prototype, but we chose to display the website as the main function. The main functions include: the user clicks on the activity picture on the home page and enters the event details interface; views the map; comments; clicks on the event to record the event into the calendar. The functions that can be implemented through JS include:

  1. After clicking on the heart, the number of people interested will increase by one;
  2. Click on the calendar after clicking on the heart, and the number of participants will be increased by one;
  3. Introducing the API, the user can zoom the map to view the restaurant location;
  4. The user can give a comment and the input will be displayed in the comment area.

The link of the website

4. Pluralistic walkthrough protocol

image

Preparation before the participant arrives

Materials needs: Consent forms Pens and paper XD prototype

Introduction:

Hi, stranger is an app on a mobile device and the app is also a social platform through which users can get to know people with the same hobbies and engage in deeper offline social interactions.

Task 1: Pluralistic walkthrough

Introduction:

Today we are going to do the test about the app. We hope that this test will collect your feelings and satisfaction, and can propose some effective improvements, because it will help us in the future. So I hope that you can complete this test honestly and let us give you your feelings and ideas.

Tasks:

  1. Attend an event (a brunch in Brisbane City) and check the calendar
  2. Leave a comment to the event
  3. Find the Lucas’s profile
  4. Chat with the organizer (Jack)
  5. Post an event
  6. Give Lucas a rating

Details of tasks & instructions:

  1. Introduce the Pluralistic Walkthrough activity to users
  2. Show them the prototype
  3. Give them pens and paper
  4. Ask them to finish the tasks
  5. Discussion
  6. Explain developer design reason
  7. Summary

Closing

That is the end of the test. Thank you for participation, and your suggestions are very useful for our project.

5. Results from the second prototype

Conclusions from the discussion

  1. In the home page, there is a navigation bar that slides to different topics. This feature coincides with the content of the home page.
  2. The font is too small and there is a lot of content about the introduction, which is difficult to see.
  3. The overall process is very coherent
  4. Have the ability to chat with other users and view other people's data, but lack the subscription function
  5. After posting other users, you should be able to receive notification that this person has posted related activities.
  6. In the Me interface, you should be able to see the person I subscribe to.
  7. In the personal information interface, the icon similarity of about me, interested and my event is too high to make it difficult to distinguish.
  8. In the personal information interface, the element about me is not used.
  9. In addition to using distance and time as a way to filter activities, you should add more, such as regions and areas.
  10. Add search function on the homepage, and when the user clicks on the search bar, can feedback some popular activity keywords.
  11. Add hashtag (for keyword search) in event information introduction and post page.
  12. For the function of hiding user information, all the information that can be hidden should be classified, and the information that you want to hide can be individually checked.
  13. In order to ensure the security of users, the real name authentication function can be added in this app.
  14. Ability to share location information in the chat window.
  15. You can use a map to view the number of nearby activities, which is more intuitive.
  16. Need to share (share event information to other platform, such as Facebook).
  17. Invite friends to participate in the event on the app.
  18. For features that rate other users, it’s best to refine the scoring items, such as feedback speed, activity quality, and on-time attendance.
elvalpw commented 4 years ago

Analysis and future plan

Based on the conclusions reached by users, engineers, and developers during the discussion, these can be sorted out and some of these corresponding user needs can be derived. image

In the future, for some simple needs, such as visual effects, detailed rating, searching method and privacy setting, we will make corresponding changes directly according to the content of user feedback. But for more complex new features, we will decide which new features should be added in the next iteration based on importance and time constraints. As can be seen from the ordering of the importance of new features, subscription, notifications, invitation and searching are preferred because the first three functions are related to one of our existing features (watching other users' profiles and chatting). In the absence of these new features, this may result in users not being able to track the dynamics of a user, thereby reducing the likelihood of further socialization, which is inconsistent with the goal of our design app. The search function is necessary because it can improve the user's sense of control over the app, and it will help them quickly find the information they need and reduce time and rework. However, for the real-name authentication that can improve the user's security perception, we have added many factors that can improve the user's perceived security in the previous research and also added them to the design of the product. Is it necessary to add another one with the same effect? The function requires us to do more research on the users to determine whether their security perception has reached full.