- Role
- Product & UI design — COGS 123 (group HCI studio)
- Tool
- Figma, Notion, Google Forms
- Tags
- product · digital
Overview
This was a quarter-long COGS 123 team project that evolved from an early concept (Skill‑It)—a swipe-based, one‑to‑one skill exchange inspired by dating-app matching—into PixelPact: small teams (about 4–5) matched on interests and roles, working monthly briefs framed as nonprofit prompts, with dashboards, submissions, leaderboards, badges, and community forums so students could build portfolio-ready work together.
We ran a Google Form survey with ~23 UCSD respondents interested in UI/UX and web/app work, plus competitive scans (early decks: YouTube/Twitch; later: Behance, Dribbble, DailyUI, and course platforms like Coursera / Skillshare). Findings stressed chat, progress tracking, and concerns like skill disparity—which fed personas, a SWOT, and the feature map in the slides.
Prototyping moved from a Notion-heavy walkthrough (confusing navigation for some testers) to a clearer story in Figma with Google Sheets and group chat stand-ins—so critique could focus on profiles, team workspace, contest submissions, leaderboards, reviews, and community surfaces you see in the artifact grid.
- Phase I Skill‑It: social setting, competitor analysis, feature list, and rough site map before the team pivot
- Phase II PixelPact: audience definition, survey results, interaction priorities (chat vs video), and SWOT vs portfolio/challenge products
- Phase III story + prototype: problem narrative, nonprofit/monthly contest model, how it works, dashboard, profile UI, persona, and end‑to‑end UX flow
- Final deck: novelty positioning, competitive matrix, and high-fidelity storyboards for profiles, leaderboard, collaboration, community, and design highlights
- Responded to class feedback by swapping Notion for Figma-led demos and more familiar, participatory simulation tools
Process & artifacts
Deck title slides omitted. Same chronology as the overview: Skill‑It pitch → PixelPact research → Phase III narrative and flows → final UI system (matrix, leaderboard, community).