1 / 3
2 / 3
3 / 3
Profile Page Evolution
Creating a better profile experience for users and the business, and capturing the data needed to match users with opportunities.
Project summary
Background
At Xinova, I was working on building a platform to facilitate innovation, matching our network of innovators with problems that need solving. Central to this was building up our knowledge of our innovators, as housed in their profile page.
My role
I led the full design on this which included information architecture, interaction, visual and content design.
Target users
Our Xinova network members, and Xinova employee "project managers"
Problem to be solved
We were looking to iterate on the previous, MVP version of the page to expand the amount of data that profile housed, improve the usability and visual look, and provide permission based views.
For the business, we were looking to build the data structures to house data on members, setting the foundation to match the right member with an opportunity, which is a key business value of ours.
For our members, we were looking to create a sort of "storefront" for them, so that they could show off their background and expertise in order to convince and secure opportunities to work on.
For our project managers, we needed to provide a more advanced view of members' data. These users were also the ones most frequently making decisions on whether a member had the right background and expertise for an opportunity, so it was critical that they had access to the information to make these decisions.
Outcome
The updated profile design encompassed layout changes, introduced a 2-column layout and a subnav, created new UI patterns, improved the robustness of current data types, introduced new data types, provided for permission-based viewing, and included designs for empty states.
The updated profile design resulted in an increase in the amount of data we had on members across the network, with double- to triple- percentage increase of active users with specific data points, increasing the amount of knowledge we have on our members and the expertise they have.
This expanded knowledge of our members provides us the foundation we need to match and find experts within our network. This is a vital piece to the vision of our product and the value we bring as a business.
Breakdown of my process
Starting state
Here's a view of the profile page before we started this project:
Project kickoff
Working closely with the product manager, we kicked off the project with a project charter to outlined the problem space, users, objectives and goals, how to measure success, any research, and any other requirements in order to ensure that the full team is all on the same page.
Inspiration & competitive research
Before starting in on designs, I reviewed examples of profile pages from our competitors (pulled together by our product manager) and reviewed other examples from elsewhere in the tech industry. I specifically was looking at layout of the pages, and the types of content users might expect on them.
Data prioritization
A key piece of this project was to identify the data that we wanted to collect and display in the profile. I worked collaboratively with the product manager and the prior lead designer (of the first version of the profile) to review profile data types and determine priority. This helped provide us with direction so that we could scope the work for this project, and divide it up into smaller releases based on priority.
Wireframes & sketches
I went through many iterations of the design during the initial design phases. My focus included determining how to group the data, how to set up a sub-navigation for this page, including different views for different users, reusing existing patterns, providing more visual interest for the page, and exploring a "Xinova DNA" summary section. These iterations included frequent reviews with the project team and stakeholders for feedback and visibility.
Testing
I worked closely with one of our other product designers who took the lead of doing research on this project. The research was set up as informal interviews, with quasi-tasks for the users to perform. I put together a clickable prototype using my wireframe mockups and InVision. We used 4 internal users, representing 2 different user types, and 2 external Xinova users. Our research helped us understand the data that was more important to the various users.
Revisions & empty states
Through the progress of the project, I continued to refine the designs based on feedback from testing, the project team, stakeholder reviews, and the product team. I also brainstormed and designed out the empty state of the profile for various user views.
Specs & user stories
Designs were captured into user stories, using Jira tickets. I built out the user stories, with acceptance criteria and asset and resources attached. While it is not typical for our team to use redline specs for designs, a number of the designs used in profile were intricate interactions, including new or modified design patterns, and our team decided redlines would work best for these cases.
Reflections
The team encountered some real challenges with the size of this project and scoping. We started with 4 releases, but ended up cutting back to 3 with limited functionality due to changes in the business. Many pieces of functionality were dropped.
Despite this, we did continue to iterate and evolve the profile and data we have on our members. Some of these iterations included:
- Scraping expertise from profile data.
- Expanding interest topics to gauge expertise in area, and includes seeding this data from our internal users' knowledge.
- Encouraging profile completion.