Taskset
Making the social strategies of leading brands easier to understand.
Role
End-to-end design, UI/UX Design, Product Development
Timeline
1 Month
Figma
React
Next.js
Supabase
Claude Code
Overview
Thousands of posts. A wealth of insight. A difficult place to start.
Taskset helps founders and small teams learn from the social strategies of leading digital brands. It organizes social content into patterns, interprets brand behavior through archetypes, and distills what it finds into takeaways. I conceived, designed, and built the product independently.
The Problem
Social media has become an increasingly important part of how digital products market themselves, build communities, and connect with customers. For many product-led businesses, developing an effective social presence is an ongoing challenge: teams need to understand what resonates with their audiences, how other brands communicate their value, and how to translate those observations into their own strategies. Finding examples of how leading brands approach specific social media goals—such as community engagement or product launches—often meant searching through thousands of posts across social platforms. I saw an opportunity to help smaller teams learn from curated examples without relying on endless manual browsing.
Rather than organizing content by publishing date, I designed Taskset around how people want to learn from it.
Patterns (Organize): Group posts by the goals they serve, allowing users to explore specific types of content.
Archetypes (Analyze): Distill a brand’s strategy, identity, and behavior into a compact analytical profile.
Takeaways (Apply): Translate observations into ideas users can consider for their own marketing strategies.
Patterns
From endless scrolling to purposeful discovery.
Patterns address the first challenge: finding relevant content. Brand's posts are grouped by purpose, including product launches, new features, community engagement, seasonal and cultural moments, rebrands, and "UGC" and influencer campaigns.
Two ways to explore:
Brand-first: Explore a brand’s approach across different content patterns.
Pattern-first: Compare how different brands approach the same goal.
The distinction matters; users don’t always know which brand to study, but they usually know the problem they’re solving.
Design decision: Organize discovery around user intent, not publishing order.
Archetypes
Making brand behavior easier to interpret.
Categorizing posts helps users find relevant examples, but it doesn't necessarily explain what makes a brand's approach distinctive. This is where I found analysis to be the next step.
Archetypes became the platform's interpretation layer: a framework for distilling a brand's social behavior into a compact analytical profile. The idea was inspired partly by character archetypes in video games. An Archetype couldn't simply be a creative label; it needed to communicate something meaningful about the brand's strategy and behavior.
For example, Notion’s archetype is defined as “The Steward,” reflecting how it positions AI as a trusted collaborator through friendly illustrations, plain language, and product updates that help users stay in control.
An Archetype was intended to act as a concise model of a brand's social presence, bringing together aspects of its strategy, identity, behavior, and impact, in a single unit.
Design decision: Make the analysis memorable without making it superficial.
Takeaways
From observation to application.
Takeaways is fairly straightforward: it connects the research back to the user’s own work, turning what they’ve learned from Patterns and Archetypes into ideas to consider and to apply to their own social strategy.
Design decision: Present the insights as clear and actionable, so users can connect what they've learned to their own marketing and social decisions.
Designing For Comprehension
Making an unfamiliar product feel intuitive.
Taskset combined several ideas that users might not have encountered together before. It wasn't simply a social media feed, an analytics dashboard, or a reference library. Its value came from connecting content organization, brand interpretation, and strategic takeaways. I didn't want the platform to immediately presume the user would understand the entire framework upfront. So, I made the structure visible in the navigation:
Home provided the entry point into the product.
Brands allowed users to explore individual companies.
Patterns focused on the different purposes social content can serve.
Archetypes provided a broader view of the framework used to interpret brand behavior.
Design decision: Make the product’s underlying structure visible through clear navigation and distinct destinations to clear any ambiguity about the purpose and function of the product.
A Critical Constraint
Taskset's underlying content model introduced a significant challenge.
Taskset analyzes posts published by other brands, which raised questions about copyright, Instagram’s terms, data-access restrictions, and the commercial use of content outside its original platform.
I didn’t want it to look like a paid wrapper around other people’s posts.
Instead, I placed greater emphasis on the analytical process surrounding the content. Patterns, Archetypes, and Takeaways were designed to give Taskset its own purpose: helping users organize, interpret, and learn from the social activity of leading brands. This reinforced the original product vision. The value wasn't simply in providing another place to browse posts; it was in making the strategies behind those posts easier to investigate.
Designing and Building in Parallel
Translating high-fidelity concepts into a working product.
I led Taskset independently from product concept through design and implementation, working across product design, UX/UI, frontend development, and AI-assisted analysis.
I skipped a long wireframing phase and prototyped the core components in Figma at high fidelity, then refined smaller decisions directly in code. The larger structure, how Brands, Patterns, and Archetypes relate as a system, got careful upfront thought. This made design-oriented details like (spacing, interaction, hierarchy) easier to judge in the working product.
I built the web app with React, TailwindCSS, and Next.js on Supabase, and used Claude Code in my development workflow. AI also supported the analysis of brand content, but I reviewed every output and made the final call.
Reflection
Making strategic social knowledge more accessible.
Taskset began with a simple problem: finding useful examples of brand strategy took too much manual searching. I built a product around three connected ideas, Patterns, Archetypes, and Takeaways, to help users move from discovering content to interpreting it and applying what they learn.
The product remains in private testing, so its impact has not yet been validated through public use or measured outcomes.
However, what I value most about the project is the opportunity to take an ambiguous problem and develop it into a cohesive product experience, from the underlying concept to the interface that brings it to life.