Victor
@vpon.me
UI/UX tip 💡
Use okLCH instead of HSL/RGB.
This topic deserves an article, and there are already many on it.
In a nutshell it:
1. Includes more colors than RGB (P3, Rec2020)
2. Better for accessibility
3. Better for design consistency
4. Better aligned with human perception
Use okLCH instead of HSL/RGB.
This topic deserves an article, and there are already many on it.
In a nutshell it:
1. Includes more colors than RGB (P3, Rec2020)
2. Better for accessibility
3. Better for design consistency
4. Better aligned with human perception
November 14, 2025 at 9:45 AM
UI/UX tip 💡
Use okLCH instead of HSL/RGB.
This topic deserves an article, and there are already many on it.
In a nutshell it:
1. Includes more colors than RGB (P3, Rec2020)
2. Better for accessibility
3. Better for design consistency
4. Better aligned with human perception
Use okLCH instead of HSL/RGB.
This topic deserves an article, and there are already many on it.
In a nutshell it:
1. Includes more colors than RGB (P3, Rec2020)
2. Better for accessibility
3. Better for design consistency
4. Better aligned with human perception
UI/UX Tip ⚡
When performing lengthy tasks, inform users about the time it will take, and allow them to continue using the app while the task runs in the background.
When performing lengthy tasks, inform users about the time it will take, and allow them to continue using the app while the task runs in the background.
November 12, 2025 at 10:29 AM
UI/UX Tip ⚡
When performing lengthy tasks, inform users about the time it will take, and allow them to continue using the app while the task runs in the background.
When performing lengthy tasks, inform users about the time it will take, and allow them to continue using the app while the task runs in the background.
Another trick is to use grayscale on the <html> tag.
This way you can look at your app from a different perspective and see how it looks grayscaled.
It is useful if you want to see what draws users' attention most, whether interactive elements are recognizable without colors.
This way you can look at your app from a different perspective and see how it looks grayscaled.
It is useful if you want to see what draws users' attention most, whether interactive elements are recognizable without colors.
November 10, 2025 at 12:59 PM
Another trick is to use grayscale on the <html> tag.
This way you can look at your app from a different perspective and see how it looks grayscaled.
It is useful if you want to see what draws users' attention most, whether interactive elements are recognizable without colors.
This way you can look at your app from a different perspective and see how it looks grayscaled.
It is useful if you want to see what draws users' attention most, whether interactive elements are recognizable without colors.
UI/CSS Tip 💡
There is a grayscale filter in CSS that can make your pictures completely grayscale.
It's useful when you want to show a bunch of logos, making them grayscale by default, but when you hover over them, they become colorful.
But!
There is a grayscale filter in CSS that can make your pictures completely grayscale.
It's useful when you want to show a bunch of logos, making them grayscale by default, but when you hover over them, they become colorful.
But!
November 10, 2025 at 12:59 PM
UI/CSS Tip 💡
There is a grayscale filter in CSS that can make your pictures completely grayscale.
It's useful when you want to show a bunch of logos, making them grayscale by default, but when you hover over them, they become colorful.
But!
There is a grayscale filter in CSS that can make your pictures completely grayscale.
It's useful when you want to show a bunch of logos, making them grayscale by default, but when you hover over them, they become colorful.
But!
Last year I sent quite a few real letters via post.
I didn't just send simple postcards, but rather a large envelope filled with interesting content.
The problem is that each letter costs around ~$10-15 to send, and if I send, say, 100 letters, it'll be $1000.
I didn't just send simple postcards, but rather a large envelope filled with interesting content.
The problem is that each letter costs around ~$10-15 to send, and if I send, say, 100 letters, it'll be $1000.
November 5, 2025 at 11:54 AM
Last year I sent quite a few real letters via post.
I didn't just send simple postcards, but rather a large envelope filled with interesting content.
The problem is that each letter costs around ~$10-15 to send, and if I send, say, 100 letters, it'll be $1000.
I didn't just send simple postcards, but rather a large envelope filled with interesting content.
The problem is that each letter costs around ~$10-15 to send, and if I send, say, 100 letters, it'll be $1000.
UI/UX Tip 💡
Avoid placing all validation messages below the form in one spot.
This forces users to move their eyes up and down to match errors with inputs.
When users fill out a specific input, they are within the CONTEXT of that data.
Avoid placing all validation messages below the form in one spot.
This forces users to move their eyes up and down to match errors with inputs.
When users fill out a specific input, they are within the CONTEXT of that data.
November 3, 2025 at 12:26 PM
UI/UX Tip 💡
Avoid placing all validation messages below the form in one spot.
This forces users to move their eyes up and down to match errors with inputs.
When users fill out a specific input, they are within the CONTEXT of that data.
Avoid placing all validation messages below the form in one spot.
This forces users to move their eyes up and down to match errors with inputs.
When users fill out a specific input, they are within the CONTEXT of that data.
UI/UX Tip ⚡
People often want to use your logo, and they'll typically right-click on it on the landing page.
Consider offering an option to copy the logo or access brand guidelines, which can include various logo variations.
People often want to use your logo, and they'll typically right-click on it on the landing page.
Consider offering an option to copy the logo or access brand guidelines, which can include various logo variations.
October 31, 2025 at 9:58 AM
UI/UX Tip ⚡
People often want to use your logo, and they'll typically right-click on it on the landing page.
Consider offering an option to copy the logo or access brand guidelines, which can include various logo variations.
People often want to use your logo, and they'll typically right-click on it on the landing page.
Consider offering an option to copy the logo or access brand guidelines, which can include various logo variations.
UI/UX Tip 💡
Emphasize important information.
Users frequently visit your app and become familiar with the dashboard cards, their placement, and their content.
However, if the label and value have the same visual weight, it can make more distraction than clarity.
Emphasize important information.
Users frequently visit your app and become familiar with the dashboard cards, their placement, and their content.
However, if the label and value have the same visual weight, it can make more distraction than clarity.
October 28, 2025 at 8:24 AM
UI/UX Tip 💡
Emphasize important information.
Users frequently visit your app and become familiar with the dashboard cards, their placement, and their content.
However, if the label and value have the same visual weight, it can make more distraction than clarity.
Emphasize important information.
Users frequently visit your app and become familiar with the dashboard cards, their placement, and their content.
However, if the label and value have the same visual weight, it can make more distraction than clarity.
Want to keep your subscribers on your list?
Don't let them uncheck the "Lessons and Learning" checkbox.
Still, make sure to show it, so users understand they will receive notifications regardless.
Don't let them uncheck the "Lessons and Learning" checkbox.
Still, make sure to show it, so users understand they will receive notifications regardless.
October 25, 2025 at 10:55 AM
Want to keep your subscribers on your list?
Don't let them uncheck the "Lessons and Learning" checkbox.
Still, make sure to show it, so users understand they will receive notifications regardless.
Don't let them uncheck the "Lessons and Learning" checkbox.
Still, make sure to show it, so users understand they will receive notifications regardless.
UI/UX Tip 💡
For draggable handles, create an invisible area larger than the visible one, making it easier to interact with.
This approach is especially important for mobile devices, where precise tapping can be challenging.
For draggable handles, create an invisible area larger than the visible one, making it easier to interact with.
This approach is especially important for mobile devices, where precise tapping can be challenging.
October 24, 2025 at 11:51 AM
UI/UX Tip 💡
For draggable handles, create an invisible area larger than the visible one, making it easier to interact with.
This approach is especially important for mobile devices, where precise tapping can be challenging.
For draggable handles, create an invisible area larger than the visible one, making it easier to interact with.
This approach is especially important for mobile devices, where precise tapping can be challenging.
UI/UX Tip
Instead of using generic text like "Type your reply" in placeholders, try being more specific.
For instance, if you're replying to someone, include their name in the placeholder.
This approach can be applied to many other situations as well.
Instead of using generic text like "Type your reply" in placeholders, try being more specific.
For instance, if you're replying to someone, include their name in the placeholder.
This approach can be applied to many other situations as well.
October 23, 2025 at 11:20 AM
UI/UX Tip
Instead of using generic text like "Type your reply" in placeholders, try being more specific.
For instance, if you're replying to someone, include their name in the placeholder.
This approach can be applied to many other situations as well.
Instead of using generic text like "Type your reply" in placeholders, try being more specific.
For instance, if you're replying to someone, include their name in the placeholder.
This approach can be applied to many other situations as well.
UI/UX Tip ⚡
A handy trick to standardize icons is to place them inside rectangles with fixed dimensions.
This method helps compensate for inconsistencies when icons are of different sizes.
By putting them into containers, you make them appear uniformly sized.
A handy trick to standardize icons is to place them inside rectangles with fixed dimensions.
This method helps compensate for inconsistencies when icons are of different sizes.
By putting them into containers, you make them appear uniformly sized.
October 21, 2025 at 2:08 PM
UI/UX Tip ⚡
A handy trick to standardize icons is to place them inside rectangles with fixed dimensions.
This method helps compensate for inconsistencies when icons are of different sizes.
By putting them into containers, you make them appear uniformly sized.
A handy trick to standardize icons is to place them inside rectangles with fixed dimensions.
This method helps compensate for inconsistencies when icons are of different sizes.
By putting them into containers, you make them appear uniformly sized.
Awful UX.
I don't get it, why 20% of a video is covered by who-knows-what.
- Sometimes I can't see important parts of the video.
- I never can find "the full video" when YouTubers ask for it.
- I'm afraid to touch all of these text elements since they are clickable.
I don't get it, why 20% of a video is covered by who-knows-what.
- Sometimes I can't see important parts of the video.
- I never can find "the full video" when YouTubers ask for it.
- I'm afraid to touch all of these text elements since they are clickable.
October 10, 2025 at 3:01 PM
Awful UX.
I don't get it, why 20% of a video is covered by who-knows-what.
- Sometimes I can't see important parts of the video.
- I never can find "the full video" when YouTubers ask for it.
- I'm afraid to touch all of these text elements since they are clickable.
I don't get it, why 20% of a video is covered by who-knows-what.
- Sometimes I can't see important parts of the video.
- I never can find "the full video" when YouTubers ask for it.
- I'm afraid to touch all of these text elements since they are clickable.
