UX issueshttps://gitlab.torproject.org/groups/tpo/ux/-/issues2024-03-25T18:55:29Zhttps://gitlab.torproject.org/tpo/ux/design/-/issues/102Update alpha-glyph and nightly-glyph2024-03-25T18:55:29ZnicobUpdate alpha-glyph and nightly-glyph* complexity: small (1 days)
* uncertainty: low (1.1)
* total: 1-1.1 days
* actual: .5* complexity: small (1 days)
* uncertainty: low (1.1)
* total: 1-1.1 days
* actual: .5design-dot MVPnicobnicobhttps://gitlab.torproject.org/tpo/ux/design/-/issues/101Revisit onion-rings and onion-glyph icons2024-03-25T18:54:54ZnicobRevisit onion-rings and onion-glyph icons* complexity: small (1 days)
* uncertainty: low (1.1)
* total: 1-1.1 days
* actual: 1.5* complexity: small (1 days)
* uncertainty: low (1.1)
* total: 1-1.1 days
* actual: 1.5design-dot MVPnicobnicobhttps://gitlab.torproject.org/tpo/ux/design/-/issues/100Custom icons for stop, experiment, shields
2024-03-06T18:19:21ZnicobCustom icons for stop, experiment, shields
* [x] stop icon
* [x] experiment icon
* [x] shields icons
complexity: small (1 days)
* uncertainty: low (1.1)
* total: 1-1.1 days
* actual: .8 days* [x] stop icon
* [x] experiment icon
* [x] shields icons
complexity: small (1 days)
* uncertainty: low (1.1)
* total: 1-1.1 days
* actual: .8 daysdesign-dot MVPnicobnicob2024-02-29https://gitlab.torproject.org/tpo/ux/design/-/issues/99Organize file in figma with final icons2024-03-25T18:56:51ZnicobOrganize file in figma with final iconsImplement icon library file in figma
Make sure all icons are 2px stroke width (or optically adjusted as necessary)
* complexity: medium (3 days)
* uncertainty: high (2.0)
* total: 3-6 days
* actual: 2 daysImplement icon library file in figma
Make sure all icons are 2px stroke width (or optically adjusted as necessary)
* complexity: medium (3 days)
* uncertainty: high (2.0)
* total: 3-6 days
* actual: 2 daysdesign-dot MVPnicobnicobhttps://gitlab.torproject.org/tpo/ux/design/-/issues/97Update icon tracker in figjam with existing icons2024-02-28T23:29:59ZnicobUpdate icon tracker in figjam with existing iconsFile here: [Figjam](https://www.figma.com/file/hWOTYcSZpgng5SlwyR1i8P/Icon-tracker?type=whiteboard&node-id=0%3A1&t=bcPyFUhunn0gXO4X-1)
* complexity: small (1 day)
* uncertainty: low (1.1)
* total: 1-1.1 days
* actual: .8File here: [Figjam](https://www.figma.com/file/hWOTYcSZpgng5SlwyR1i8P/Icon-tracker?type=whiteboard&node-id=0%3A1&t=bcPyFUhunn0gXO4X-1)
* complexity: small (1 day)
* uncertainty: low (1.1)
* total: 1-1.1 days
* actual: .8design-dot MVPnicobnicob2024-02-27https://gitlab.torproject.org/tpo/ux/design/-/issues/96Update slash/broken icons with combined style2024-03-25T18:56:09ZnicobUpdate slash/broken icons with combined styleIdentify which icons need this treatment and implement
* complexity: medium (3 days)
* uncertainty: low (1.1)
* total: 3-3.3 days
* actual: .5Identify which icons need this treatment and implement
* complexity: medium (3 days)
* uncertainty: low (1.1)
* total: 3-3.3 days
* actual: .5design-dot MVPnicobnicobhttps://gitlab.torproject.org/tpo/ux/design/-/issues/94Cross reference Ura list with existing Phosphor icons2024-02-29T00:12:08ZnicobCross reference Ura list with existing Phosphor iconsFor icons that could be used with an existing Phosphor icon, hyperlink in the [Figjam](https://www.figma.com/file/hWOTYcSZpgng5SlwyR1i8P/Icon-tracker?type=whiteboard&node-id=0%3A1&t=bcPyFUhunn0gXO4X-1) file
* complexity: medium (3 days)...For icons that could be used with an existing Phosphor icon, hyperlink in the [Figjam](https://www.figma.com/file/hWOTYcSZpgng5SlwyR1i8P/Icon-tracker?type=whiteboard&node-id=0%3A1&t=bcPyFUhunn0gXO4X-1) file
* complexity: medium (3 days)
* uncertainty: low (1.1)
* total: 3-3.3 days
* actual: 2 daysdesign-dot MVPnicobnicob2024-02-28https://gitlab.torproject.org/tpo/ux/design/-/issues/88Concepting and skamps for Outreach, User Research, Community illustrations2024-02-20T16:12:16ZnicobConcepting and skamps for Outreach, User Research, Community illustrations#### Design estimate
* complexity: small (1 day)
* uncertainty: moderate (1.5)
* total: 1-1.5 days
* actual: 3
---
* [x] Concepting and skamps for Outreach illustration
* [x] Concepting and skamps for User Research illustration
* [x] ...#### Design estimate
* complexity: small (1 day)
* uncertainty: moderate (1.5)
* total: 1-1.5 days
* actual: 3
---
* [x] Concepting and skamps for Outreach illustration
* [x] Concepting and skamps for User Research illustration
* [x] Conceping and skamps for Community illustrationsdesign-dot MVPnicobnicob2024-02-13https://gitlab.torproject.org/tpo/ux/design/-/issues/87Draw Onion Services, Resist Fingerprinting, Localization, Circumventing Censo...2024-02-12T22:49:28ZnicobDraw Onion Services, Resist Fingerprinting, Localization, Circumventing Censorship illustrations#### Design estimate
* complexity: medium (3 days)
* uncertainty: low (1.1)
* total: 3-3.3 days
* actual: 2.8 days
---
* [x] Make edits to Onion Services illustration per last review session with donuts
* [x] Iterate further on skamps...#### Design estimate
* complexity: medium (3 days)
* uncertainty: low (1.1)
* total: 3-3.3 days
* actual: 2.8 days
---
* [x] Make edits to Onion Services illustration per last review session with donuts
* [x] Iterate further on skamps for Circumventing Censorship
* [x] Draw vector illustration for Resist Fingerprinting
* [x] Draw vector illustration for Localizationdesign-dot MVPnicobnicob2024-02-08https://gitlab.torproject.org/tpo/ux/research/-/issues/133Prepare desirability study of the new illustrations2024-03-26T22:34:56ZsajolidaPrepare desirability study of the new illustrations@nicob is working on new illustrations and a new illustration style:
- tpo/ux/design#61+
- https://www.figma.com/file/nIpahk0b9VMaeEnubiO33g/Marble?type=design&node-id=291-10068&mode=design&t=p8tQ2E3RD9wUdNX1-0
An idea for #128 is to t...@nicob is working on new illustrations and a new illustration style:
- tpo/ux/design#61+
- https://www.figma.com/file/nIpahk0b9VMaeEnubiO33g/Marble?type=design&node-id=291-10068&mode=design&t=p8tQ2E3RD9wUdNX1-0
An idea for #128 is to test them with training participants doing a mix of qualitative and quantitative analysis.
**Estimate**: Small × Low = 1–1.1 d
### Preparation material
- Survey:
* For participants: https://survey.torproject.org/index.php/983521
* LimeSurvey structure: [desirability_study.lss](/uploads/a723a762ba973b89f909dfd9b8ff4258/desirability_study.lss)
- Instructions for partners:
* PDF for distribution: [desirability_study_instructions.pdf](/uploads/ef85a75226584c4f044b165cc8d0e5e9/desirability_study_instructions.pdf)
* Markdown source: [desirability_study_instructions.md](/uploads/25b8fab0289e10dda65ef7a498ac931a/desirability_study_instructions.md)
### References
- https://www.nngroup.com/articles/microsoft-desirability-toolkit/
- https://www.xdstrategy.com/desirability-studies/
- https://www.nngroup.com/articles/testing-visual-design/
### Tasks
- [x] Check if that sounds like a useful research activity (@donuts + @nicob)
- [x] Review and improve questions (@nicob)
- [x] Create a prototype survey on https://survey.torproject.org/
- [x] Test survey on mobile
- [x] Decide if we want the survey to be responsive on mobile
- [x] Integrate the consent and demographics questionnaire from #130 in the survey
- [ ] Add final set of illustrations (@nicob + @donuts)
- [x] Prepare instructions and reporting templates for partners
- [x] Do a quick pilot testSponsor 9 - Phase 7 - Usability and Community Intervention on Support for Democracy and Human Rightssajolidasajolidahttps://gitlab.torproject.org/tpo/ux/research/-/issues/132Create testing plan for diary study2024-03-14T17:05:38ZsajolidaCreate testing plan for diary studyWe would like our partners to facilitate a diary study to discover what pain points or barriers to adoption users face in their first few weeks of using Tor Browser.
### Tasks
- [x] Brainstorm on how this diary study could go
- [ ] Cla...We would like our partners to facilitate a diary study to discover what pain points or barriers to adoption users face in their first few weeks of using Tor Browser.
### Tasks
- [x] Brainstorm on how this diary study could go
- [ ] Clarify what incentive we can provide to participants, if any
- [ ] Clarify whether people are going to report in EnglishSponsor 9 - Phase 7 - Usability and Community Intervention on Support for Democracy and Human Rightshttps://gitlab.torproject.org/tpo/ux/design/-/issues/75Do some design QA of the latest VPN pre-alpha2024-01-16T16:11:28ZdonutsDo some design QA of the latest VPN pre-alphadonutsdonutshttps://gitlab.torproject.org/tpo/ux/design/-/issues/71Update existing typography to use Inter2024-01-29T21:48:59ZdonutsUpdate existing typography to use InterVPN pre-alpha 06Jag TalonJag Talonhttps://gitlab.torproject.org/tpo/ux/research/-/issues/131Create study worksheets and/or reporting templates2024-02-02T18:35:25ZdonutsCreate study worksheets and/or reporting templatesIn addition to the testing plans and demographic questionnaire, both studies will require individual worksheets too.
For moderated studies, the facilitator should use individual worksheets to record the responses of each participant. F...In addition to the testing plans and demographic questionnaire, both studies will require individual worksheets too.
For moderated studies, the facilitator should use individual worksheets to record the responses of each participant. For unmoderated studies like the diary study, worksheets should be distributed to each participant to be completed and returned to the facilitator at at a later date.
At the end of the study, facilitators are required to send the completed worksheets back to the Tor Project for analysis. A dropbox on Nextcloud would be sufficient for this purpose.Sponsor 9 - Phase 7 - Usability and Community Intervention on Support for Democracy and Human Rightssajolidasajolidahttps://gitlab.torproject.org/tpo/ux/research/-/issues/130Create demographics questionnaire2024-03-26T17:51:21ZdonutsCreate demographics questionnaireFacilitators are asked to distribute a demographics questionnaire to participants. Each question is optional and may be skipped, which should be made clear to the participant. In addition, it would be good to include some text at the top...Facilitators are asked to distribute a demographics questionnaire to participants. Each question is optional and may be skipped, which should be made clear to the participant. In addition, it would be good to include some text at the top of the questionnaire to explain why we collect demographics, e.g.
- To ensure we are reaching users from diverse backgrounds, and that marginalized groups are represented.
- Some funders require us to report back basic information (e.g. the gender breakdown of our studies) for Diversity, Equity and Inclusion.
- To identify basic trends in our studies.
And how we safeguard their information, e.g.
- Questions are general and do not ask the participant to disclose personal information.
- Demographic data is aggregated per study in our reporting.
- The raw demographic data is deleted as per our data handling policy.
**Estimate**: Medium × Moderate = 3–4.5 d
### Tasks
- [x] Draft content
- [x] Research description
- [x] Consent
- [x] Demographics
- [x] Prototype PDF form
- [x] Prototype LimeSurvey
- [x] Decide whether to include consent questions (@donuts)
- [x] Decide between PDF and LimeSurvey (@donuts)
- [x] Integrate better with https://gitlab.torproject.org/tpo/ux/research/-/blob/master/scripts%20and%20activities/2021/consent_form.md
- [x] Theme
- [x] Decide on the base theme → fruity twentythree
- [x] Create Git repo (otherwise I'll get lost...): https://gitlab.com/sajolida/fruity-twentythree-tor
- [x] Use [Space Grotesk](https://fonts.google.com/specimen/Space+Grotesk) for headings
- [x] Use [Inter](https://fonts.google.com/specimen/Inter) for text body
- [x] Add [Tor branding](https://styleguide.torproject.org/brand-assets/)
- [x] Improve for printing
- [x] Always display data handling policy
- [x] Hide buttons
- [x] Avoid page breaks inside a question block
- [x] Deploy theme on survey.torproject.org (tpo/tpa/team#41486)
- [x] Assign to the "UX surveys" group (tpo/tpa/team#41490)
- [x] Finish discussing the risk assessment questions
- [x] Threats question
- [x] Profiles question
- [x] Document them as optional in the survey template
### Draft questionnaire
See here: https://pad.riseup.net/p/tor-user-surveys-keep
### Final survey template
[consent_and_demographics_questionnaire.lss](/uploads/db87902c459293981dcbc813a5412cc9/consent_and_demographics_questionnaire.lss)Sponsor 9 - Phase 7 - Usability and Community Intervention on Support for Democracy and Human Rightssajolidasajolidahttps://gitlab.torproject.org/tpo/ux/research/-/issues/129Decide a scope for first testing plan2024-03-14T17:05:33ZdonutsDecide a scope for first testing planThe testing plans are for the facilitator's reference, and should provide our partners all the information they need to facilitate their study. In the previous phase of work, we prepared two studies for our partners to choose from. We'd ...The testing plans are for the facilitator's reference, and should provide our partners all the information they need to facilitate their study. In the previous phase of work, we prepared two studies for our partners to choose from. We'd like to do the same in Phase 7 in order to provide our participants with a choice of user research that suits their approach—i.e. in person or remote.
For the first study, we would like our partners to collect interactive feedback on one of our existing webpages or a proposed redesign. Examples of similar activities from last year include https://gitlab.torproject.org/tpo/ux/research/-/issues/103 and https://gitlab.torproject.org/tpo/ux/research/-/issues/105.
For the second study, we would like our partners to facilitate a diary study to discover what pain points or barriers to adoption users face in their first few weeks of using Tor Browser.
Each testing plan should include, for example:
- A summary of the activity, including the format and duration.
- The hypothesis we're testing or question we're trying to answer.
- Any additional background to the problem we're researching, if relevant.
- A list of the things both the facilitator and their participants will need.
- A step by step guide to accomplish the activity, including the required questions and prompts.
- How to collect their results and report back to Tor.
**Top ideas**
- Support navigation: research#8+
- New illustrations: design#61+
### Tasks
- [x] Brainstorm on user research techniques that are suitable to this format
- [x] Identify possible user research goals
- [ ] Decide between the top ideas (@donuts)
- [ ] research#8+
- [ ] #133+
- [ ] #132+Sponsor 9 - Phase 7 - Usability and Community Intervention on Support for Democracy and Human Rightssajolidasajolidahttps://gitlab.torproject.org/tpo/ux/research/-/issues/128Prepare testing plans and supporting materials for S9 partners2024-03-26T17:51:21ZdonutsPrepare testing plans and supporting materials for S9 partnersThe Community team are launching a call for proposals (see https://gitlab.torproject.org/tpo/community/training/-/issues/102) for select partners in East Africa and MENA to apply for funding to conduct Tor training workshops, user resear...The Community team are launching a call for proposals (see https://gitlab.torproject.org/tpo/community/training/-/issues/102) for select partners in East Africa and MENA to apply for funding to conduct Tor training workshops, user research for Tor, or both. Upon acceptance, our partners will be onboarded in February 2024 and run their activities in March and April 2024.
In advance of their onboarding, we need to prepare the following materials for successful applicants:
- Two detailed testing plans
- A demographics questionnaire
- Worksheets and/or reporting templates
Our partners may conduct their activities in person, remotely or via a hybrid approach, and connectivity may be limited or unreliable. As such, the materials created to support the studies must be usable online, offline or when printed too. If possible, instead of creating separate materials for screen and print, an interactive PDF for each material may work well.
We should also give each of the materials a little design TLC to help readers scan their content, using light graphic devices and sensible layouts to break up streams of text. For typography, display headings should be set in [Space Grotesk](https://fonts.google.com/specimen/Space+Grotesk), whereas small headings and body text should be set in [Inter](https://fonts.google.com/specimen/Inter).
**Estimate**: 72–109 h, including #8 and #90Sponsor 9 - Phase 7 - Usability and Community Intervention on Support for Democracy and Human Rightssajolidasajolidahttps://gitlab.torproject.org/tpo/ux/team/-/issues/93Project idea: Design and build a replacement for styleguide-dot2023-12-13T05:10:58ZdonutsProject idea: Design and build a replacement for styleguide-dotAt the Tor Project hackweek in November 2023, the UX Team explored a replacement for our existing style guide ([styleguide.torproject.org](https://styleguide.torproject.org/)), with the stated goal:
> The UX Team have been discussing re...At the Tor Project hackweek in November 2023, the UX Team explored a replacement for our existing style guide ([styleguide.torproject.org](https://styleguide.torproject.org/)), with the stated goal:
> The UX Team have been discussing replacing the [existing styleguide](http://styleguide.torproject.org) with a new resource that's wider in scope – e.g. "design.torproject.org". In addition to updating our brand and web guidelines given their evolution over the past few years, we're also considering adding new sections to document our human-centered design principals, user research program, and overall methodology. The revised portal should serve as a central point of reference for external resources too, including for example our Figma libraries for the browser, web and VPN, and any open source design resources we use.
During the hackweek, we made good progress planning the structure of the future site and designed some initial templates. However it also became clear that the scope we were aiming for was simply too large, and that it would be better to focus on deploying a basic MVP that covers the same subjects as the current style guide—those being:
- Home page
- Styles
- Color: featuring the new 10 point color system, core brand colors, and semantic uses.
- Typography: including updates to our brand fonts at display and body sizes.
- Assets
- Brand: featuring the new logo, if approved (see https://gitlab.torproject.org/tpo/ux/team/-/issues/92), the new Tor Browser application icons, and guidelines for use.
- Iconography: including custom icons for Tor Browser and our new brand icons (see https://gitlab.torproject.org/tpo/ux/design/-/issues/62).
- Illustration: featuring the new illustrations being developed by Nico (see https://gitlab.torproject.org/tpo/ux/design/-/issues/61).https://gitlab.torproject.org/tpo/ux/design/-/issues/62Set up a new icon library based on Phosphor2024-03-25T19:21:52ZdonutsSet up a new icon library based on PhosphorAt present, we use a mixture of Font Awesome and custom icons on our websites. However Font Awesome is freemium, and while the free set is extensive, I'd like to switch to a truly FOSS icon set.
There are three main contenders:
- [Boot...At present, we use a mixture of Font Awesome and custom icons on our websites. However Font Awesome is freemium, and while the free set is extensive, I'd like to switch to a truly FOSS icon set.
There are three main contenders:
- [Bootstrap icons](https://icons.getbootstrap.com/)
- [Material Symbols](https://fonts.google.com/icons)
- [Phosphor Icons](https://phosphoricons.com/)
Ura Design previously redrew several custom icons of ours in the rounded Material Symbols style at a weight of 400: [Ura Design Styleguide / Custom Icons](https://www.figma.com/file/ruiyH9Q9LDIy1reuXqlr6T/Ura-Design-styleguide?type=design&node-id=708%3A243&mode=design&t=hGoXAzbwSofLIbRp-1).design-dot MVPnicobnicobhttps://gitlab.torproject.org/tpo/ux/design/-/issues/60Update switch style in the design system2023-08-25T13:16:55ZJag TalonUpdate switch style in the design system- [Current design components](https://www.figma.com/file/RtZ0fqkNMRc7GOjK3FLclz/Tor-Browser-for-Desktop?type=design&node-id=0-1&mode=design)
- New Firefox switch: https://gitlab.torproject.org/tpo/applications/tor-browser/-/merge_request...- [Current design components](https://www.figma.com/file/RtZ0fqkNMRc7GOjK3FLclz/Tor-Browser-for-Desktop?type=design&node-id=0-1&mode=design)
- New Firefox switch: https://gitlab.torproject.org/tpo/applications/tor-browser/-/merge_requests/741#note_2935059Jag TalonJag Talon