KnightVision

Researching a Solution Against Dark Patterns

Teejay Moore
TylerGAID
Published in
8 min readMay 5, 2020

--

It all started in my Senior Thesis Design class when my professor Abby Guido asked us to create a presentation about what we wanted to do after we graduate. To be honest, I didn’t quite know yet what specifically I wanted to do. My professor Abby had asked if I had any interest in UX or UI design. I did, but as much interest as I had in it, I felt like I was more interested in UX research than creating a mobile app (which was my understanding of the idea of UX/UI design). Abby then encouraged me to look more into it and see what I would find. She mentioned looking into topics being discussed around UX and mentioned the idea of dark patterns.

That stuck with me, dark patterns. It sounded cool right off the bat. So I took it to the internet and began a journey (and kind of obsession) into understanding what they are and where they come from. This led to interviewing multiple UX/UI designers on their experiences with dark patterns, gaining first-hand perspectives on understanding what they are. I read multiple books and articles on design processes and interface design. All of which gave me a whole new perspective and left me with questions, like…

Are dark patterns ethical or actually practical? Are dark patterns really that bad? If as a UX designer I’m taught to make design which benefits the user, how are these even implemented?

After sitting down and processing my research this is the general idea I concluded:

Dark patterns are not considerate design created for the user’s best interest. Although designers could be considered responsible for them, sometimes that’s just part of the design process. We put something out to test how it works, then as time goes on, we review it and reiterate on it. It’s not always going to be perfect. Even User Experience and User Interface design, is still relatively new. Everyday we are discovering what quality UX/UI looks like and the conversation around internet ethics is still pretty fresh. There is a difference between unethical design and bad design. As of right now, the best protection we have against dark patterns and bad UX is educating users and encouraging designers to do their research.

So I sat with this research and began the process of conceptualizing my solution. After many word maps, mood-boards and sketches, I came up with the idea to design an immersive installation that would educate its visitors on the types of dark patterns and user interface through interactive artworks and sculptures.

Then Covid-19 happened….

So I had to cancel my show and go back to the drawing board. After a few days of more research and banging my head against the wall, I started to ask myself, well what is really being done about dark patterns? If people are aware of them, is there anything really being done against them? So far, the only implementation of a solution against dark patterns, was the Dark Patterns Twitter page. This is where people can post various inconveniences to share with the world what they experience. Although I found this educational, I started to wonder if this really creates change? If people are openly complaining about bad experiences they have against websites is there anything really done about it? It was beginning to occur to me that maybe I should step up and design a UI product against dark patterns.

I felt inspired when reading the book The Best Interface is No Interface to question the idea of designing a UI. Is designing an app or software really what people need? I thought about what user interfaces I use and what influences my decisions on the internet. I took note of applications that I used, one being Google Chrome. This stuck out me because of popularity and because it is customizable with add-on extensions that can be used in tandem with the browser. After a couple of late nights and cups of Cafe Bustillos coffee, I came up with the idea of KnightVision. A Google Chrome Extension which creates a platform for users to rate their experiences on websites and directly report inconveniences they find. An extension users could quickly operate, doesn’t require any software downloads, and if enough people used it, it could inspire the websites themselves to make changes in order to remove the complaints.

Knight Vision is…

KnightVision a Chrome Extension that promotes Internet and Design transparency. KnightVision allows users to report inconvenient interface designs or dark patterns, as well as see what other users have reported. The goal is for users and domains to use this plug-in to promote ethical interfaces, and create more beneficial online interactions.

Accessible

By downloading as a Chrome Extension, KnightVision is easily accessible while using the internet. Reports are viewable to any user on any visited website.

Honest

KnightVision puts the power in your hands. Choose to take action by protesting a faulty user interface or deciding to surrender.

Simple

No crazy buttons, menus, or in-your-face content, simply view reports on any given website or post a report when you feel it’s necessary.

Fluid

KnightVision is not an application which asks its users to spend time using it. It’s here when you want it, open and close it at any time.

Features

Report panels are the building blocks within the KnightVision Extension. They display descriptions for internet discrepancies and are viewable while visit any webpage using the internet. They can be as technical or personal as a user desires. Think of them as a live news feed or review for a website.

KnightVision uses a rating system to determine significant dark patterns. There are two options, Protest or Surrender. If you agree with a specific post, Protest it, to share your mutual feelings. Surrender, when you disagree and you feel a report is just not worth the fight.

When you feel like it’s necessary to Post a Report, you will be asked to scale the importance of your opinion. Do you feel like this is an Unethical Design choice or is it just a Personal Inconvenience? This does not invalidate your claim but gives users and domains a better understanding of the problem.

Highlighting is a feature that gives users a visual awareness of what to look out for. It can also provide clarity for domains to know where specifically they are getting complaints.

Prototype

This video demonstrates opening the KnightVision plug in. This user is curious about what inconveniences people have reported on that page. They find something interesting and click on it to discover what to look out for. They then hit the share button to post it to social media.

Sharing is Caring

Have access to a live stream of reports across any website you visit. Feeds are updated by users sharing their experiences when visiting a webpage. By selecting reports, you can see more details like where the information is located within the website and share them across various social media platforms.

This video illustrates and example of experiencing an internet inconvenience, such as a pop up. Clicking on the KnightVision App and noticing someone else has reported it. Since this user felt like this was also inconvenient they decided to rate the post and protest along with the complaint.

Speak Up

We get it, not everyone agrees. Use the rating system to suggest to take action or decide it’s really not that big of a deal. Whether you want to protest or surrender a report, your voice can always be heard.

This video demonstrates the Posting a Report Process. This user notices this website takes your data as a default setting. The user reports it as Unethical, writes a short description, and highlights where that problem is on the page.

Keep Your Eyes Peeled

We believe in making the internet a better place for all, users and domains. That can’t happen unless you’re on the lookout. Be conscious of what you’re doing on the internet and how you experience it. If you don’t like the way something works or you feel like something needs to change, post a report and let others know.

Design

Name

The name is a play of words from medieval knights and physical night vision goggles. Sharing the product concept of a tool that offers protection and provides a sense of clarity when unable to see.

Logo

The logo was inspired by a night watchtower. I used geometric shapes to illustrate a secure and strong aesthetic while simultaneously not feel intimidating. I pulled the bright green to once again reference night vision goggles, as well as, computers. Using the RGB Green #00FF00, all to give the feel of a contemporary application.

Design System

The design system was created to be simple and user friendly. Since I was trying to create a UI that promotes ethical interface design, my UI had to feel humane. I wanted to pick up on the dark mode color palette to not only reference the dark pattern concept but also utilize the benefits of dark mode (decreased eye strain, and save phone battery). For the color palette, I chose colors that would pop and are also universal for Stop Caution and Go. The icons were designed to build on the Knight/Renaissance theme. I felt like this would be something to make the application feel unique and fully connected to its brand.

What’s next?

If there’s anything that I’ve learned over the past four months of pursuing this project was how much there is still discover within UX/UI design and the design world within it is still so new. I learned how to start thinking an questioning the ethics of UI design. How to pivot ideas when something doesn't go as planned. Also just how important doing your research is (without over researching). It’s basically changed my entire thought process on my understanding of how we use interfaces and their effects on us.

I know there is still so much to improve and explore within this project but I am extremely proud of how it came together in such a short amount of time. It would not have been possible without a dedicated professor and a group of designers who gave up their time to listen to me and give me feedback. My perspectives on design, interaction, and the even world are forever changed and I am optimistic for what the future holds.

Although this is just a prototype, I am interested in pursuing the possible development of KnightVision. I would even love to just further the education of ethical UX/UI and share my research and ideas within the design community.

I just finished getting a BFA in Graphic and Interactive Design at the Tyler School of Art & Architecture and am entering a world filled with uncertainty as we struggle to mitigate the effects of COVID-19. I am still optimistic about what the future holds, especially during these difficult times. As a designer, I hope we can come together and use our creativity to build a brighter future.

Special Thanks

Abby Guido, Senior Graphic Design: Projects in Authorship Class, Heidi Trosts, YingYing Zhang Mark Majdanski, Aidan Lederman Gerard, Anton Afonsky, and Claryse Monroe.

--

--

Teejay Moore
TylerGAID
Writer for

Concept-driven designer valuing thoughtful collaborative ideas. Always searching for new music and new typefaces. www.heyteejay.com