A decision-support web app I built to help users turn messy choices into a more structured, transparent, and explainable process through weighted scoring, live ranking, and persistent decision history.
Pickwise helps users compare options using a weighted decision framework. Users can add the choices they are deciding between, define what criteria matter most, assign weights to those criteria, and score each option from 0–10. The app then calculates a ranked result and provides a breakdown of why the top choice leads.
I built this project to explore the overlap between product thinking and engineering. I wanted to create something that felt intuitive from a user standpoint, but also grounded in clear logic and explainability.
I wanted to build something that bridged product strategy and engineering. Many tools either lean too heavily on intuition or too heavily on black-box automation. Pickwise starts with a deterministic scoring system so users can stay in control, understand what matters most, and make decisions with more confidence.
The broader vision is to create a hybrid decision product: one that begins with structured logic and later incorporates AI-assisted reasoning without sacrificing transparency.
Users enter the choices they are deciding between, such as jobs, apartments, routes, or schools.
Users choose the factors that matter most to them, such as cost, quality, time, or safety.
Each criterion receives an importance weight, and each option receives a score from 0–10.
The app computes weighted totals and explains why the top option wins.
I used React hooks to manage dynamic state across criteria, options, scores, notes, and decision history.
I used localStorage so the active decision and saved history could persist between sessions without needing a backend.
I built a weighted scoring system that normalizes importance weights, recomputes live, and exposes each factor’s contribution.
Users enter options, criteria, and importance weights. This defines the raw decision space Pickwise needs to reason about.
Since Pickwise was something I coded myself, I wanted the case study to show not just the interface, but the technical thinking that shaped the product. These snippets highlight the parts of the app that were most important to resilience, logic, and explainability.
function safeLoadCurrent() {
const raw = localStorage.getItem(STORAGE_KEY);
if (!raw) return null;
const parsed = safeJsonParse(raw);
if (
!parsed ||
!Array.isArray(parsed.criteria) ||
!Array.isArray(parsed.options) ||
typeof parsed.scores !== "object"
) {
return null;
}
return parsed;
}
useEffect(() => {
localStorage.setItem(
STORAGE_KEY,
JSON.stringify({ criteria, options, scores, optionNotes })
);
}, [criteria, options, scores, optionNotes]);
useEffect(() => {
localStorage.setItem(HISTORY_KEY, JSON.stringify(history));
}, [history]);
const breakdownForOption = (optionId) => {
if (!hasEnoughToRank) return [];
return criteria.map((c) => {
const w = Number(c.weight);
const weightShare = totalWeight > 0 ? w / totalWeight : 0;
const rawScore = scores[optionId]?.[c.id];
const scoreNum =
typeof rawScore === "number" ? rawScore : Number(rawScore) || 0;
const contribution = scoreNum * weightShare;
return {
criterionId: c.id,
name: normalizeName(c.name) || "(unnamed)",
weightShare,
score: scoreNum,
contribution,
};
});
};
const ranked = useMemo(() => {
return [...options]
.map((o) => ({ ...o, total: totalForOption(o.id) }))
.sort((a, b) => (b.total ?? -Infinity) - (a.total ?? -Infinity));
}, [options, criteria, scores, totalWeight]);
lines.push(
`${winnerName} wins because its biggest strength is ${primary.name} (weighted ${Math.round(
(primary.weightShare || 0) * 100
)}%).`
);
if (secondary) {
lines.push(
`It also scores well on ${secondary.name}, giving it a strong overall balance.`
);
}
Pickwise was not just a coding exercise. It was a product exercise in reducing ambiguity, designing for trust, and translating a messy mental process into a clearer workflow.
Building it myself helped me understand how product strategy, user experience, and technical implementation continuously shape each other.
The next iteration of Pickwise introduces an LLM-powered qualitative layer. While the current app produces deterministic rankings, the future version will synthesize user-entered pros, risks, notes, and intuition into a more structured recommendation summary.
I wanted the case study to end with the product itself, so viewers can move from the strategy and code directly into the experience.
A few other projects that show how I design across community engagement, decision support, and product thinking.
Designed a volunteer discovery and admin management experience that helps nonprofits organize events more clearly.
Designed a softer journaling and reflection experience that makes emotional check-ins feel calm, rewarding, and intentional.
Learn more about who I am and what brought me into Product Management!