Mozilla Social was an experimental project from Mozilla that explored the decentralized social media space. During my time on the project, I was the interim lead designer on the user onboarding and account initiatives. When the full-time lead returned, my contract was extended to assist with design system maintenance, and I proposed and worked with the lead web developer to unify the web experience with the native mobile experiences.
One effort I was the design lead for was the invite-a-friend feature. As a closed alpha, we wanted to allow existing users to invite people as a way to grow the network gradually and encourage a sense of community. I worked with front and back-end developers and project managers to map how users could connect and find their friends more easily.
After receiving the PRD, I began diagramming the flow of information that needed to happen between the existing user, the invited user, and the backend system from Firefox authentication. In the Figma embed below, I've included my early diagrams of possible solutions that the PM and I walked front and backend developers through.
Page 1: Initial flow map with current, least ideal (but most easy to implement), and the ideal flow for the invited user.
Page 2: The low-fidelity wireframes of the most ideal and most technically feasible user flows. Feasibility was highlighted to facilitate discussion on feature scope.
Page 3: The agreed upon flow after discussion with the front and back-end development teams.
Page 4-6: Wireframes showing various use cases to account for in relation to the existing user's experience with invite codes.
Following new regulations regarding appeals, I worked with our Trust and Safety project manager and engineer to develop the front-end interface. The aim was to create an in-application dashboard with information on open violations and reports. Decisions could then be appealed by the reporter or the person who was reported and allowed them to provide additional context such as in-app posts or links to off-site public activity.
As a member of the team, I contributed to the design system regularly, and I also worked with our senior web developer to refine semantic token names for development. I also did multiple accessibility reviews of minor patterns like text inputs and buttons to ensure the designs met or exceeded accessibility standards.