Versi

by Quatrio

##Introduction## Versi is a mobile-based web page/app which addresses the issue of bias in controversial topics in the media. It is primarily a discussion/debate forum where users are able to somewhat freely express their opinions but in a more professional manner. Bias in the media often leads to misinformation of major news topics, which may generally spark a massive division in society.

The idea is that users are able to place their opinion regarding any particular topic and may continue to debate/argument on it with other users, whether or not views are alike. Debates may go back and forth, however it is up to the user themselves or the judge/moderator to cut off the discussion if it gets too heated.

================================ ##Concept## News is information that should be represented purely with straight facts to provide education to the reader, but with many different news outlets with many different opinionated writers and journalists, sometimes articles may appear biased towards or against a certain person or group represented in an article. When a person reads an article that has any sort of bias in opinion, if facts are skewed or misinterpreted, they may form an opinion based on the writer's opinion rather than pure fact and truth. Versi aims to combat this issue in journalism by creating an online platform that collates articles of the same topic or issue from different sources within human rights and education. This platform is used to spot bias in articles and construct before then conveying their own opinion about the various topics. This is aimed at young adults around the ages of 18-35 as they are generally the most interested and opinionated age group when talking about relevant controversial topics.

Versi at its core is an online discussion board with articles only posted by Versi and moderators. The site will be broken down into categories and the posts will contain facts of an article or event as well as linking to multiple sources. In this there will be a comments section so the users can discuss the topic and argue different views. Some posts will contain polls to voice a users opinion on an issue. There will be a point system that will go off a user's activity as well as the amount of up votes on their comments and for submitting poll answers. The site will also be able to host events and online debates where a specific number of people will be put into a chat room to debate topics with a judge or moderator present. The role of the moderator is to prevent the build-up of tension within discussions, of which could lead to verbal and online abuse/cyberbullying if not monitored. Versi aims at being a well moderated website but will need to allow people to speak freely on any viewpoint.

====================================== ##Team##

Name	Student Number	Background	Project Role	Responsibilities
Ashleigh Armstrong	43408023	Computer Science	Developer	Research, build the web page and mobile framework, aid in testing
Sarah Balsillie	43594195	Multimedia Design	Front-end design, development and testing.	Make design choices in response to feedback and critiques, implement these if possible and engage in user testing.
Zach Yusi	43561768	Software Design	Developer	Develop website structure including database and use of PHP
Jessalyn Santoso	43592780	HCI/Software Design	Designer/Front-end (Project Manager)	Assist in designing the interface, basic developing and user testing, and research in good examples of UX design

Decisions will be made by the project manager, but ultimately the whole group must also agree to it before making any major decisions which could potentially make drastic changes to the project. Logistics are not of major importance for this particular project; transport and equipment is not required (individual possessions/resources excepted i.e. laptop), and each team member is individually responsible for attending and participating in group meetings. If a member is unable to attend a meeting, he/she must let fellow members of the team know preferably a day in advance, unless unexpected personal commitments/matters come up.

Poor performance of any team members must be resolved through communication, if that alone is not enough to resolve and come to an agreement within the group, only then may it be taken to discuss further with the tutors. If in any case conflicts exist whether regarding the project or between group members, the project manager may be able to step in to help decide upon what should be done to solve the problem depending on the what the conflict is and how it may affect the project.

============================================== ##Communications## Outside of the workshop hours that this course has provided us with to meet up, Quatrio will be meeting at UQ on Thursdays 12-2pm most likely around GP South. We have decided that our primary communication will be made through Facebook; the group page and a group conversation in Messenger, as Facebook seems to have been something we have all adapted into our everyday lives. As for the files and documents, they have been created through Google Drive so that editing will be easy for everyone to access and collaborate at any one time. The file name conventions has not been particularly set to anything uniform, however when submitting possibly “DECO3500Quatrio_docname.filetype”.

=========================================== ##Plan## ###Project Phases###

• Research - Jessalyn, Ashleigh, Sarah and Zach
  • Research current online forums and how they are structured i.e. how the forums are moderated
  • Research voting systems i.e. upvoting and downvoting, vs assigning frequent users badges. Figure out how these different voting systems boost user moral and find out which ones encourage users to keep using a website
  • Research ways to host live debates and how to maintain fairness in debates. Look into online debate hosting web sites and find out how they structure their debating sessions and decide what structure works best for Versi. Additionally, research debate moderation methods
  • Research aggregators and web search APIs to use to gather data from various news articles with similar to the same topic
• Requirements
  • Ensure the website is accessible on a mobile platform whether through an app or web page (mobile-friendly)
  • Ensure the mobile version of the site is fully functional i.e. can host debates without crashing, aggregate and display facts and can support multiple users
  • Design must be consistent on both website and mobile platform
  • Opinions/debates should be discussed in a professional manner
• Design
  • Use marvel and illustrator to construct sketches and prototypes of the interface
  • Interface designs must show clear navigations around, in order for it to be user friendly
• Construction
  • The project will be built using PHP, CSS, HTML, JavaScript and MySQL
• Testing
  • Testing will occur after the build phase is complete. It will consist of both unit/code testing and user testing
• Milestones
  • The project will be split into 3 main sprints
  • The first and current sprint is the research and design sprint where all research tasks and prototype designs of the project will take place
  • The second and largest sprint is the build phase. This cycle is where the design will be implemented. All team members are required to participate in the build phase
  • The third phase is the testing phase where the product will undergo immense testing. All bugs, errors and user complaints will be fixed as well in this phase

###Key Dates###

• Oral Pitch - 2/09
• Project Proposal - 5/09
• Research - 14/09
• Progress Presentation - 16/09
• Design: Mockups - 22/09
• Design: Non-functional prototypes - 23/09 (in workshop)
• Build: Facts boards- 7/10
• Build: Website outline - 7/10
• Build: Database - 7/10
• Progress Presentation - 7/10
• Build: Connect front-end and back-end of website - 12/10
• Build: Debating system - 21/10
• Progress Presentation - 21/10
• Testing - 25/10
• Final URL and optional presentation - 28/10

=================================== #Process# ##Research## Versi contains similar features to an online chat room and to guide the building of the product research was conducted into how these chat rooms work. We found that with newsgroups, similar to what Versi aims to achieve, the chat room community needs to be designed in a way to allow the users to develop relationships over time as opposed to a normal chat room where users interact briefly (Sveningson, Malin 2001). Upon realising this, the research conducted before building Versi became focused on other established online newsrooms which share similarities to what Versi aims to do. One in particular is Reddit. Reddit is a social news website and forum where stories are socially curated and promoted by site members (Rouse, 2012). Reddit is widely successful and it was important to find out why. According to Sjoberg 2013, reddit’s popularity is attributed to how much control they give their users. Additionally, the same study found that the users’ ability to control what content is featured on the home page by either thumbing them up or down. Another reason why the site is popular is that redditors are able to form communities with like-minded individuals and only subscribe to topics they find interesting (Sjoberg, 2013). This was integral information needed to assist with building Versi. Though Versi focusses on less topics than Reddit, it is important that users have the ability to communicate with people who share similar interests with them.

Another important area of research was to find out how make users feel safe to share their opinions. Studies show that the majority of social media users are shy online and withhold their real opinions (McNally, 2013). The same research found that users are more comfortable to share their opinion if they feel other users will agree with them. Additionally, using a level of anonymity in a chat can push important issues to the forefront because a person can comment without fear of repercussion creating more meaningful dialog (Claywell, 2016). The same research also found that anonymity helps in generating unbiased discussion as users will feel more comfortable sharing. This is important as Versi aims to deliver facts and support factual conversation among users.

It was also important to conduct research about how to get users to keep using Versi. According to (AddThis Academy, 2016) these 5 tips are helpful to get users to keep using the site:

• Personalize the Website
• Highlight new content.
• Provide new and returning visitors with relevant information
• Curate a featured section.
• Suggest content users may like.
• Showcase What’s New and Popular
• Highlight new content.
• Keep popular content front and center.
• Emphasize highly shared content.
• Create a Good User Experience (UX)
• Make sure the site is clear and well-designed.
• Make sure the site is usable — on a computer AND a phone.
• Engage Users through Email
• Collect emails through the website.
• Regularly communicate via newsletter. *Reward the Brand Advocates/ Frequent Versi Users
• Offer a personal acknowledgement.
• Give public recognition through social media or your website.
• Implementing a loyalty program.
• Launch an “insiders” referral program.

Finally research was done into choosing a suitable colour pallet for Versi. The team looked at the colours used by current social media sites- Facebook and Twitter blue, Whatsapp and iMessage green and Snapchat yellow. Research found that the colour purple has a relaxing/ tension relieving yet mentally energising effect. This colour was chosen to be the theme for Versi as the site aims to challenge users’ to share their opinions but at the same time be a place where they feel safe and comfortable to speak freely. (Art Therapy, 2016)

##User Testing Results## Once the Versi protype was built a series of user testing was conducted to assess the ussbility of the Versi site as well as the user experience. The site was tested with 20 participants between the ages of 18-60. The methods of testing used were observation, interview and survey. Within the observation method users were asked to navigate through the site, engage in discussions and attempt to join debates. Upon observation it was found that the majority of users were able to easily navigates through the pages, as well as to register and comment with no issues and is able to fully explore the website without any issues. Users were also easily able to understand the context and content of the site. One issue that users seemed to have a hard time figuring out was how the debating worked, users did not understand the original layout of the debates as well as where to find the relevant events. As a result this was redesigned in the final product. Within the interview method, users were asked a series of questions after navigating through the site. These results showed that users found the website easy to navigate, with the exception of finding the different topics. This was fixed by implementing a dropdown box to get to each topic. Additionally users were able to easily understand the context of the website and found signing up to be fairly easy except for there being too many options on the registration and login pages. As a result these pages were redesigned to be more simple for users to use. The survey method seemed to show similar results as the previous methods of testing. Users found the site genreally easy to navigate and also found the registration and login forms to be too crowded. Additionally multiple users suggested upvote and downvote icons be added to the commenting sections.

Overall users found the site clear and easy to use. They also found the content easy to understand and also found the context of Versi clear to interpret from the site.

##Use Context## Users would use Versi when they want to get less off a biased opinion on a certain controversial topic.They would also be attracted to the site if they want to share their opinions on the topic with like-minded people and also if they want to be able to have discussions and debates on the topics with other users.

#Requirements# Below are a list of requirements derived from the research above:

• The Versi site should be able to work on both web and mobile platforms
• The Versi site design must be consistent throughout the pages of the sites.
• The site's features i.e. commenting, debate, logging in and registering, must be functional on all pages throughout the site.
• The site will not use too many images or buttons that make the pages look overcrowded or cluttered and hence hard to read.
• Comments will be hidden when they reach a certain amount so there will not be a never-ending string of comments.
• Moderators and editors to post and upkeep the site i.e. post new facts to the site and monitor the debates.
• Certain pages and functions will not be available to users who have not logged in to the site.
• The Versi site will feature simple, easy to use navigation throughout on all the pages of the site.
• All text on the site will be written in a clear font and a readable font size.
• Users will have the options to reply to posts made by other users.

##Design Process## In addition to the decision behind the colour scheme, ultimately, a good user experience design is too make sure that users are automatically interested to the site at first glance and would want to scroll down to find out more to see what this site is really all about. An inspiration for Versi is reddit, however when analysing the design of their webpages, you can see that it is not too aesthetically-friendly. With that, the team decided that having too much text puts readers off from continuing on through their website. The trending section just shows the currently trending articles with an exerpt of the article/facts under each heading. A navigational wordmap is a list of keywords that helps users get around to what they want to see/find as each discussion thread is categorised under a few keywords. Overall, the design is pretty simple with easy navigation.

#Promotional Website# http://versipromo.azurewebsites.net/

#Versi Website# http://versi.azurewebsites.net/

#References# AddThis Academy. (2016). Keep Visitors Coming Back To Your Website With These 5 Tips. Retrieved from AddThis Academy: http://www.addthis.com/academy/5-ways-to-keep-visitors-coming-back-to-your-website/

Art Therapy. (2016). Art Therapy. Retrieved from Color Psychology: The Emotional Effects of Colors: http://www.arttherapyblog.com/online/color-psychology-psychologica-effects-of-colors/#.WBWac-F95E-

Claywell, C. (2016). Pros and Cons of Anonymous Social Media. Retrieved from lovetoknow: http://socialnetworking.lovetoknow.com/about-social-networking/pros-cons-anonymous-social-media

McNally, V. (2013, August 26). New Study Suggests Social Media Users Are Less Likely To Share Opinions. Retrieved from The Mary Sue: http://www.themarysue.com/social-media-opinions/

Rouse, M. (2012, 09). Reddit. Retrieved from TechTarget: http://searchcio.techtarget.com/definition/Reddit

Sjoberg, L. 2013, Reddit, Condé Nast Publications, Inc, San Francisco.

Sveningsson, Malin. (2001). Creating a Sense of Community. Experiences from a Swedish Web Chat. Linköping: Linköping Studies in Art and Science.

##Tags## Social and Mobile: #CSCW #interaction #discussion #debate #controversial

Journalism and News: #humanrights #global #bias