The new homepage for all of your social media accounts.
Our vision was to create a new era of social connection by building the most advanced social network
PRODUCT DESIGN DIRECTOR
FIGMA, WIREFRAMING, ADOBE, USER RESEARCH & TESTING, BRANDING
PRODUCT DESIGNER: ME
PM: BLESSING UBANI
Tagg redefines in person and online networking by connecting users across different social media sites through a centralized platform. By serving as a repository for sharing and storing all your social media, Tagg allows users to expand their network and allow for direct access across various social media platforms, an optimized form of social media exchange and marketing.
While much of the details of the work I have done is still under NDA, and there is only so much I can show, I'd be happy to chat more deeply about my experience in person.
When I was first presented with the idea of Tagg I realized that as much as I used social media I still did not have a full grasp on what social media is and why people used it. So I started by doing a deep dive into the world of social media to do this I conducted user interviews with active social media users and did online research on the most popular social media platforms. User interviews consisted of qualitative questions to really understand what users consider their unique identity on each platform. While my online research focused on more quantitative data on each social platform. And before beginning our ideation and design phase, to understand our user and the problem statement we created Sarah Miller.
Data: SproutSocial *Note that this data is generalized across millions of users
After I had a better understanding of our user base as well as the specific market we would be entering. I began to define the goals of this app.
Goals + Direction
A look into a user's online presence. Tagg would be the intersection of identity and community
With the now overly familiar world of social media, Tagg will need a design with a newer and fresher interface where users curate their own complete online persona
Tagg will need to consolidate the need for a cohesive way to build and give access to personal brands across multiple platforms
As per the goals we laid out we knew from the beginning that our profile page had to look different from what was already offered. One of the ways in which we focused on accomplishing this was to have it so that the profile page felt more like an environment in which the users created. Specifically through the use of the profile pictures, by having that take up most of the screen the user is ultimately deciding what their Tagg identity will end up looking like
Other features and pages that we focused on was the suggested people's page the page in which the user can discover and network with other users as well as the messaging feature
By analyzing the needs and interests of social media users we began to create our own brand. I organized the style guide consisting of creating the logo, the typographic system, icon library, color palette, button styles, and brand language. We made sure to reference established social media platforms analyzing what each user found attractive about each application.
Before moving on to creating the high fidelity mockups and beginning the development of the app we went through many phases of the redesign. Throughout it all, I made sure to have a list of criteria in which we would always stop to re-evaluate decisions.
Is this feature feasible to develop within our timeline? Is this icon necessary? Is there a way to make this feature easier for the engineers while also not compromising on the user experience?
Does the graphics on this page match our brand identity? Does it align with our color palette? Is there a cohesive visual design?
Will this design meet all of our goals for the app? Is this adding to our mission?
Can this feature be incorporated throughout the app? Is our system capable of handling the scale of users in which we were aiming for?
Here is a brief look into the product!! As I mentioned before, the app is still in development and under my current NDA I, unfortunately, cannot publish the working prototype. However, I am more than happy to share more information about my design process if you wish to reach out to me!
Profile pictures take up most of the screen
Tags or highlights are shown that link to the contents on each social platform that a user has connected to Tagg.
Users have the ability to link and unlink more socials in their profile.
Your profile page connects all your socials to one place giving you a preview of the feed from all your chosen social media accounts.
Similar to the profile page the image a user chooses for their profile will take up the majority of this screen
Users can see a preview of content from the other user's profile before choosing to click the username and view the full profile
Discover new people through our suggested profiles feature. Meet, network, and connect!
Suggested People's Page
Users will have the opportunity to direct message other users on the app
Message other users on the app sharing content with each other
Innovation vs Intuition
One of the biggest challenges in designing this product is creating a balance between something new and innovative vs something familiar and intuitive. The goal from the beginning was to create a platform that is fresh and unique. The challenge we found within that is "how do we build something that is new but also intuitive, easy to use, and effective all within our timeline?"
After numerous lengthy debates with the engineering team, the marketing team, and the C-suite team, we realized in the end it is our customer who defines the quality of our app, not our timeline or our technology. We needed to learn to stop disproportionately focusing on output and instead focus on outcomes. Instead of always asking "Is this feature something we have never seen before?" and "how quickly can we build it?" we had to ask "Are we building the right thing?" "Is this what our customers want?" With that in mind, we shifted from designing new features to user testing established features all to make certain that what we produce is defined by our customers' needs, not ours.