Sherlyn UX

If you are curious of how far Google had came, here's where you find their story.

Search Through Time Over the years, the web and the world have changed. Since our launch in 1997, Google Search has continued to evolve to help you find the information you're looking for.

Kerning is something that I believe graphic designers focus more on but not as much for web designers, probably because
1. we trust web fonts as it is
2. there are often too much text to adjust their kernings individually
3. everyone's speed reading through
3. nobody cares - designers and users alike

I was googling for javascripts to adjust kernings, making websites more readable and visually better, but was given the CSS on how to configure them.

If you are interested, here's the link:
https://developer.mozilla.org/en-US/docs/Web/CSS/font-kerning

Everyday seems to have a new CSS attribute to learn. 🥲

font-kerning - CSS: Cascading Style Sheets | MDN The font-kerning CSS property sets the use of the kerning information stored in a font.

It has been a long time since I read something useful and eyeopening to me.

I was learning UI design on Udemy and came across this question in my mind:

"What is the difference between reference pixels and (hardware) pixels?"

And I found my answer in this article.

A Pixel Identity Crisis The pixel has long been the atomic particle of screen based design: a knowable, concrete unit of measurement. But layouts based on the hardware pixel are fast becoming an endangered species. Even t…

I am absolutely thrilled to share that I've successfully wrapped up my 5th conference and even aced the exam – an accomplishment that has led me to attain my coveted UX Certification! 🌟

A heartfelt shoutout goes to my incredible mentors and bosses in SMU. Their unwavering support and the valuable opportunities they've extended to me have played an instrumental role in my journey to becoming a more proficient UX practitioner.

Acknowledging that knowledge alone is just the tip of the iceberg, I'm committed to translating all that I've gleaned into real-world applications. My aim is to inspire and enlighten others, urging them to recognize the profound significance of user experience in myriad unexplored dimensions.

Once again, thank you from the bottom of my heart for making this remarkable chapter possible. I can't wait to embrace the exciting challenges and prospects that lie ahead! 🙏🚀

-----------------------------------------
Find my name "Sherlyn Yap" or my Certification ID "1030726" on https://www.nngroup.com/ux-certification/people/

I've just learned something new in CSS - drawing polygon shapes and clipping the image that is within the shape.

https://sherlynyap.wordpress.com/2023/04/12/drawing-polygons-using-css/

Feeling like the day is passing very slowly? Try this game and see how fast you can get all the party objects leave the house! Took me 9+ mins though. LOL

Party Pooper Ever tried to s***f out an unwanted house party? Test your skills in Party Pooper, a web experiment from Animade.

Anyone can learn UX! First, let's understand how we can use this CASTLE framework on workplace software.

C — Cognitive Load
A — Advanced Feature Usage
S — Satisfaction
T — Task Efficiency
L — Learnability
E — Errors

The six dimensions are constructs intended to represent the most important elements of user experience for productivity applications that are used as part of someone’s job. In our case, such examples are SharePoint and public website CMS. The selection of these constructs has taken into account general user-experience principles and priorities, as well as typical business cases and needs for workplace software.

CASTLE Framework for Workplace Applications UX The HEART framework is great for B2C products but is lacking for workplace applications where users cannot choose the product. CASTLE offers a complementary assessment framework for UX that focuses on the needs of internal product teams.

Visual design rules you can safely follow every time
https://anthonyhobday.com/sideprojects/saferules/

My top 5 areas (in a sequence of appearance in the article) that need improvements are:
1. Saturate your neutrals
2. Optical alignment is often better than mathematical alignment
3. If you saturate your neutrals you should use warm or cool colours, not both
4. Keep container colours within brightness limits
5. Use a line length of around 70 characters

What about yours? What rules would you want yourself to improve on?

Visual design rules you can safely follow every time Pure black looks unnatural on a screen, and pure white is too bright. Use a vey dark and very light grey, respectively. Any other references to “black” and “white” in these rules assume you’re following this rule.

"I believe including Hierarchy Strips, alongside a detailed explanation is a great way to improve your portfolio reception and to show that you’re making conscious, planned design decisions.

Because contrary to what many UX’ers will tell you, UI design is not just about some colorful pixels." — Michal Malewicz

Hierarchy strips in user interfaces Show that you understand the WHY of your visual work.

It's been a while since there's something I've achieved and feel satisfied about, and that is to manage to track dropdown menu options using GTM.

https://sherlynyap.wordpress.com/2022/11/04/tracking-dropdown-menu-options-of-a-form/

A helpful tip in using a bulleted list, be it in your word documents, emails, or even website content.

4 Tips for Bulleted Lists in Digital Content (Video) Bulleted lists can save users time and help them scan our content more quickly, but only when they’re used correctly.

Totally mindblown. It was just so easy to have an image displayed when the video is loading!

Pratham on Twitter “HTML thing you probably didn't know. The "poster" attribute specifies an image to be shown while the video is downloading, or until the user hits the play button. Like a YouTube thumbnail.”

How cool can it be, using calc() to calculate a min/max value for border-radius!

Conditional Border Radius In CSS - Ahmad Shadeed How to use CSS comparison functions to create a conditional border radius

Nice and very informative website to explain why sending cash donations are more effective than sending goods over after a natural disaster. https://donateresponsibly.org/

I am posting because I like the font selection, colours used and the general storytelling. :)

Donating to disaster relief? Find out why sending goods might be doing more harm than good

If you are someone looking for a job in the digital design industry, or someone who is interested to know if it's time to change company or get an increment, this article might be of some help.

Things I Wish I’d Known Earlier In My Career — Smashing Magazine Do you feel stuck in your company? Do you believe you deserve a raise but it never happens? Do you think you might need to quit the job? Let’s figure it out. In this article, Vitaly looks at some things he wishes he’d known earlier in his career.

Not the latest post but still valid explanation of why we should use grid. https://aneventapart.com/news/post/designing-intrinsic-layouts-aea-video

“Designing Intrinsic Layouts” by Jen Simmons—An Event Apart video What do CSS features like CSS Grid, Flexbox, Multicolumn, Flow layout and Writing Modes mean for our design medium? How might we better leverage the art of graphic design? How will we create something practical, usable, and realistically doable?

I've done my first mind map and that was for the book "Atomic Habits", which I've just finished reading and find the methods pretty useful for beginners and refresher to people who had already in the midst of executing some of the menthods.

Read my thoughts and find some peace in my messy first mind map: https://sherlynyap.wordpress.com/2022/04/23/atomic-habits/

---

Recently, I've started to read again because I've ended my Coursera learning and has some pockets of time to kill.

So while doing some learning in the past and some exchanges with colleagues, I've learnt that doing mind maps can help you recollect what you've went through and learn deeper. So, I've decided to try mapping out of what I've read or learn.

I've started this new blog which I will share my readings, learnings and work portfolio (still a work-in-progress).

Atomic Habits (Updated) This is a book that teaches you how to make your new habits easy, obvious, attractive, and satisfying so that you will repeat doing them without feeling a pinch or a kick in your face. And I needed…

Key takeaway: Provide users a few meaningful defaults/shortcuts and also a way to customize their option.
https://www.nngroup.com/articles/increase-user-autonomy/

Three Methods to Increase User Autonomy in UX Design Designers should help people use interfaces in ways that align with personal preferences and priorities.

Do you have a lot of content in a listing page that you wonder if there are other options other than the good old paginations?

Try infinite scroll with pagination to give your users a faster load of the list of items and also a good control of where they are so they can always come back to where they stopped. :)

I find this article very visual and easy to understand, just like the 2h workshop by Vitaly Friedman on Frustrating Design Patterns in 2021. If you want to watch the 2h workshop, I've added the link in the comments! :) Feel free to watch and share if it's useful to you too!

Designing A Better Infinite Scroll — Smashing Magazine In this series of articles, we highlight design patterns and techniques to design better interfaces. You can also find more examples in [“Smart Interface Design Patterns”](https://smart-interface-design-patterns.com/), a 6h-video course with 100s of hand-picked examples, curated by Vitaly.