Lumen

Hey Melanie,

I like that you highlighted success criteria for almost every element and included the colors you used in the interface.

When I looked a bit closer at the visuals, I noticed a few inconsistencies. Some labels point to the wrong elements, and in a few cases the elements they refer to aren’t even there, which makes things a bit confusing to follow.

Also, the descriptive texts for the success criteria are overflowing outside their containers. Since you were so detailed in other parts, this one stands out more than it should.

I also agree with the earlier comment about the highlighted card in a different color. Without a clear reason behind it, it feels a bit random. If there’s logic behind it, it would be good to explain it. If not, I’d rethink it so it aligns better with the rest of the design.

Cheers!

Melanie, I really like the approach here. 😊 Mapping specific UI elements to WCAG 2.1 AA criteria shows you treat accessibility as real design decisions, not just theory. The contrast scorecard at the bottom is a great touch because it immediately backs up your color choices with hard numbers.

I agree with previous observation. The orange callout stands out among the purple ones and it's unclear whether that's an intentional distinction (e.g. iOS HIG vs WCAG) or an oversight. A small legend would solve this instantly. Also worth making sure all callout text stays within its box, a few labels on the right side get clipped, which slightly undermines the polished feel. 🤔

The sign-in screen itself is solid from a heuristics standpoint. Persistent labels, clear hierarchy, error state communicated three ways. These are thoughtful, well-grounded choices. 👍

Overall this project makes a strong impression and shows real analytical thinking. Polish the callout visuals, add that legend, and you'll elevate the whole piece even further. Great work. You're clearly heading in the right direction! 💪😊❤️

Great project Melanie, I love how you've broken everything down.

A couple of things:

• Is there a reason one of the description boxes is orange and the rest are purple? If so, maybe a little key could be handy
• Make sure text fits within the description boxes

Other than that, amazing job thinking through all aspects of the screen!

I like the screen! It looks modern and minimal, and the way you mapped UI elements to WCAG 2.1 AA criteria shows deep analytical thinking. It's great to see accessibility treated as a core design decision, not just an afterthought.

However, to elevate this project to a professional level, I’d suggest a few improvements:

• Your tooltips are useful, but for a high-quality presentation, it's better to show some things in action. For example, instead of just mentioning autocompletion, show an active state of the input field. This makes the UX much more tangible.
• I noticed that some text is overflowing outside the borders. This makes the descriptive part difficult to read and undermines the "polished" feel. Check your border radius and text containers.
• I’d recommend using standard 16px paddings for the layout. This will give the information more "room to breathe" and improve overall scannability on mobile devices.
• For the Social Login buttons (Google, Apple), it's better to use standard brand logos and keep them slightly larger. This improves recognition and follows brand guidelines.
• I agree with Michal and Petar regarding the callouts. The orange callout stands out among the purple ones without a clear reason. If it's a different category (like iOS HIG vs. WCAG), add a small legend to explain the logic.

Overall, this is a very strong and well-grounded piece. Fix these small visual "bugs," and the project will look much more professional. Great work!