UX/UI - How It Works Page

[CristinaEche]

Requirement: Clearly explain the MEF governance process for both logged-in and non-logged-in users.

Implementation:

• Ensure the user session state determines accessible items.
• How it works page: explains the process - logged and not logged
• Use interactive elements (e.g., tooltips, infographics) to guide users.
• CTAs to Create or Submit proposals

User Stories:

• As a new user, I want a step-by-step explanation of the proposal submission, consideration, deliberation, and voting process so that I understand how to participate.
• As a new user, I want a description of the reviewer and Community member role, and to understand how I can override reviewers' votes so that I can actively participate in the funding process
• As a user, I want interactive elements (e.g., hover-over tooltips, and process diagrams) so that I can quickly grasp governance concepts.

Process flow to convert to an interactive HTML graph
https://miro.com/app/board/uXjVKnjwBB4=/?moveToWidget=3458764604819812062&cot=14

List of FAQs:
https://docs.google.com/document/d/13GSJ9DAY1969Lshjm1Y23Dj2pPt-lCrFUpz7-lZF1sw/edit?tab=t.0

Example UI:
https://app.visily.ai/projects/55cb0064-ed1d-4d28-9513-678b1f6878e7/boards/1605813/elements/702473095

[CristinaEche]

works as expected