Figma
UI/UX Design
User Research
Overview
In collaborative spaces like Sembly, accountability and transparency are crucial for ensuring fair decision-making. As part of my role as a UI/UX Designer, I was tasked with improving Sembly's consensus voting system by designing a clear and informative review response summary. This feature aimed to reveal voter identities, voting outcomes, and individual voting weights to promote transparency and prevent manipulation.
The project required balancing competing priorities: ensuring accountability while preserving privacy, providing clarity without overwhelming users, and designing a scalable solution that could handle varying numbers of participants.
Problem Statement
Sembly's spaces are governed by admins and facilitators, where various content and discussion-related actions require approval through a voting process. While this system allowed for collective decision-making, it lacked transparency once a vote was completed (though the lack of visibility during the voting process itself was intentional to reduce bias).
Users could see whether an action was approved, rejected, or marked for revision — but they had no visibility into:
This lack of insight posed significant risks. Without transparency, malicious actors could exploit the system, anonymously blocking decisions without accountability. Conversely, privacy and discretion were also critical concerns, as revealing too much information could discourage participation or expose individuals to undue scrutiny.
Research & Insights
To identify potential concerns, I considered the different roles within Sembly's spaces and their unique perspectives. I analyzed the perspectives of different roles — admins, facilitators, and contributors — to identify their potential concerns:
These insights guided my design priorities: enhancing visibility and transparency while ensuring that key information was intuitive and provided the necessary privacy for users to make informed, unbiased decisions.
Ideation & Design Process
To evaluate potential solutions, I created a table comparing different design options based on key factors such as accountability, intuitiveness, and privacy & discretion. I analyzed several approaches, each with unique tradeoffs:
| Option | Accountability | Intuitiveness | Privacy | |
|---|---|---|---|---|
Make every vote anonymous | Show number of votes but hide vote weights, user roles, and other identifying information | Low (no transparency & accountability at all) | Low (not intuitive — Since an option can receive more votes but still not be the consensus due to unshown vote weights, it creates confusion.) | High (Privacy is always expected and guaranteed) |
| Keep votes anonymous while showing user roles to clarify voting influence | Low (although transparency is slightly increased because users can see vote weights, there is still no accountability, which may encourage less responsible behavior) | High (it is intuitive because users would now understand there are differing vote weights, and the behavior is always consistent) | High (high privacy — voters' names are not displayed. However, there are some edge cases where users could still potentially identify others based on their unique roles) | |
Showing identity of every voter | Show the name and option that each participant voted for | High (Full transparency and accountability) | Moderate (it is intuitive since it has consistent behavior, but it might be potentially overwhelming to users) | Low (doesn't ensure privacy of voters. Might introduce bias when voting, especially in sensitive actions like demoting an admin) |
Reveal the participants, without disclosing which option they chose | Low (limited accountability — While users can see who participated on the voting, there is no accountability because there is no clear mapping between users and their chosen options) | Moderate (while the design would be easy to use, it lacks the transparency we aimed to provide. Users still won't understand how the consensus was reached, diminishing the value of this feature) | High (lack of mapping between users and chosen options guarantees privacy and removes bias when voting) | |
Limited identity disclosure for voters | Only reveal the identities of voters who supported the chosen outcome | Moderate (while it provides accountability for those who voted for the consensus, this approach is inconsistent and limited since accountability only applies if the chosen answer aligns with their vote) | Moderate (expectation is unclear when voting, whether the vote would be anonymous or not) | Moderate (although identities are revealed only if their chosen option becomes the majority, privacy remains uncertain at the time of voting, which may still introduce bias) |
Show the identities of admins and facilitators but keep the rest of the voters anonymous. | Moderate (admins and facilitators are always held accountable, regardless of their chosen option. While accountability is limited for other voters, their lower voting influence makes admin and facilitator accountability more crucial) | High (intuitive as behavior is always consistent, and the vote weight is justified) | High (privacy is guaranteed for regular users, while admins and facilitators are aware that their identities will be disclosed) | |
Based on the analysis and team discussions, we concluded that the best approach is to show the identities of admins and facilitators while keeping the rest of the voters anonymous. This option strikes a balance between accountability, intuitiveness, and privacy.
After the analysis phase, I explored several approaches to presenting voter data in a concise yet effective way. Some key decision points were:
Prototyping & Testing
After the brainstorming and analysis step, I prototyped 4 main options with Figma to gather feedback and further analysis. Here are the four initial options:
Option 1: Display individual votes as separate blocks, with the width of each block representing the vote weight. For admins and facilitators, include avatars that reveal user profiles on hover. Highlight the user's own vote with a star icon for easy identification. Order based on who voted first, and for multiple options, display the avatars of non-anonymous users.
Option 1
Option 2: Display individual votes as separate blocks, with the width of each block representing the vote weight, as a progress bar. For admins and facilitators, include avatars that reveal user profiles on hover. Highlight the user's own vote with a star icon for easy identification. Order based on highest vote weight, and show number of votes for multiple options, but do not associate it with the specific users.
Option 2
Option 3: Display individual votes as separate blocks with same widths, use the color density to represent vote weight (to avoid discouraging those with lighter vote weight). Gradient color is reserved for admins and facilitators, whereas dark blue represents those with higher vote weight. For admins and facilitators, include avatars that reveal user profiles on hover. Highlight the user's own vote with a star icon for easy identification. Order based on who voted first, and show number of votes for multiple options, but do not associate it with the specific users.
Option 3
Option 4: Display the votes as a cumulative bar for each options. Do not directly associate the vote weight with the individual users to prevent discouraging those with lower vote weights. Admins and facilitators' avatars would be shown below the bar, with Sembly admins having a gradient border color for easy identification.
Option 4
Using the initial design options as a foundation, I discussed the concept and design with the other designers and stakeholders. Here are some key insights that emerged:
Final Design Solution
Based on these insights, I refined the prototype by incorporating a vote weight breakdown that doesn't directly link each user to their individual voting power. This approach aligns well with the requirement that users in the same role may have different voting weights based on their reputation scores.
To improve role clarity, I introduced a grouping system that organizes users by their roles, each clearly labeled with distinct chip titles and colors. This reduces the cognitive load on users by relying on recognition rather than recall.
The design also supports scalability — it limits the number of visible avatars per role, elegantly hides anonymous voters, and allows users to easily identify which option they selected, if any.
Additionally, since our application includes badges like “Google Researcher” and “Expert,” we introduced a requirement to ensure users with these badges are easily identifiable in the review response summary.
The final design features:
This design improved transparency without overwhelming users, enabling admins and facilitators to track voting patterns and hold participants accountable when necessary.
Outcome & Impact
The implementation of the review response summary significantly enhanced transparency in Sembly's decision-making process:
By introducing a clear and accessible voting breakdown, I helped foster trust and accountability within the platform's collaborative environment.
Reflection
This project reinforced the importance of balancing information density with clarity. Early iterations risked overwhelming users with excessive detail, but through iterative testing, I refined the design to present key information in digestible layers.
The experience highlighted the need to align design decisions with user priorities—ultimately fostering trust, accountability, and fairness in collective decision-making. Finding the right balance between transparency and privacy was challenging, but essential for creating a system that encouraged participation while maintaining integrity.
