Single Lesson: Polish the design

[jasmussen]

There’s some design work for the full-screen lessons that lives in Figma here, that could be worth looking at. I realize it may be limited what you can do here, but there are some things about icons, positioning, sizes, etc, that could benefit from small tweaks.

[fcoveram]

Do we have room now to revisit the design of lessons @renintw @adamwoodnz?

I noticed a few inconsistencies and room for improvement in terms of spacing and text styles that also relate to #2809

[renintw]

Hi @fcoveram 👋 regarding #2809, I noticed that there isn't a related design presented in Figma (or am I missing it?). #2809 refers to the "Lesson Completed" indicator, which appears after clicking "Complete Lesson." It was removed in #2806 due to the reasons @ryelle mentioned below. Could we consider redesigning it based on Kelly's or my ideas? Thanks!

From Kelly #2806 (comment)

I disagree with this. Part of the original feedback in the a11y issue was that "the second button is an interactive control that is not disabled, but does not do anything. This is confusing for all users. It should just be text, and not be an interactive element."

It is not really a disabled button, it's meant to convey information to the user. There's a suggestion that we could add the "completed" label to the main lesson title, and I think that would be better - maybe something like this

Mine #2806 (comment)

I was originally thinking about adding a green label somewhere to make it more obvious, for example like adding an icon like you did and making the entire title green. Also, the "completed" status icon in the sidebar should probably be green as well, to make it more consistent with other places.

[renintw]

I also noticed that the progress bar in the design is still blue, are we aiming to change it back to blue as it's green at the moment in the production. I feel green is more consistent.

Design	Prod

[fcoveram]

…I noticed that there isn't a related design presented in Figma (or am I missing it?)

You are right. Sorry for that. I've been busy with the designs for Five for the Future.

#2809 refers to the "Lesson Completed" indicator, which appears after clicking "Complete Lesson." It was removed in #2806 due to the reasons @ryelle mentioned below. Could we consider redesigning it based on Kelly's or my ideas?

Absolutely. I have in my notes that change.

I also noticed that the progress bar in the design is still blue, are we aiming to change it back to blue as it's green at the moment in the production. I feel green is more consistent.

Green is definitely more consistent.

---

Sorry for not addressing the changes timely. The mockups are outdated so please wait for my ping to make sure I delivery the correct designs. Thanks