“Navigating Information

Process blog for Project I: Navigating Information (MDes/MPS Communication Design Studio, Fall 2017)

The first day of Communication Design Studio starts with guessing the functionalities of how a bunch of toys work through their appearances, and it turns out that our previous experience of the toys largely shapes and amplifies our way of cognition. Utilizing our previous experience, therefore, becomes a quite significant method to clearly convey ideas and thoughts through Communication Design. Also, figuring out how various cultures and backgrounds impact differently on people’s behavior opens up a very interesting topic for me to further think about. Since I came from an art background, when making artworks using various kinds of materials, forms, or themes, I usually thoughtfully consider the context behind the materials, forms and themes, which would significantly affect the way audiences understand my works. As a result, I found the way of communication design conveying information is a little bit similar to the way we understand an artworks, while the biggest distinction probably is the accuracy of information delivery. That being said, a good piece of artwork tends to provide a open way to be understood, specifically the misunderstanding of the artwork become unnecessarily a bad thing, on the contrary, a design product that delivers a wrong or misunderstanding information would fiercely sabotage users’ experience, which somehow is unacceptable in the field of design.

Toys that Prof. Stacie brought to class

Instead of introducing ourselves one by one, professor Stacie then asked us to answer a few of the questions she prepared with stickers on the white boards, and the fun part of it is that we are required to classify those different answers into categories, which brought her next topic of how we organization information. The question I was working on is “What do you want to do after your get your degrees?”, that wasn’t a hard questions to classify, but there still existed some answers mixed with each other. And I made several overlapped circles to address the problems, and I found that in my category “Jobs and Money”, there are some answers directly refer to making money while the others are more likely to get a preferred job, thus I added an vertical axis to articulate the range from “money oriented” answers to “job oriented” answers. Ultimately, Stacie wrap up all the common methods we would use for information/ data organization: location, category, hierarchy, alphabet or timeline, base on which we are able to transfer complex data into the easy-to-read ones that people can actually understand.

Information Classification

Visualizing information in order to make people understand and effectively communicate the meaning behind become the skill we are going to learn, and the first project is to deal with news information. I will work with Brendon as a team, see some Alternative news website, like Mother Jones, and try to figure out what is the features of the overall structure of these websites, and also analysis the similarities and differences between them. Moreover, we are also attempting to distinguish the differences of the contents, images and graphic design from various news websites reporting the same news events, so that we could better understand the stance and perspectives behind these surfaces. (29/08/2017)

Stacie’s Board Writing

News Source Analysis, Part 1 (30/08)

The Frameworks of “Mother Jones”, “AlterNet”and “In These Times”.

When browsing on different news websites, I was amazed by the fact that even these similar news websites are actually using so different design styles to deliver information, which I’ve never consciously noticed so much. I initiated my analyses by paying attention to the overall layout of these websites. As the three websites’ frameworks above, all of them are using the top menu to navigate the whole structure of websites, and the top menu breaks into different categories which provides a link to each subjects that users may have interest, like politics, foods, environment etc. Also, they all set their LOGO in the top-left conner instead of middle, which gives more space for buttons like sharing or searching.Another similarity they have is that the they all settle the News Headline on top left with a relatively big picture. The first big differences I noticed were that “Mother Johns” and “AlterNet” separate the webpage into two vertical grids, while “In These Times” is designed into three grids, which may display more information on one page. Moreover, when scrolling down a little bit, we can always find that these websites converge informations into sub-groups namely “Most Read”, “More Top Stories”, or subject news group like “Rural Work” etc.

In addition, it is easy to notice that “Mother Jones” is more likely to adopt large image with relative a few headlines or texts bringing a sense of minimalism, while “AlterNet” seems to have more intensive pictures which leaves user a strong and quick expression of what is happening(I think people are more good at reading images than texts). On the other hand, “In These Times” seems trying to put as much information as possible in their front page, which is a little bit crowded and “noisy”. Among those three, I have to say I like the design of “Mother Jones” most, because it conveys information very directly and clearly by limiting the information appearing on the front page.

Simple Data Visualization of features among 5 Alternative News Website (Mother Jones, AlterNet, Common Dreams, In these Times, and Truth Out)

Then I started to collect information and data that appear on those websites, the chart above, in which I attempted to add different colors to visualizing these data, could probably convey a much more clear picture about their differences. Especially, we can see most of the first line’s blanks, Mother Jones, are tagged with red, which means a lot of buttons, colors, information or complexity are not adding into its front page. Consequently, its webpage would look more clear and simple, which totally match with the conclusion I got from the frameworks. By contrast, there exists more green blanks in Truth Out or Common Dreams, which could be interpreted that these websites are complicated. Besides, a little detail came to my attention that all of those websites are using sans serif font for the navigation menu, on the contrary using serif font for the contents.

Different News Headlines of the Same Event of Trump’s Moscow Tower Deal ( from left to right, top to bottom,AlterNet, Mother Jones, Truth Out,Daily Beast)
Screenshot of Trump’s Moscow Tower Deal News on “Mother Jones”

Then I choose to work on “Trump’s Moscow Deal” news from different sources for comparison. The the fonts of news title are usually bold with bigger size, and the serif font used by Truth Out seems to be not as commanding as the bold anb sans serif font gives people. I really like the image using in Mother Jones, for the bright orange background of the picture not only offers a powerful contrast, but perfectly matches to the orange color of the icons and some text color, and I have to admit that Trump’s seemingly confident or hesitated look attracts me as well.

Images with titles using in Trump’s Moscow Deal News Report ( from left to right: Truth Out, Daily Beast, Mother Jones)

Thinkings about a class discussion (31/08)

In Thursday’s class, when discussing different sources of news websites, we all noticed that most of these news sources barely offer other perspectives of the same events, which significantly narrows down users’ vision to perceive the event from a holistic picture. For example, people stand for left leaning could seldom read Fox New which offers right leaning political perspective, nor would the people from right leaning browsing on New York Times probably, as a result, people from one camp would never know the merits of the other camp. Moreover, some news platforms or Apps would even optimize their information delivery by blocking some news in which they think users may not be interested by using advanced Machine Learning algorithm, thus it is highly possible that users keep unconsciously reading the news from only one angle instead of through a unbiased one.

As a designer, sometimes it could become a paradoxical choice: on one side, we would like to provide better user experience by making them achieve news information very efficiently, rather than letting them read numerous irrelevant or tedious news reports they don’t like to; on the other side, we also should be responsible for the news selection without being bias. But I have to admit, it wouldn’t be an easy task. What if being unbiased means sacrificing user’s experience or even losing them. Should we be responsible for the product we are designing or should we be responsible for the responsibility that we feel like to hold? When we talk about user-centered design or human-centered design, does it mean that the user’s experience and demands should be our priority, or should we look from a more holistic and humanity perspective that being unbiased and critical should and always should be the first priority of being a designer. Maybe it is not a dichotomy, like the Dan Saffer said in this book “Design for Interaction”, designer should always find the third and the best solution rather than choosing between between bad options.

A TED talk that Prof. Molly shared in her Syllabus comes to my mind, that Eli Pariser talks about the so-called Online Filter Bubbles which has been widely used in Big Tech Companies, like Google, Facebook etc.

Eli Pariser’s TED Talk, “Beware Online Filter Bubbles,” 2011.

The talk also reminds me the shocking event of Wei Ze Xi happened in China last year, in which a false advertising of Pu Tian private hospital promoted by Baidu ( the most frequently used searching engine in China) leaded to the death of a young man named Wei Ze Xi due to his missing the best time for treatment. Google’s moto “ Don’t be evil” seems not being executed by his counterpart in China.

Algorithm is efficient and constantly being executed line by line, but it never considers and judges its moral justice, but we human beings do. It might address the problem if we are able to add moral recognition into a machine making it feels the same way as we do, and it might also be a very interesting topic to think about it as an interaction designer as well as as a computer scientist. Nevertheless, one must also realize that setting the boundaries that designers or product managers should never across could only be accomplished by human beings, who have empathy, love and guilt.

Sketches of the comparison of Alternative News Websites (Mother Jones, AlterNet & In These Times) (04/09)

Mother Jones:The design of Mother Jones website is delicate conveying a sense of minimalism and fresh. I could easily find the information I need, or navigate from news to news. The website cut down a lot of information or buttons that are not frequently used, thus there is nothing redundant. In addition, the images in the website seems to be carefully selected, matching the color or design style in the website. The image size is relatively large, which makes easy to read, since reading pictures is much easier than reading texts.

AlterNet:

In These Times:

The Analysis of Alternative News Websites (06/09)

Unlike BBC, ABC or New York Times, alternative is a non mainstream leaning, so it has its unique problems of trying to sell people on its ideology. To solve that problem, these three alternative news websites’ ( Mother Jones, AlterNet, and Truth Out)approaches and strategies varies a lot.

Before I delve deep into the analysis, I would firstly point out a feedback circle that would affect their approach, and the circle contains three key elements, which is the Finance(Money), History of credibility, and stragety. These three elements, somehow, forms a interactive and feedback circle, which significantly influents the way of their “selling” strategies, as well as the design of their websites.

For instance, Mother Jones was first published in 1970s, and it has the longest history of these three news source, it is also the most famous of these three, since it has a long history to build up its credibity. Therefore, it would be reasonable to imagine that with its mature donation system and subscription, it won’t have so much trouble to get finance support and users. Thus, they focus their energy on providing thoughtful and nuance analysis, delving deeply of one piece of news, without selling too much for its users.

However, unlike Mother Jones, AlterNet and Truth Out are both founded around 2000s, which is a pretty short time for a news source, (by the way, BBC has been founded almost for 100 years). Therefore, as non-mainstream new sources, they are still getting through a hard time of selling its ideology and achieving their users. For AlterNet, they tries to grasp users’ eyes as quickly as possible. That makes sense, because they don’t have the time to gradually build their credibility, nor does they have the money to do so. What they want to achieve is to catch your eyes at your first glance.

Nevertheless, Truth Out chooses a different approach, what they would like to do is to offer the diversity and thoughtfulness at the same time, which isn’t an easy job. And obviously, they didn’t do it well. But whatever, they still try to implement the strategy of providing its. So, on one side, they attempt to offer thoughtful long stories and simultaneously try to draw people’s attention. These two strategies somehow conflict to each other.

When we go back to our influential circle, it becomes not so hard to understand all their strategies, and each of them, in one way or another, all makes sense for its own situation, but when we talk about their news websites, we can see how do they implement their strategies on the design of their websites.

Reflection of White Board Presentation

Doing presentation and telling a story in front of a group of people is never an easy job, but it also reminds me things that are easy to ignore even after many times of rehearsal.

One thing I found interesting during the presentation is that even though we were asked to corporate the sketching and speaking simultaneously with two people, there is still one group that chooses to speak and do the sketching by one’s self. But unexpectedly, such a performance drew people’s attention much better without the sketcher being distractive . Meanwhile, the disadvantage is also obvious that it takes time for speaker to slow down his/ her speaking pace in order to finish the drawing, such a scenario is especially notable for a complicated sketching. Never the less, let aside the disadvantage and advantage of such approach, it does prompt me to further rethink how sketching and speaking relates to each other and then influents audiences’ listening experience.

Moreover, the thing I also realized is how powerful the sketches could be when someone is making an argument, using complicated facts and evidence to support his opinion. I believe most people are not good at organizing abstract or a large quantity of information through other person’s talking, because it’s more or less difficult for speaker to give listeners a sense of hierarchy during the speaking, even if speaking tries to point out “ Firstly, Secondly…”, or utilize “pause”, it’s still hard for user to catch up immediately, since these signals are very likely to be missed. Good sketching or diagram, by contrast, demonstrates a clear hierarchy. This is particular significant when a great deal of information tends to be compared. This idea could come to me when I left to bathroom for a while, and by the time I came back, the presentation had already finished about a half, but I still could catch up with speakers due to the clear and well-hierachied sketches.

Another thing I learned from this practice is how to verify an argument by telling a story. Convincing people with an opinion demands many skills, and nobody is willing to be preached. Thus instead of directing pointing out the tedious facts to support my argument, I could start with some other intriguing and related facts seducing people’s attention, and then put these fact into reasonable assumptions that sequently stands for my point of view, organzing all the facts into related and reasonable story. In fact, it is what we attempt to do in our team’s presentation. Initially by mentioning a feedback and interactive loop containing Finance (money), History of credibility, and strategy, we then exemplified how these three components work in the three news venue. As a result, audiences are more likely to be convinced, even though many of our arguments came from un-solid assumptions.

Design Jam ( 14/09)

During the design jam on Thursday, we firstly attempted to classify different features of the news websites collected from all teams. My team was assigned with visual structure, which I thought easy to deal with, but turned out to be not. Since every group used different ways to category their website’s visual structure, thus some of the posters looked very confusing. We attempted to firstly put them into two simple groups; one is with clear hierarchy, while the other group is not. Nevertheless, some of them still could not fit into any of these two groups, therefore we create another group, which is layout. Moreover, we also tried to connect different posters with the same websites together, to make it more easy to iditify. Stacie mentioned that there are other ways to do that, such as classify them with linear or not etc. But I think I still didn’t find the best way to do that.

Then we were trying to use some toys, blocks and puppets to tell a story that is able to inspire citizens to become well-informed news consumers. It is pretty challenging to do the brainstorming within a short amount of time, but it’s fun though. Brandon came up with the idea to design a service for the storytelling that conveys that concept that everyone should read news from different sources and perspectives in order to become a better citizen. Quickly we got the idea to perform a puppet show that uses two characters’ conversation to convey this idea to others. When we think about where, who and how, we think of the cafe where people usually read news. Ultimately, the story of a Cafe that serves free and different news formed. Since people get used to choose the news they would like to read all the time, so more or less, we are building a invisible barrier against some other opinions, but with these “ Different News Every Day Cafe”, people hand over the right to choose news to the cafe, and the cafe would randomly select news from different leaning to its customers. Thus in this way, people become more or less awared of other opposite point of view.

When doing the performance, I also use a strange and special tone to act, so that it feels more dramatic. And it turned out to be very successful, people are more likely to concentrate and understand the concept with fun. But there is still more thing we need to think about, and delve deeper to a thoughtful intervention idea to push it further.

Design for Intervention

We were trying to bring ideas of design for intervention, and at first the concept of design for intervention is a little bit confusing to me, and I started to wonder what the differences between normally design a service or design a product. Stacie then clarified that design for intervention is more like to change users behavior even stop them from doing what they used to do, and then help them think critically thus further to change their behavior.

The brain storming from our team started from what we left last class-the “ different news everyday cafe”, and we tried to make users to read news from different perspective in order to help them become better-informed citizens. we attempted to identify the “good” and “bad” in our previous idea. But the biggest question left is how do we incite user or customers to read the everyday’s news. I came up with an idea to design a game in this service system, making users feel like reading different sources of news is playing a fun game.

So we tried to make people guess the news sources by providing them with the news without brand titles. And the one whose guess is right could get a discount coupon for the next time consumption. Even though this logic seems to work but Stacie mentions the venue for which we design this service. We might be able to go further and apply this in websites or even imbedded into ADs in social media.

Design for Intervention II (22/09)

We tried to expose user in different points of views with a game-like news reading experience.Firstly, Blendon came up with the idea of news Booth, that invites users to read the news and then try to guess the source of the news. But Stacie pointed out a fact that the News Booth design is too game-like, rather than provoking critical thinking. She suggests that we should try to focus on how to make users realize our intension behind. That really set us in stuck. We discussed a lot of how to make users rethink their bias after knowing the guess results, but things didn’t go well, and both of us feel frustrated and exhausted.

I think design is alway moving back and forth. After a long discuss, we finally gave up new booth idea, and went back to our orienginal APP idea. We thought that we should find a hook to incite users to start using our APP. As such, Facebook ADs seems to be a obvious choice, since most people nowadays read news through social media. We attempted to provides quiz that encourage people to click and identify their bias. Once they clicked the quiz, they would jump to a Facebook mini-game to start reading a piece of news and then guess the bias, such as left leaning or right leaning. Then the mini-game shows the right answer and further incites them to download the APP and play with their friends.

When they landed on the APP, they will be provided several randomly selected news, and guess the bias once finishing reading, the APP reminds you what kinds of bias you have, and hopefully help people to overcome that bias over time. We want our APP experience like playing a game, so we add some functions like challenge your friends or finish certain mission to get achievements, as well as competing with friends. These feature will help people to use the APP repeatedly.

Design for Intervention Presentation (27/09)

Every group presents their ideas during the class. I was fascinated with so many great ideas that other groups came up with. Most group choose different approach to address a very similar problem: how to help people identify their news reading bias and help them to overcome it. Nevertheless, some group choose to use data visualization to show how filter bubble or bias existed in their unconsciously reading habits; while others attempted to use direct intervention to help them overcome that kind of bias.

Pages from the Zine- News Warrior

People really came up with interesting and quite distinguished way to do that, some even has the idea to use a minibar imbedded in the browser to visualize the bias behind. But there comes one question: how to define bias? How could we define whether a article is left leaning or right leaning, as well as how left or how right it is? One group proposed to use Nature Language Processing (NLP) to deal with it, but is the technique accurency enough? What if this machine also have bias? Since even the same news source and author might hold different opinions regarding to different questions. That’s the question that Zach asked in the class that we couldn’t answer very well.

Pages from the Zine- News Warrior

Furthermore, Stacie challenge us by asking how to help users to further think about their guess result, like asking why they have such bias and how to help them overcome it. I have to admit that even Brendon and I have devoted lots of time into discussing and try to answer these questions, we still didn’t find a answer that is good enough, which lends us to further think about, maybe in out next project. But I really appreciate Stacie kept asking these questions and forced me to step away from our comfort zone, and think it repeatedly.

During the class, we also get a new project that is to use animation to articulate a somehow complicated concept, which sounds a lot fun. But I get the topic of Flesh eating disease, which is super disgusting. But I have to say it is also an interesting topic to visualize, and I am kind of enjoying the challenge. I’ll see what I can make.

One clap, two clap, three clap, forty?

By clapping more or less, you can signal to us which stories really stand out.