DEV Community

Cover image for I Learned to Build an AI Shopping Personality Quiz with JavaScript
Zoe Isla
Zoe Isla

Posted on

I Learned to Build an AI Shopping Personality Quiz with JavaScript

I have always found it interesting how differently people shop online. Some people search for discount codes before making a purchase, while others spend time comparing product features or stick to brands they already trust.

This made me curious about a simple question: Could I build a shopping personality quiz with JavaScript and use the results to understand different shopping preferences?

I decided to explore the idea, starting with basic JavaScript logic and then looking at how AI-powered shopping recommendations could make the experience more useful.

Understanding Different Shopping Personalities

Before writing any code, I needed to decide what the quiz would identify. I came up with five possible shopping styles:

  • Bargain hunter: Looks for coupon codes, discounts, and special offers.
  • Brand loyalist: Prefers familiar brands and products.
  • Research-first shopper: Compares prices, specifications, and customer reviews.
  • Impulse shopper: Often makes quick decisions based on trends or visual appeal.
  • Convenience-focused shopper: Prioritizes easy checkout, delivery options, and saving time.

These categories are simplified examples, not scientific personality types. A person might be a bargain hunter when buying electronics but prioritize convenience when ordering everyday essentials.

While exploring this idea, I came across The Personality Test for Shoppers introduced by savings platform RabattCode.Pro, which gives interactive examples of how shopping preferences can be explored through a quiz-based experience.

It gave me another way to think about how shopping preferences could be presented through an interactive quiz. I started considering how I could build a similar experience with JavaScript, from designing questions and scoring answers to displaying personalized results. It also made me curious about where a simple rule-based quiz ends and AI-powered shopping recommendations begin.

Building the Quiz with JavaScript

I wanted to start small rather than introduce machine learning before understanding the basics.

My first step was to create a scoring system. Each answer would correspond to a shopping style, and the quiz would count the scores to identify the strongest match.

Here is a simplified JavaScript example:

const scores = {
bargainHunter: 0,
brandLoyalist: 0,
researcher: 0,
impulseShopper: 0,
convenienceFocused: 0
};

function recordAnswer(category) {
if (Object.hasOwn(scores, category)) {
scores[category]++;
}
}

function getResult() {
const highestScore = Math.max(...Object.values(scores));

if (highestScore === 0) {
return "Answer a question to discover your shopping style.";
}

const winners = Object.keys(scores).filter(
category => scores[category] === highestScore
);

return winners.length === 1
? winners[0]
: Mixed shopping style: ${winners.join(", ")};
}

recordAnswer("bargainHunter");
recordAnswer("researcher");

console.log(getResult());

This example covers the scoring logic rather than the complete quiz interface. A finished version would also need questions, answer buttons, result descriptions, and styling.

I also learned why tie handling matters. If someone receives equal scores in multiple categories, forcing them into just one category may produce a misleading result. Showing a mixed shopping style is a simple way to handle that situation.

Where Does AI Come Into the Picture?

While building the basic logic, I realized that a JavaScript quiz and an AI shopping recommendation system are not the same thing.

The quiz uses predefined rules. An AI-powered system could go further by learning patterns from appropriate data and estimating which products or offers might be relevant to a particular user.

For example, someone who frequently compares product specifications might appreciate detailed comparisons. Someone who actively looks for discounts might prefer seeing available savings first.

These are only possible recommendations, though. Browsing behavior does not always reveal why someone is shopping, and a system should not treat its predictions as facts.

A useful next step would be to connect quiz results to product attributes, such as price, category, delivery options, and available discounts. This could make the results more actionable without immediately requiring a machine-learning model.

What I Would Improve Next

After understanding the basic scoring system, I could see several ways to develop the project further.

  1. Create a proper quiz interface

I would add multiple-choice questions, progress indicators, and a results screen using HTML, CSS, and JavaScript.

  1. Connect results to product recommendations

Instead of displaying only a personality label, the quiz could suggest relevant product categories, comparison tools, or discount options based on the user's answers.

  1. Test the recommendation logic

I would test different answer combinations, mixed results, unanswered questions, and unexpected input to make sure the application behaves consistently.

  1. Explore AI-based personalization

Once the rule-based version worked, I could investigate whether a machine-learning model would improve recommendations enough to justify its additional complexity.

I would also keep data collection to a minimum. A basic quiz does not need personal browsing histories or identifying information just to calculate a result.

What I Learned from This Experiment

The biggest lesson was that I did not need an AI model to begin exploring personalized shopping experiences. A straightforward JavaScript scoring system was enough to demonstrate the idea and identify the challenges involved.

AI could become useful later, but only if it solves a real problem that simpler rules cannot handle effectively.

I also realized that personalization is not just about predicting what someone might buy. It is about presenting useful information while respecting the fact that people's preferences change depending on what they need.

If I continue developing this project, I would first build a working quiz, test it with different answer combinations, and then compare its results with a more advanced recommendation approach.

If you were building a similar project, would you start with a simple JavaScript scoring system or experiment with an AI model from the beginning?

Top comments (0)