top of page

Privacy.
Pattern.
Protection.

Pickle Jar.

Mockup.png
Overview
My Role

Project manager

Researcher

UX/UI Designer

Tool

Figma

Team

2x primary researchers

2x Secondary researchers

Duration

2 months

My contributions

Project Management

Secondary Research

Concept Ideations

Prototyping

Usability testing

Interaction Design

UI Design

I designed a mobile application to arm students, parents, teachers, and other users with a learning tool to help them feel more secure and protected when encountering manipulative designs online.

mockup.gif

Pickle Jar.
Your Privacy, SEALED.

The goal is to provide a valuable resource to help strengthen the user's awareness, understanding, and sense of security while sharing their personal identifiable information (PII) with companies and digital platforms.

Define

The problem

Dark privacy patterns undermine the user and often force them to disclose information they don’t intend to, leaving users vulnerable to the overcollection of their data, identity theft, loss of time, money, etc. This creates a disconnect of trust between users and digital platforms.

In a study on mobile applications where a total of 240 popular apps were analyzed and 589 users participated in online experiments to find out how they perceive dark patterns, results illustrated that:

11%

Of e-commerce web applications  use some form of dark patterns in their designs.

95%

Of mobile apps contain one or more forms of dark patterns.

7

Types of deceiving interfaces found in popular apps, on average.

As of today, there are 12 types of dark patterns that exist. As they become more mainstream, users become less trusting of companies and no longer feel in control of their data.

81%

Of U.S adults feel a lack of control over data collection by companies.

12

Types of Dark patterns.

How might we inform and educate users of dark privacy patterns to increase awareness and help feel more protected online?

User

The Target audience includes anyone who not only uses the internet but also has entrusted a company or digital platform with their PII, knowing or unknowingly.

 

The average user has a basic understanding of digital products and has become accustomed to the speed at which digital devices can complete a task which is why they value convenience and quick results.  They don’t easily recognize manipulative designs, and it is in this space that pickle jar can exist.

User.png
Research

Conducting Research

Goals
Insights
  • Validate or invalidate our assumptions,

  • Identify the existing DPPs that digital platforms have in place,

  • and Synthesize & use data to come up with a solution to this problem.

  1. Digital platforms with dark privacy patterns evoke suspicion in users.

  2. It’s painful to read about security.

  3. Recognition is a way to fight back against manipulative design.

UX Deliverables

Empathy Map

Affinity Map

Mahi Tale - Affinity Map.png
Mahi Tale - Empathy Map 3.png
Ideating & Prototyping

Designing a solution

1

Web browser extension. The idea was that you can download pickle jar from the extension store through chrome for example.

Ideas Sketch.png

2

Wireless external bluetooth device. The idea was to create a program embedded into a wireless device that would immediately start up when paired to a smart phone.

Limitations

With bluetooth connection, the wireless device has to be in range of your smartphone, tablet, or laptop.

Additional research provided insight that users don’t want to carry an extra device around apart from their phone, regardless of how small and compact it may be.

IMG_4610 1.png
Ideas Sketch 2.png

3

Mobile Application. An app with the option of pairing to the wireless external device via bluetooth to transfer information and free up some storage space. Stored information would include learning module progress and reported dark patterns.

 

The app was named Pickle Jar due to its potential ability to keep a user's personal information secure, like pickles in a pickle jar.

Pickle Jar App Icon.png
Offered Resources
  • Learning modules to learn and gain knowledge about dark patterns whole having fun,

  • The option to scan a website or App for dark patterns to help with awareness of the amount of dark patterns present,

  • The option to report a dark pattern and help users recognize them on a digital platform,

  • and alerts to warn users of dark patterns present on a given website or app while using them.

Benefits
  • All you need is your smart digital device,

  • No extra physical product to carry around,

  • Easier to access,

  • and More affordable.

Low - Fi Wireframes

Round Corners

The corners of the screen are rounded to seem fun, interesting, and less boring.

Design Choices

There is distinct hierarchy, further enforced with a difference in font size, a prominent button with effects that signifies tapping, a clear title, and visible text for easy reading.

Adequate Font size

Font size can send a subliminal message to user that we have nothing to hide unlike companies whose Privacy policy is written in small print, giving the impression that the info is insignificant.

Pickle jar wireframe.png
Usability Tests

Usability Tests

A total of six participants tested my prototype. Each user interview lasted around half an hour and participants were given six tasks to complete, followed by a few questions. These tests were conducted on site and remotely via zoom.

Participants were recruited by asking in person or via calls & messages and varied in age, gender, and identification. My prototype was described as simple and straightforward with one participants describing it as “Pickle Jar for dummies”.

Problems
Insights

No brief description of the program.
Confusing, "floating" screen.
Vague Setting options.

1. Users expect a brief description to be provided in the welcome screen.

2. Users prefer disclaimer/terms of service to be something they can quickly skim through.

3. Action required to maximize screen is unclear.
4. Users want the option to exit program.

High - Fidelity Designs

High Fidelity Designs

After receiving feedback, I applied insights from usability test to the high - fidelity designs.

High - fi Workstream.png

Prepare.
Introduce.
Inform.

Feel welcomed and invited with a curvaceous, bold typography. Look forward to some fun with 3D illustrations.

 

Prepare to be introduced to the pickle jar experience.

Benefit from a valuable resource meant to arm you with the knowledge of dark patterns.

2.10.1 mockup.png
HIfi_Disclaimer.png

Transparency is key.

Feel empowered and at ease when reading our transparent terms and limitations. 

Our terms are condensed into bullet points, highlighted in bold, and written in understandable language, so the info you need to know can be absorbed with a quick skim. 

Navigate with ease.

Access everything pickle Jar has to offer in one place, including a question button to provide you with a step by step tutorial on how to take full advantage of the app. Browse through your weekly progress status which will change depending on your activity.

The learning modules are in the form of games so you can have fun while learning about dark privacy patterns.

Home mockup.png
Settings screen prototype gif.gif

Learn on the go.

Personalize your experience and set helpful notifications with actionable steps. Receive alerts of the number of dark patterns present on a given website.

Busy schedule? “Learn on the go” about dark patterns as you browse the internet or use an app.

Bluetooth connect to the wireless device. Pair the app to a pickle jar wireless device and transfer stored data from learning modules by switching on the dump option to begin transferring data.

Stay
Protected.

Scan for DPPs. Scan an app or website for dark patterns before visiting them.

 

The user would pick an option, app or website, enter the corresponding information, and press scan. Once they press scan, pickle jar will immediately provide the current number of dark patterns present at that current moment.

Scan for DPPS mockup.png
report mockup 2.png

Test what
you've learned.

Put the knowledge you’ve acquired from the learning modules to the test by reporting a dark pattern you caught on your own.

This section is set up as a form, just in case users are still unsure of what is considered a dark pattern and need a little help.

Next Seps

There's always room for improvement.

What's next? These designs are a great start, however, there's always room for improvement to make my designs more compelling. Minor details to think about:

  • Explore different shades of green to further increase accessibility and secondary colors to create variety and more visual interest.

  • Explore illustration placements, size, and opacity so they don't compete with other elements.

  • Consider onboarding screens.



By providing options to learn about dark patterns via gaming modules, scan any given website or app for dark patterns, highlight dark patterns present on a website, and receive alerts, pickle jar acts as a valuable resource in increasing the user’s awareness and knowledge of manipulative designs. Doing so in a fun, non intrusive way and leaving users feeling better equiped against such designs.

 

 

Feedback is welcomed. Let's chat about designing mobile applications, find me on LinkedIn!​​

  

bottom of page