Documentation
Figure 1.0 - The Project Poster
Figure 2.0 - The Project Flyer
Prototype 1: Design Mockups
Prototype 2: Final Web Prototype
- Download or clone the repository to your computer
- Extract all files if downloaded as a zip file
- Open world.html with any web browser you like
- Now you can play around with the prototype
The recently trending problem of 'Fake News' is concerned with the rising number of misinformation produced by mainstream media outlets. In particular, domain research revealed several alarming trends, starting with the fact that many modern-day web surfers use social media as a primary source for news stories. This becomes a serious issue, as it has been found that the majority of people do not fact-check the articles they read, and studies have shown that false news stories are actually more likely to become viral and gain increased social media spread. An exploration of the current solutions (such as prominent fact-checking sites) revealed that existing measures are underutilized and fail to provide users with a real platform to address their cynicisms; they are expected to believe the findings of the site itself. For many users, fact-checkers aren't needed; they simply stick with an outlet which aligns with their personal beliefs, and this creates dangerous 'filter bubbles' when people aren't considering any other perspectives when it comes to controversial issues. Fact-checkers don't encourage users to interact with other users or spread the word, and thus such services are unlikely to be able to even compete with the spread of fake news stories. A new solution is needed – a place that all users can turn to, whenever they're faced with disputed topics in the news or through social media.
Team Drop Table* was determined to conceptualize such a solution, and developed 'The Truth Table' (TTT), a community contribution focused web application which tackles all debated issues by aggregating numerous news sources of opposing positions for each topic. Users are encouraged to conduct their own research, and sources are filtered by the user base through a voting system which dictates which sources are deemed reliable. TTT's goal is to grow a user base of intellectual truth-seekers who invite others to join them in debating controversies with other users, all with the collective objective of finding the 'truths' of a matter. The list of proposed TTT features are as follows:
-
"Real or Fake": a mini-game in which users guess whether a news headline is real or not, and find out what percentage of other users also got it wrong (or right). An addition designed to introduce users to the idea that it is difficult to distinguish hoaxes from real news, when it comes to modern day mainstream media.
-
About/Rules: An explanation of TTT's mission and background, and a list of community guidelines for what is permitted for TTT's submissions and comments sections.
-
Categories and search for topics: A search bar for matching topics given key words, and numerous common categories for filtering topics.
-
A 'topic page' for each new issue: TTT and its users create a new topic for each disputed subject that occurs. Each topic page contains
- An overall description of the topic
- A list of articles (with links) from various sources. Users upvote sources that are deemed reliable
- A comments section intended for discussion about claims and debating the facts
-
My Table: The ability for users to save topics for reference to a dashboard-like interface, with customization options. Intended for users to be able to easily organize and visualize their findings history.
-
Social Media integration: the ability for users to register with their social media platform of choice (i.e. Facebook, Google, Twitter), and be able to directly share TTT links on numerous other platforms.
Note: Full product scope. For prototyping purposes, not all listed features were implemented or functional.
The project went through several prototyping phases with the same design iteration process. As with each cycle, team gained more user feedback and ideas toward the final prototype. To start, we established design ideas and concepts by looking at the requirements and identifying the associated domain and user needs that would need to be fulfilled. The concept of Fake News and misinformation was established as being a domain where users primarily wanted to discern fact from fiction but ideally we would want a way of combating the fatigue that comes to be associated with an overload of fake news. This means we would want to able to make it enjoyable or at the very least not boring so the solution would be more accessible to more users. We did this by taking inspiration from existing solutions and then expanding upon them to more accurately fit the solution into our problem space. The main inspirations for our designs were Newsvoice and Would You Rather (WYR) due to Newsvoice’s news aggregation and community style and WYR’s ability to be entertaining especially when we applied its style in the context of our Real or Fake module.
In the process of prototyping, we primarily used Figma and Web design tools. We created a low fidelity prototype using Figma and after appropriate user testing using the Figma prototype, created a high fidelity prototype using HTML, CSS and JavaScript for further implementation and development.We iterated on each prototype based on user feedback gained through user testing and interviews in conjunction with academic research conducted through literary review and observation.
The process of user testing was conducted by user data gathering and interview questions. We conducted prototype interaction observation sessions to set task performance benchmarks and to collect results and suggestions on usability and design from users. From this, we evaluated and analysed the collected user data and feedback in order to identify trends and what needed to be improved or changed based on user feedback.ons based on user feedback
- James was responsible for designing Real or Fake and project management in designing the news aggregation portion of the website.
- Ivan was responsible for prototype user testing, the site's comments section, and several latter Figma page designs.
- Qishi Zheng was responsible for determination of the technology stack of the project and development and maintenance of the interactive prototype using HTML, CSS and JavaScript on GitHub.
- Elliot was responsible for UI and prototype design and creation of promotional materials.