Task 10: Attention Economy

This task was so much fun to complete, and got me thinking about two things in particular: distractions in user interface that purposely try to grab our attention and the effects of good/bad user interface on overall user experience.

The online game for Task 10 had various kinds of distractions to keep us from completing the game quickly. Below are a few that I found particularly annoying when doing this task:

  • The “hurry up time is ticking” pop-up that was first, insanely difficult to close, and second, popping up way too often
  • The “how can we help” box at the bottom right that blocked the form we had to fill, and then really took its sweet time going down
  • The extremely large, bright red banner at the top about cookies

In terms of UI and how bad it was in this game, here are some features that really frustrated me:

  • Text commands that contradicted the visual components presented to us, with random bits capitalized or underlined
  • The password requirements using too many modal verbs
  • Drop-down menus that were not in alphabetical or chronological order when  they should have been, or were in alphabetical order when it was not necessary
  • No option for “select all” when we had to actually select all the images
  • A row of check boxes that were initially hidden because of a page scroll which was only noticed after reaching the bottom of the page
  • The entire section with the pictures, check boxes, and terrible instructions

While the UI of User Inyerface is terrible–and purposely made to be that way–it is definitely not as atrocious as some of the UI I have seen on other websites. As I have been surfing the Japanese side of the net more often since immigrating there, I have come to notice the stark contrast between Japanese webpage design and the more minimalist and sleek designs of Western websites. With “the walls of of text, lavish use of bright colors & 10+ different fonts”, Japanese websites are often headache-inducing, distracting, and a challenge to navigate (Missbichler, 2023). It feels as though the goal of Japanese UI and UX is to cram as much text and visual imagery as possible in the available space. For online shopping websites, this information overload can be a method to push users to make more purchases, or to increase browsing time–something that I have fallen prey to many times.

For those more interested in how wild Japanese web design can be, search up any Japanese YouTuber and look at the thumbnails of their videos. It is a very “the more the merrier” kind of vibe.

It is sad to say that even though I am aware about the tricks and dark patterns in UI and UX, I often still find myself being sucked into the void of the net and of social networking sites. While writing this post, I have checked my Instagram feed and swiped through Tik Tok mindlessly a few too many times, distracting myself from completing this task in one go!

References

Brignull, H. (2011, November 1). Dark Patterns: Deception vs. Honesty in UI Design. A List Apart. https://alistapart.com/article/dark-patterns-deception-vs-honesty-in-ui-design/

Missbichler, M. (2023, October 18). Why Japanese Websites Look So Different – Mirijam Missbichler – Medium. Medium. https://medium.com/@mirijam.missbichler/why-japanese-websites-look-so-different-2c7273e8be1e

User Inyerface – A worst-practice UI experiment. (n.d.). https://userinyerface.com/

Linking Task 8: Golden Record Curation

My Task 8 and Task 8 by Bingying (Iris) Wang

Content-wise, out of the ten pieces Iris and I curated from the Golden Record, seven of them were the same–we both chose to keep the percussion piece from Senegal, “El Cascabel” from Mexico, “Johnny B. Goode” and “Melancholy Blues” from the United States, Japan’s “Tsuru no sugomori”, Beethoven’s Fifth Symphony, and “Flowing Streams” from China.

In terms of tools used, Iris presented her curated list through genially in the form of flags on a world map that, when hovered above, showed YouTube videos of the pieces. My Task 8 unfortunately was just a massive wall of text. Iris’ post is therefore much more user-friendly and allows the reader to make visual and audio connections to the Golden Record pieces she selected. A reader of my post would have to take the extra step of searching for the pieces if they wanted to listen to them–a time-consuming step that I should have considered!

Finally, Iris presented the parameters and criteria for her selection process in a very neat and orderly way that allows the reader to view the reasoning behind her choices right from the very start. Even without reading the entire post, the reader is able to see how Iris selected her pieces by looking at the subheadings in the post. In contrast, for my Task 8, I explained my selection process reasoning after the title of each piece individually. It is quite interesting to see how different our approaches were for this task!

After reflecting on my Task 8 and Iris’, I definitely want to streamline my posts more and make them more user-friendly and interactive, which would allow the reader to gain a clearer understanding of the content with much less hassle.

References

Huang, D. (2023, October 25). Task 8: Golden Record Curation — Didy’s Webspace. https://blogs.ubc.ca/etec540ddhng/2023/10/25/task-8-golden-record-curation/

NASA. (n.d.). Voyager – music on the Golden Record. NASA. https://voyager.jpl.nasa.gov/golden-record/whats-on-the-record/music/

Wang, B. (2023, October 18). Task 8: Golden record curation — Bingying (Iris) Wang-ETEC 540. https://blogs.ubc.ca/etec540bingyingwang/2023/10/18/task-8-golden-record-curation/

Linking Task 7: Mode-bending

My Task 7 and Task 7 by Cody Peters

For this task, Cody and I chose very different tools to mode-bend our original “What’s in my bag?” image from Task 1. Whereas I decided to use genially to provide audio and hyperlinks in my mode-bending, Cody vocalized his task through a Spotify podcast. By giving us a sound sample of the bag itself, we can further visualize the bag itself, and the additional details provided for certain contents in the bag, as well as the manner in which Cody describes them, makes everything feel more real to the listener. In retrospect, I feel like I could have discussed and described the contents of my bag in more detail by providing more background information and reasoning as to why the items were in my bag.

Another key difference in our tasks is how accessible the content is to anyone viewing the post itself. For my Task 7, since the genially URL was inserted directly in the “Add Media” part of my post, the “mode-bending” can be seen right away when visiting my webspace; in Cody’s case, the reader has to click the link provided before they can hear the podcast–an extra, but not too troublesome, step. However, in order to access the links to the items in my bag, the reader does have to Ctrl-left click the blue icons.

Finally, I believe that creating a podcast is probably more time-consuming and needs more effort than what I did to mode-bend. It was fairly easy to use genially and only took me one day to complete this task. All I had to do was record myself reading the descriptions of the items, find web page links, and put those all together. For a podcast, the creator needs to think of a script/what they’re going to say, find or create an intro and outro, and make sure their recording equipment is good enough to ensure smooth listening. That being said, I am definitely considering making a podcast for my final project in this course!

References

Canadian Cultist. (Host). (2023, October 21). Task [7.5] What’s In My Bag? [Audio podcast episode]. In ETEC 540. Spotify. https://open.spotify.com/episode/0xz9gUcXaMOpjCzJlnMH0c?si=cqTt5FnYT1e-yGfKjS_89w

Huang, D. (2023, October 23). Task 8: Golden Record Curation — Didy’s Webspace. https://blogs.ubc.ca/etec540ddhng/2023/10/23/task-7-mode-bending/

Peters, C. (2023, October 20). Task [7.5] What’s In My Bag 2: the Vocalized Boogaloo | etec 540 cody peters blog. https://blogs.ubc.ca/codyp540/2023/10/20/task-7-5-whats-in-my-bag-2-the-vocalized-boogaloo/

Task 9: Network Assignment

Before this task, I thought I was a visual learner; however, after looking at our class data on the Palladio app, I was incredibly confused, overwhelmed, and just ?????, and I wondered if others in the class also felt the same way!

During my first attempt at analyzing the data, I was able to figure out that of the six communities formed, I was part of five of them. Then after playing around on Palladio some more, I was able to find the list of the Golden Record tracks sorted by size from largest to smallest. By looking at this list, I found that out of the top ten pieces selected by our class (Tracks 25, 18, 3, 23, 24, 14, 7, 1, 9, and 20), seven of them were those that I included in my curated list (Tracks 25, 18, 3, 24, 14, 7, and 9).

While the visual representation generated on Palladio is a great first look at the data of our class, I believe that there are some limitations. The visualization of this data can show us which pieces were popular, as well as the links between classmates that chose similar pieces, but there is no indication as to why these pieces were popular, or everyone’s reasoning behind their choices. Only after looking at the webspaces of my classmates was I able to see that we all had very different criteria when it came to our selection process–some selections were made with musical/cultural diversity in mind, while others were made based on emotions and pure feeling. These differences in our selection process criteria make me wonder about the validity of the list in the above screenshot, and whether or not the data would be more valid had there been some sort of rubric everyone had to follow when selecting their pieces. I would also love to see a detailed explanation of the criteria used for the Golden Record itself!

Linking Task 6: An Emoji Story

My Task 6 and Task 6 by Richard Payne

There were a few differences but also some similarities between Richard’s Task 6 and mine in terms of content, execution, and formatting.

Whereas I chose to do my emoji story on a modern Netflix series, Richard went with a classic fable that is familiar to many. As a result, more people were probably able to identify what story Richard was describing in his task versus the TV series I described in mine. Furthermore, the plot and characters in Richard’s story seem to be easier to describe in emoji form compared to the complex setting and many characters in my emoji story. The familiarity and gentle visual imagery of Richard’s task therefore allows the reader to identify his chosen story more easily and quickly compared to when the reader tries to tackle mine.

Richard also separated the title, character/setting description, and plot in his post, making his emoji story neater and easier to follow along. He also included arrow emojis to narrate the flow of the plot, as well as commas and ellipses to signal pauses. I only used commas in my task, but could have definitely used a wider variety of punctuation marks to create more changes in mood and tension in my emoji story.

Finally, while most of our peers used colons when describing the title of their chosen works, Richard and I both used colons when it came to describing our characters’ backgrounds and the story’s general setting. This was not explicitly asked of us in the task guidelines, so it is interesting that we both made this choice when doing Task 6.

References

Huang, D. (2023, October 15). Task 6: An Emoji Story — Didy’s Webspace. https://blogs.ubc.ca/etec540ddhng/2023/10/15/task-6-an-emoji-story/

Payne, R. (2023, October 13). Task 6, An Emoji Story | Rich 540 Text Technologies. https://blogs.ubc.ca/540rp/2023/10/13/task-6-an-emoji-story/

Spam prevention powered by Akismet