In this article you will learn how to think about the profile screen and what should be on it.
General description
The main profile screen contains of summary of someone’s profile. You can see brief information about them, their interests & activity. You can go deeper and explore each aspect of their profile separately. This screen is the gateway into the user’s profile.
It is important to note that, design-wise, the someone’s profile and a user’s own profile should be generally identical, with only minor differences such as missing control/edit buttons and links.
That being said, each profile is best to contain:
- User’s personal information, such as at least name & avatar.
- The user’s social status – how many followers they have and how many people they follow.
- The user’s platform status – an overview of their activity on the platform, such as tier, points and overall success rate.
- For public profiles, a follow button should be available
- For own profile, an edit button should be available
- An overview of the interests should be available with links to see a full list of interests
- An overview of past and current predictions should be available with links to see a full list
- An overview of the the content based on the user’s interests
User stories
As a user exploring another user’s profile, I want to know as much as possible about them.
Acceptance criteria:
- Display the user’s name
- Display the user’s avatar or show a default avatar if none has been added
- Display the user’s country, gender, age
- Display the user’s tier, points earned and overall prediction success rate
As a user exploring another user’s profile, I want to have the ability to follow that user.
Acceptance criteria:
- A button with follow/unfollow functionality should be present
As a user visiting my own profile, I want to have a button/link that takes me to profile editing.
Acceptance criteria:
- An “Edit profile“ button/link should be present
As a user exploring another user’s profile, I want to have the ability to go into greater about this user and their activity
Acceptance criteria:
- Have a button/link that takes me to a screen with all their interests
- Have a button/link that takes me to a screen with all their predictions activity (current and past)
- Have a button/link that takes me to a screen with all their activity on Top X editions
- Have a button/link that takes me to a screen with all their activity on Match Quizzes
- Have a button/link that takes me to a screen with news based on their interests
As a user exploring another user’s profile, I want to see their top interests
Acceptance criteria:
- Show a limited number (3 by default) of teams followed with a link to see all
- Show a limited number (3 by default) of players followed with a link to see all
- Show a limited number (3 by default) of competitions followed with a link to see all
As a user exploring another user’s profile, I want to see their latest predictions
Acceptance criteria:
- Show a limited number (2 by default) of latest current/upcoming/not-resolved predictions only if my tier is equal or higher than that of the visited profile
- Show a limited number (2 by default) of the latest resolved predictions and their status (successful or not)
- Add links/buttons that lead the visiting user to the screen with all predictions.
As a user exploring another user’s profile, I want to see the latest couple of news based on their interests
Acceptance criteria:
- Show a limited number (2 by default) of news (or other content) based on the user’s interests.
- Add links/buttons that lead the visiting user to the screen with all news.
- Each news item should have a visible reason to be there (e.g. a tag with the team name underneath it)
Design examples
