1) Continue to improve your high-fidelity prototype.

Our prototype was already almost ready to test. We only fixed a few errors and then called it done.

2) Conduct the first and second phases of a heuristic evaluation

Phase 1: Prepare

Phase 2: Evaluate (Individual Inspection)

The results of our individual evaluation are available here.

We tested the prototype of group Scenic Route and found violations in most categories. Most of the violations we found were of severity 3. We used the tasks from their assignment submission for our evaluation.

The descriptions of our violations and the Screenshots can be found at the bottom of the survey above.

We used screenshots-Chrome AddOn for screenshots.

A summary of important issues can be found here.

Reflection

Who made what contribution?

We discussed the tasks and Phase 1 together and the split up to do Phase 2 individually. Clemens wrote this blogpost.

What did you learn?

We improved our skills with Google Forms again and now know how to create multiple pages. It was also interesting to use the Figma prototypes of others as that gave us a better understanding on how we should adjust our prototype.

What went well?

Communication with the team again went well. Again, we are also happy with the direction that we are going to with the prototype and look forward to the feedback of other groups.

What would you like to improve?

We would like to improve the prototype further as it does not look as good as it could be.

Formulate a problem and hypothesis statement and document it.

Problem Statement

Mark needs a way to get a balanced overview on a specific topic because he would like to form an unbiased opinion. 

We will know this to be true when we see: can explore different sources for his opinion forming.

Hypothesis Statement

We believe that by building an intuitive overview site showing a range of news articles for Mark, we will double the diverse sources that Mark is using.

Conceptual models for task analysis

To create a conceptual model for the task analysis we opted for Hierarchical Task Analysis (HTA) because the tasks the user has to fulfill fit well into this format and we were already accustomed to this method.

Find inspirations, analogies, and create a moodboard.

Next, we each worked 30 mins individually to find inspirations and envision what theme our application is supposed to have. Additionally, we look at other solutions out there and thought about how we can differentiate us from existing projects. We opted for simplicity and usability as main focus since this is what is lacking most on similar websites.

Create individual sketches.

After discussing our individual moonboards we again split up and tried to think of how the application should look like.

Condense your results from the previous step into a storyboard.

After presenting the design to each other we decided to integrate the best of everything into our solution. The descriptions below the individual pictures describe the idea in detail.

Reflection

Who did what?

We did task 1 and 2 together as a group. We split and did task three individually and then discussed our individual results again as a group. Next, we split up again to do the individual sketches and later decided as a group how we want out application to look like. Arne then merged our ideas and what we discussed into one big, nice sketch. Clemens wrote the blog post.

What did we learn?

We learned how one can merge the vision of multiple people into one core idea and how we can create one UI where the ideas of everyone are somehow represented.

What went well?

The discussion as a group usually works very well. Everyone gets to share their opinion and we are usually all happy with the result. Also, everyone does their work on-time and with good enough quality such that we can focus on further steps when we meet again.

Where is room to improve?

We are sometimes not a punctual to our meetings as we could be.

In the previous week we interviewed three students in our target group and conducted a public survey to get an overview on how the general public forms their opinion on political topics.

In total we received 122 responses to our questionnaire, of which 61% are male and 56% are students. Most of the participants (78%) are younger than 36 years.

1. Affinity Diagramming

Our questionnaire consists of 15 questions, including 13 multiple-choice questions and two text-field questions. We used the responses to the question What are your usual steps when trying to form an opinion on a controversial topic? as input for our affinity diagram because it received the most qualitative answers.

We used miro.com to sort through and categorize the responses. The below image shows the initial state of the diagram.

We sorted the responses into 4 major categories (gray/white) and 4 subcategories (colored). Unsurprisingly, the majority of participants responded that they Look up information when trying to form an opinion. The blue area contains participants that attempt to look up information of both sides of the story. This is our target group because they are willing to understand multiple viewpoints, but possibly lack easy access to websites across the political spectrum.

2. Primary Persona

To form a primary persona we used the responses from our three interviews and the average response to our questionnaire. The majority of facts about the primary persona in the following picture is directly based on responses, e.g. favorite apps and age. The the remaining facts, such as curious or helpful, are simply invented and thought to be well fitting.

3. Scenario

To create a scenario for our persona we used our entire dataset and came up with a story aligns with the primary persona and attempts to describe how application is supposed to be used. WHAT questions are printed in bold and WHERE/CONTEXT questions are printed in italic font.

Each work day when Mark commutes to university with public transportation, he quickly checks his Reddit feed for some minutes in between transfers. On his favorite subreddit, /de, he finds entertaining content. Many posts contain political content, often directly referencing news articles, and comments of other users. Mark wants to read about other perspectives off one post he deems opinionated. He uses the share button provided by Reddit to share the URL of the newsarticle with the app VERITAS. There, he gets an overview of other articles about the same topics. He can easily discern the political positions of the post on Reddit and other articles.
After a long day of studying, Mark is laying in his bed, about to sleep. He just wants to briefly check his Instagram before. He sees an interesting post about US politics liked by one of his friends. The post has some images with text describing a controversy about a US politician. He finds the information shocking and wants to read more about it. He uses VERITAS to loop up the topic he is concerned about and gets a collection of articles he can briefly skim over.

4. Two Use Cases

The following UML diagram depicts two use cases: (i) the administrator updating articles on the political spectrum and (ii) the potential user of VERITAS search, rating, and reading articles.

Reflection

Who did what?

First, we sat together to discuss the results of the interviews and questionnaires. After we selected the responses to put in the affinity diagram we categorized them. After that we split the tasks between us: Arne worked on the primary persona, Daniel wrote the scenario, Mateusz created the use cases, and Clemens put everything together in a polished blog post.

What did you learn?

We were excited to learn about affinity diagrams. Although initially skeptic about its scalability and usefulness, we soon found it to be useful and quickly got a nice overview of the responses.