Skip to content

Prototypes Archive

Nina Eleanor Alter edited this page May 29, 2021 · 26 revisions

FYI

As prototypes created with visual prototyping tools and to demonstrate specific features or functionalities, all of the below must be navigated exactly as prescribed—else they will break. Most imply multiple features that do not "work," while other features will work, for this same reason.

UXPin prototypes are generated with React code that requires Javascript. Invision prototypes are effectively static JPGs with "hot spots" to navigate to other static JPGs. Invision Studio uses some fancy rendering something I don't know much about, but presume it requires Javascript.

Final design "mockups" are exported to Zeplin, for developers to grab font, hex, and pixel-perfect measurement values from. Yes, I really want to migrate to Figma, eventually. Figma was built to mostly support mobile workflows, however, so does not support hover states—and has vested most of its product development efforts to support things like transitions, that are helpful for consumer mobile apps. Figma also has a broken local/cloud fonts management workflow, that I hope it someday resolves.


SDW Safe Delete (Apr 2021)

  • For: UxR study
  • Features: Safe Delete from JI, mirrored in Client; "tear" pattern, muted-lilac overlays & cubes spinner
  • Navigation Instructions
    • 1st, Benign Artichoke, files/messages
    • 2nd, Cuddly Antelope, account
  • Link: UXPin

SDW Tagging (Jan 2021)

  • For: Team PoC (no idea why this was requested, I'd honestly forgotten about it!)
  • Features: Journalist ID tagging, Source tagging, googly-eyes "seen by"
  • Navigation Instructions: hover over screen on-click. Invision UI arrows will overlay the screen on each side; use these to navigate. No "hot spots" on screen.
  • Link: InVision

Source UI "Get Codename" Page (Jan 2021)

  • For: Improve new source guidance
  • Features: Instructive copywriting, update colors, codname semiotics (lock), codename widget on "Submit" page, Source UI design principles, footer update w/ links
  • Link: InVision

JI Safe Delete (Dec 2020)

  • For: UxR study (script, tbd)
  • Features
    • MClemens: (tbd)
    • NBly:(tbd)
  • Links: MClemens · NBly

Source UI Hide/Show "Encryption Options" (Nov 2020)

  • For: Team PoC for progressive disclosure pattern on SUI
  • Features: Hide/Show div on text above uploads box
  • Nav Instructions: It's just 2 pages. :)
  • Link: InVision

Read/Unread (Jul 2020)

  • For: UxR study (script, tbd)
  • Features Shown: Read/Unread (auto), Mark Read/Unread, Muting, View Filters, User Guide, Seen By
  • Link: UXPin

Source "Learn More" Page (Jun 2019)

  • For: Team PoC
  • Features: Content outlining TL;DR opsec risks for sources unwilling to read more thorough documentation
  • Nav Instructions: It's 2 InVision pages; hover over and browser back/forth arrows should appear to navigate between them
  • Link: InVision

SDW Client "Failure" Scenarios (May 2019)

  • For: Team PoC
  • Features: Error "Log" visible to users, bang icon in Source Widget,
  • Nav Instructions: Pink annotations at top are "hot" links; Error Log should open/close by hexabang icon in UI
  • Link: InVision

SDW Client "Briefcase" Export (Mar 2019)

  • For: Team PoC
  • Features: Bulk export w/ a shopping-cart like feature we anti-Capitalist'd as "Briefcase"
  • Nav Instructions: I forgot, click & see "hot" areas highlighted.
  • Link: InVision

Source UI Design Principles

  • For: Team peeps to view on mobile devices, while looking at other prototypes on laptops
  • Features: None; literally, just writing formatted for easy consumption on a mobile phone
  • Link: InVision

Early Source UI stuff (Jan 2019)

  • For: Team PoC
  • Features: A lot; many, in current Source UI, or were early suggestions that were later iterated on to get where the Source UI is, today.
  • Nav Instructions: Built-in; everything magenta = annotation
  • Link:

SDW Client (Nov 2018)

  • For: Early user feedback
  • Features: Download/Decrypt, Export w/ Decryption, Read/Unread
  • Nav Instructions: I forgot, click around—some fun animations I'd forgotten about!
  • Link: InVision Studio

SDW Client (Oct 2018)

  • For: Early user feedback on
  • Features: Demonstrates Qubes boot, online/offline, login
    • Click into Reply Pane to see "ideas pu-pu-platter" screen w/ Trash Can, Notepad, Waterline, and lots of other implied options
  • Nav Instructions: I forgot, click & see "hot" areas highlighted.
  • Link: InVision

Who Uses SecureDrop?
Learn about SecureDrop's users!

Contributors

Learn!

Et cetera

Clone this wiki locally