EPIC: SI Redesign (2 phases)

[ninavizz]

Background

In 2019 we did our first ever study of the Source Interface for SecureDrop, with 8 participants on UserFeel. Multiple problems and opportunities were surfaced from that.

Later, the team endeavored a Pilot of the SD Workstation. Through the increased access to journalists and newsrooms in the Pilot, we learned about their pains with SPAM. More specifically, we also learned about a problem with codenames submitted on their own—with no other content.

After much discussion and analysis of 2019’s research findings, synthesis, other available whistleblower submission systems—and a fabulous walkthrough of recent UX work done for Global Leaks, an updated design direction with an all-new design system, content, and screens-flow, was created.

The two studies devised for 2022 break-apart this new design direction, into two studies that clearly/neatly separate what we’re seeking to learn, into two different builds. Additionally: The first study will be split, between another UserFeel study and a limited pilot deployment with 1-2 customers with English-only translation needs.

Approach

The most pivotal changes from today’s SI are two-fold: One, its flow is changed, with users receiving a passphrase after making their first submission. Second, the design system is changed, with updated typography, semiotics, and a layout that no longer requires the full UI container-box.

The full-UI outline (aka "container box") is a device sometimes employed by folks new to front-end work—or, when no real design system or "visual grid" is established. With removing the outline in the 2nd phase, we are looking to have the visual grid of all the page object containerize themselves—so, thinking-through the CSS grid being intentional with how objects are placed, and thinking through how the full UI "moves" across screens, will be dependencies for that to work.

For the user research part of things, we’ll be seeking to use a live instance. To help facilitate that with available dev resourcing, the changes have been neatly split across two different builds. Initial prioritization for getting changes into the two builds was done with a MoSCoW workshop, and later whittled down by looking at “Frankenstein’d” transitional build options.

Once Frankenstein E was selected as a clean first-build to target, the reasons why that version made for the “cleanest” break were baked into two distinct User Research Plans: One, targeting a Q12022 Study, and Two, targeting a Q2+2022 Study.

“Nice to have” options to factor into both studies, are evaluation of an updated Landing Page design/content, and a TL;DR Risks "Source Safety Guide" page for consumption by sources w/in the SI. The prior, included so that FPF can provide newsrooms with both content and a generic design for a landing page that have been validated through user research, in acknowledgement of the lack of resources at news orgs to do this work on their own. The latter, included in acknowledgement of the reality that many sources are likely lost in the over-abundance of highly technical information available—and may need the most important opsec principles highlighted for them in a “cheat sheet,” within the experience itself.

Resource Artifacts

• 2019 SI Research: Findings Report · Synthesis Spreadsheet
• Figma! It's great! Get your "SecureDrop on Figma" introduction here, and ask Erik to get you an account if you don't have one and would like to either make your own sandbox files, or pick-up developer specs from a design file.
• Figma Prototype and Design File, for the complete Flow Inversion
• Getting to two builds: MoSCoW Spreadsheet and Frankenstein Worksheet
  • Frankenstein Worksheet include links to Figma prototypes & design files that consider different break-apart feature group options
• 2022 User Research split into two plans, to target two distinct feature-sets that can neatly separate into two different/distinct studies: First Plan · Second Plan
• Landing Page stuff—spoken to in 2019 Research Plan (Figma Design + Prototype files)