Custom Member Profile
Introduction
The Wix Members Area offers dynamic web pages for site visitors, enabling features like My Account and My Orders. It's an end-to-end SaaS product with no coding required. In addition, for social-driven sites, Members Area allows visitors to sign up and have a unique public profile.
Roles and Responsibilities
- Conduct competitor research
- Define key flows and feature for the site members
- Design the Live site interface
Problem Statement
Users of Members Area want more flexibility in the design and function of the Member's Profile page. The information collected during custom sign-ups is not visible to site members in their profiles, leading to a lack of updates and engagement. Over 890 votes were received for this feature request in 2020.
Design Objectives
- Establish a comprehensive connection between the Account page and the Profile page
Low-Fi flow Site
member in the Profile page, click to edit their information > Navigate to My Account with relevant field in focus
- Create a scalable UI for the Profile page to accommodate additional information as needed
- Ensure site members are aware of their Profile's public view and allow them to control what information is shared publicly.
Low-Fi wireframes
Added Privacy poroperty to personal information in Profile page. The site member can choose what they want to disply via My account page.Low-Fi wireframes
Adding Public view to Profile page. With Public view the site member can see how other site visitors see their profile.Research and Discovery
Competitor research revealed limitations in our Members Area profile design, with uniformity across all Wix sites. Many site members were not engaging with their Public Profile, resulting in low retention. Blogs, forums, education, and professional communities were identified as potential beneficiaries of personalized user profiles, leading to increased engagement and retention.
Design Process
- Create a new member flow guiding users to the Profile page and encouraging them to add missing information in the Account page
- Add missing features to the account page and design a scalable layout for users to display desired fields
- Develop a new member flow to highlight the profile page as a public page visible to other members.
What We Built
Profile Card redesign
Member's ‘business card’ is the member’s playground. The redesign included alignment and image size options, added support for RTL languages. Cover image height options and accessibility standards were also applied.
Profile page new layout
The MA Page structure consists of two widgets with independent design settings.
The structure of the page was completely rebuilt by R&D. Old Profile widget, where the member fills in about info, was divided into independent widgets to allow layout customazation.
The structure of the page was completely rebuilt by R&D. Old Profile widget, where the member fills in about info, was divided into independent widgets to allow layout customazation.
Old Page Content
New Page Content
New Page Content
Old Page structure
New Page structure
New Page structure
New layout options made the page flexible to show and hide elements by the user, who is the site owner. And supported the Member’s choice to make some information private or public.
Conclusion
In the process of improving the Members Area experience, we've made important changes to the Profile widget's design based on user feedback. While not all plans were implemented, a good number of design changes were put into action. These changes have resulted in profile pages that look better and allow the users to create more unique profile pages. Members now have more control over what they share, and their profiles and Account page are reflecting their personal information. These updates made the Members Area more user-friendly for everyone.