It is emphasized that every story in Storybook represents a rendered state of your UI, and in their view, every story is a test. When using Vitest, Storybook automatically detects it and provides capabilities to run tests on top of these stories. There's a button within the Storybook UI to run all tests, providing immediate visual feedback on passing or failing states.

If you are design challenged, (seeing good design or not) then accept that it's not natural for you. You have to spend extra time to watch for alignment, things need to be set up evenly and straight. Images need room to breathe and the human eye should be able to naturally follow the website. Colors convey emotion without explicitly stating it. If you have a website that is dark and gloomy you might not want to have it as a wedding site or similar. Templates are valid to use as well if design challenges you.

This made me think about everything we interact with on a daily basis. When you do something like interact with an app for example. That is an exchange of your time and energy. Now multiply this by every user that opens the app. This scenario makes it possible for technology to continue advancing.

Loss aversion is the tendency for users to strongly prefer avoiding losses over acquiring equivalent gains. In design, users are more motivated to act when they perceive they might lose something, rather than simply gain.

A subscription service shows “You’ll lose access to your saved playlists if you cancel” instead of “Keep your playlists if you renew.”

E-commerce sites use low-stock messages like “Only 2 left in stock” or countdown timers that highlight the risk of missing out.

Cognitive load refers to the amount of mental effort required for a user to process information and complete a task. If the design overwhelms users with too much information, too many choices, or confusing layouts, their performance and satisfaction drop.

A checkout page that asks for unnecessary details (multiple address fields, redundant confirmations) increases cognitive load, making users more likely to abandon the process.

A dashboard cluttered with dense charts and data makes it harder for users to find what they actually need.

Users tend to rely heavily on the first piece of information (the “anchor”) they encounter when making decisions, even if it’s arbitrary or not the most relevant. This anchor shapes how they evaluate later options.

An e-commerce site shows a “Was $199, Now $99” label. Even if $99 is the fair price, the original $199 acts as an anchor, making the discount feel bigger.

In subscription models, showing a premium plan first makes mid-tier plans look more affordable by comparison.

Users are more likely to notice and recall items that appear at the beginning or end of a list, menu, or sequence, while middle items are less memorable.

In a navigation bar, users are more likely to remember and use the first and last menu options.

In onboarding flows, steps at the beginning and end are more likely to stick than those in the middle.

The usability of an interface is influenced by the size and placement of interactive elements. Large, easy-to-reach buttons or links speed up interaction, while small or poorly placed ones slow users down and increase errors.

A “Submit” button that is large and near the form is faster to click than a tiny button tucked in the corner.

On mobile, making tap targets too small leads to mis-taps and user frustration.

Users take longer to decide when presented with too many options in an interface. The more choices or complexity, the slower the decision-making process, which can hurt usability. A navigation menu with 15 categories overwhelms users. They hesitate, backtrack, or even leave the site. By grouping related items or limiting visible options, users can find what they need faster.

A design team believes that their new app navigation is “intuitive.”

During usability testing, they notice the comments from users who find it easy.

But they downplay or ignore feedback from users who get confused, maybe labeling those users as “outliers.”

As a result, the confusing navigation issue persists, frustrating future users.

Imagine you’re a fan of the Detroit Lions.

When the referee makes a bad call against your team, you notice it right away and complain that the refs are biased.

But when the referee makes a bad call in your team’s favor, you barely notice or you justify it as “finally some fairness.”

W Steve Jobs.

This one is tricky. A mental model when looking at UXD, is when a product matches or lines up with a previous experience someone had. Think about Apple as a whole. Their products, websites and presentation of it all. Its clean and seamless. Everything they do, is to make you want to interact with their products. This creates a sense of familiarity and comfort.

I see this everywhere. It seems to be a massive trend on websites that give you deals like TokTok, Shein, Temu and foreign sites. Most of the time as soon as you open their page you instantly get a popup that is unavoidable telling you that you have just gotten huge discounted coupon but you have to use it now! It is a overly used tactic now.

This is something I think we all do sometimes. Being college students, holding jobs and trying to keep up with routines. We want whatever makes things easy. Less thinking, more doing. The app calm they used in this example made me think about what I do that falls under this. For example I see "this delicious protein shake/snack takes 5 minutes to make!" online somewhere. Yes that may be true and its the top recommended on a website. But that doesn't always mean its true.

you will see these questions 3 times before the test!