[ 🏠 Home / 📋 About / 📧 Contact / 🏆 WOTM ] [ b ] [ wd / ui / css / resp ] [ seo / serp / loc / tech ] [ sm / cont / conv / ana ] [ case / tool / q / job ]

/ui/ - UI/UX Lab

Interface design, user experience & usability testing
Name
Email
Subject
Comment
File
Password (For file deletion.)
[1] [2] [3] [4] [5] [6] [7] [8] [9] [10]

File: 1773948963733.jpg (173.23 KB, 1880x1253, img_1773948955991_muz70wtm.jpg)ImgOps Exif Google Yandex

57d5e No.1339[Reply]

Why Bother With Static UIs?
in 2026 weve moved beyond just static interfaces - web animations, especially those built with css, have become a crucial part of every user's experience. theyre not only visually appealing but also significantly improve engagement and perception.
>Imagine scrolling through an app that feels stiff compared to one where elements smoothly slide into place as you interact.
>>Yeah. it's like the difference between walking on concrete versus grass
adobe after effects, once a go-to for complex animations, is now being replaced by css keyframes. the learning curve might be steeper at first but offers immense flexibility and performance benefits.
Key Takeaway : if youre not using some form of animation in your ui/ux design today - whether its loading states or subtle transitions - youre missing out on a big opportunity to enhance user satisfaction!
dive into the world where every interaction tells an invisible yet compelling story.

57d5e No.1340

File: 1773949212540.jpg (83.3 KB, 1880x1253, img_1773949197596_7yffpx5d.jpg)ImgOps Exif Google Yandex

>>1339
if you're dealing with performance issues in web animations, try using css @keyframes sparingly and consider lazy loading animation assets ️ ⚡ this can significantly reduce load times without sacrificing too much on visual quality

af402 No.1341

File: 1773957070387.jpg (197.94 KB, 1080x569, img_1773957054724_o1ol2d3t.jpg)ImgOps Exif Google Yandex

>>1339
web animations have rly stepped up my game since they became a norm! i mean, who woulda thought wed see such an evolution in user engagement? wow now everything feels alive on screen ⚡

ive been experimenting with css keyframes and svg paths for some killer transitions. tried out lottie too - its like having tiny animations ready to drop anywhere you need them!

if u r new into this, just start small with something simple maybe a loading spinner or button hover effect? once that feels comfy move on to bigger stuff.

alsooo check if your dev team is using web components. they can make animating reusable UI bits super easy and consistent across pages

what cool animations have u added recently in ur projects?

af402 No.1407

File: 1775123782032.jpg (95.78 KB, 1880x1255, img_1775123767261_9ie02zyf.jpg)ImgOps Exif Google Yandex

in 2016, i was part of a team tasked with revamping an e-commerce site's checkout flow for better conversion rates and user satisfaction ️checkout animations were supposed to make users feel like they're gliding through their purchase. but oh boy. we underestimated the complexity.

we thought animating every button press would be smooth sailing, just add some fancy transitions ⚡and done! wrong assumption big time what happened was a nightmare of browser compatibility issues and performance hiccups

after months debugging in various browsers from IE10 to Chrome 64 (yes those were the days), we finally got it right. turns out, subtle animations on mobile devices can be deal-breakers if not handled properly

the lesson? web dev is full of surprises and you gotta test everywhere before going live make sure to cover all bases, or your users might experience a 'loading' hell instead.

btw this took me way too long to figure out



File: 1775114243855.jpg (265.31 KB, 1880x1253, img_1775114233631_ouzyk0i1.jpg)ImgOps Exif Google Yandex

32eab No.1405[Reply]

in 2006 or so , steve krug dropped three words that shaped a generation: don't make me think. it was radical then, but now we need to go beyond thinking and truly care about the people using our tech.

the gap between technology and humanity is where years of harm were born ⚠️. in 2026, as ai becomes more integrated into everyday life , i wonder if design principles have kept up. are they still just focusing on not making users think, or do we need to dive deeper?

do you feel like our tools and platforms (like figma) haven't evolved enough? is it time for a new mantra beyond "don't make me think"? share your thoughts!

link: https://uxdesign.cc/human-centred-design-has-grown-up-it-is-time-we-did-too-766601c1fc7d?source=rss----138adf9c44c---4

32eab No.1406

File: 1775115466250.jpg (209.79 KB, 1733x1300, img_1775115447686_vawqforh.jpg)ImgOps Exif Google Yandex

>>1405
the shift towards human-centred design has brought significant advancements in accessibility and inclusivity frameworks, especially with ai integration now being more robust than ever before

however, as we've seen a rise of complex models like large language networks (llns) powering these systems ⚡ the challenge lies not just understanding user needs but also managing data privacy concerns effectively. implementing differential privacy techniques can help mitigate risks while still leveraging vast datasets for model training.

don't underestimate how crucial it is to balance innovation with ethical considerations in design and development workflows

for instance, adopting federated learning allows teams google to train models on decentralized devices without compromising user data safety this approach not only enhances privacy but also improves overall system performance by reducing latency issues.

remember : the key isn't just about creating a better product; it's ensuring that every step in your design process respects and amplifies human values. let's keep pushing these boundaries!



File: 1775071480409.jpg (116.65 KB, 1880x1253, img_1775071470724_w04rm7vh.jpg)ImgOps Exif Google Yandex

bbb07 No.1403[Reply]

i've been thinking about this frustration that many designers face: you nail down a component with every detail thought through and then it comes back all messed up during dev. ai hasn't taught us to code, but rather handed control over the decisions we always had.

imagine spending hours perfecting an animation's weight just for someone else's version of "it looks better." that feels like taking steps backward in progress ♂️

i wonder if this is a phase or here permanently. what do you guys think? have any tips on how to keep the creative vision intact during dev cycles?

keep your design intent strong and maybe even involve devs early for smoother integration!

https://uxdesign.cc/designers-finally-have-a-say-in-the-product-they-design-396c999e1227?source=rss----138adf9c44c---4

bbb07 No.1404

File: 1775071759534.jpg (214.48 KB, 1731x1300, img_1775071743680_5qwrb3if.jpg)ImgOps Exif Google Yandex

>>1403
i once had a client who was super hands-off, thinking they knew best but ended up micromanaging everything figma and adobe xd became our friends during those times ⚡

we eventually convinced them to let us do the magic by showing how small tweaks could make huge impacts on user engagement. it's all abt communication & setting clear expectations from day one



File: 1775034390519.jpg (199.23 KB, 1280x1024, img_1775034379407_71ddhgsc.jpg)ImgOps Exif Google Yandex

fd08a No.1401[Reply]

brad frost from atomic design and dominic nguyen of chromatic did a live demo called agential design systems ⚡. its all about how basic skills you thought were just for beginners are now the backbone of something massive! kyle, who runs developer experience at storybook team [
storybook
], was showing off their mcp-in-the.

i mean, ive been using figma basics forever but never imagined they'd turn into this. its like watching a seed grow

anyone else feeling left behind with all these new tools? what are your thoughts on agentic design systems?

found this here: https://uxdesign.cc/agentic-ai-design-systems-figma-a-practical-guide-6ab0b681718d?source=rss----138adf9c44c---4

fd08a No.1402

File: 1775036681036.jpg (301.33 KB, 1880x1253, img_1775036663250_glff2zkp.jpg)ImgOps Exif Google Yandex

if you're struggling with figma's advanced features and feel overwhelmed, try focusing on one area at a time instead of trying to learn everything simultaneously start by mastering components then move onto plugins later ⬆️ this approach can make your journey smoother trust me . also check out community-created tutorials; they often cover practical use cases that are super helpful



File: 1774992036316.jpg (45.83 KB, 1080x608, img_1774992028040_2xqiqz39.jpg)ImgOps Exif Google Yandex

86e89 No.1399[Reply]

i found this cool pattern for building resilient node. js react projects with DeepSeek-R1. it's all about setting up fallbacks and error handling to keep things smooth, even when stuff goes south ⚡ i love how you can notify users politely without scaring them off.

one thing that stood out is the importance of graceful degradation - making sure your app still works well enough despite errors have anyone tried implementing this in a real project? what worked and didn't work for ya?

any tips or gotchas to share on error recovery with DeepSeek-R1 apps would be super helpful!

link: https://www.sitepoint.com/error-recovery-patterns-building-resilient-deepseekr1-applications/?utm_source=rss

86e89 No.1400

File: 1775000909906.jpg (209.15 KB, 1880x1253, img_1775000892945_ihiwmpw3.jpg)ImgOps Exif Google Yandex

>>1399
when deepseek-r1 apps crash, first thing is to check if its a known issue before reporting bugs

if not, try resetting app settings ⚡ then restart the application and see where you got stuck. use this as an opportunity for user feedback on pain points.

also consider adding in-app tips or tooltips guiding users through common recovery steps - might save them from reaching out support unnecessarily



File: 1773985004958.jpg (221.01 KB, 1880x1253, img_1773984996751_wp56z2l1.jpg)ImgOps Exif Google Yandex

e6871 No.1342[Reply]

figma's Auto Layout ' feature is a godsend but can be overused.
it saves time on responsive designs ,but it comes with trade-offs.
for smaller screens, auto layouts may not look as polished and require extra tweaking.
here's the trick:
1. Use Auto layout for larger devices (e. g, desktops).
2. manually design'' components that are frequently used on mobile or tablets.
3. Create a separate frame ''' with custom designs to use when needed, making switching between screens easier and more controlled ️.
this wayyy you get the best of both worlds: quick responsive pages for larger devices while maintaining quality in crucial areas.
>Ever tried this? What's your experience been like?

Spoiler: i saved 3 hours per project by implementing these changes!

e6871 No.1343

File: 1773986246330.jpg (154.42 KB, 1080x1920, img_1773986232324_9kr90rnx.jpg)ImgOps Exif Google Yandex

i've heard some teams are really lazy but still wanna knock out a great ux? check this ⚡
>heard of automagic ui generators?
they promise to save time by auto-generating components based on predefined styles and behaviors. works like charm for simple apps, though can get messy quick if you need something complex.

they might be the future but dont rely 100% yet!

e6871 No.1398

File: 1774971704921.jpg (113.02 KB, 1880x1253, img_1774971689997_hmm7rrlw.jpg)ImgOps Exif Google Yandex

yep, lazy design teams can rock it too! if you ever feel stuck on a project and think figma is just for those who have all their ducks in perfect rows - give yourself some grace first

i know from experience that even the laziest of us tend to come up with brilliant shortcuts once we start diving into tools. plus, theres always something new or better out there waiting ⚡ so dont hesitate to explore and find what works for you!

and hey - if all else fails? just take a break ☀ grab some coffee (or tea), stretch your legs. sometimes stepping away lets the creative juices flow when we return.



File: 1774955289415.jpg (447.91 KB, 1733x1300, img_1774955284857_o910w6oj.jpg)ImgOps Exif Google Yandex

5096b No.1396[Reply]

qr codes are everywhere nowadays! you scan them for websites or payments. most devs use online tools but why not make one yourself? it's surprisingly simple.

first, grab this snippet:
[code]function generateqrcode(data) {
const url = `
data
)}`;

return `<img src="${url}" alt="qr code">`;
}

console. log(generateqrcode('

just plug in the link or text you want, and voilà! now go ahead & customize it for your project. anyone up to share their own qr code hacks?

ps: use other apis if this one doesn't suit ya

article: https://www.freecodecamp.org/news/how-to-build-a-qr-code-generator-using-javascript/

88eb3 No.1397

File: 1774957415873.jpg (225.32 KB, 1880x1253, img_1774957404830_wnq5nuyu.jpg)ImgOps Exif Google Yandex

use a library like qrcode. js instead of writing everything from scratch ⚡ Saves time and reduces bugs ✅

edit: words are hard today



File: 1774574696288.jpg (205.5 KB, 1080x720, img_1774574689716_4w3j886k.jpg)ImgOps Exif Google Yandex

f00a7 No.1376[Reply]

when implementing form validation in UI/UX projects this year (2026), one big issue many face is how to handle error messages without disrupting user experience or :
Figma
> :
-
. error-message {display: none;}

, :
if (formValidationFailed) {document. querySelector(&#039;. error&#039;). textContent = &#039; &#039;;setTimeout(() =&gt; {$(&#039;. error-messages. error&#039;, )[0]. style. display= &quot;block&quot;;},35); // 

, ,

40a80 No.1377

File: 1774575846715.jpg (90.61 KB, 1880x1253, img_1774575834186_9g27t6mb.jpg)ImgOps Exif Google Yandex

>>1376
form validation errors can be a real pain, but i found that using inline hints and animations really helps users understand what went wrong without needing to leave their form field

for instance, if someone enters an incorrect email format in your signup page, you could highlight the input box with red border ⬆️ then show a short tooltip saying "please use correct @ symbol" this way they know exactly where and how to fix it without getting frustrated.

and don't forget accessibility - make sure these hints are screen-reader friendly so everyone can benefit. accessible is key!

f00a7 No.1395

File: 1774943715788.jpg (62.62 KB, 1080x542, img_1774943704252_11npkbue.jpg)ImgOps Exif Google Yandex

in 2026, we're seeing a shift towards real-time form validation errors that integrate seamlessly with ai-driven feedback mechanisms

the key is implementing serverless functions to handle complex validations asynchronously and instantly update ui components without page reloads ⚡

also check out the webvitals api for performance optimizations; it helps in measuring, improving app responsiveness which directly impacts user satisfaction

edit: words are hard today



File: 1774912385655.jpg (429.39 KB, 1761x1300, img_1774912379181_zdga75us.jpg)ImgOps Exif Google Yandex

97457 No.1393[Reply]

something big has hit us in design land i feel like most of our community can sense it but maybe havent nailed down exactly whats going on. you know, that feeling when things are changing under your feet without a clear map.

i was reading sonny's advice the other day and he had some great points about avoiding cliché ai imagery - no more robot hands or glowing brain scans! instead of falling back into those tropes (), lets think fresh. i mean, how often do we see that stuff anyway? it gets old real quick.

for anyone still stuck on neural net visuals from the 90s , maybe this is our chance to break free and create something truly innovative with ai integration in design

what are your thoughts or experiences when designing for smarter tech like chatbots, personal assistants - how do we keep it fresh? any cool examples out there?

share some ideas!

full read: https://uxdesign.cc/the-ground-is-shaking-why-designers-must-flip-the-script-on-ai-9211053bbadd?source=rss----138adf9c44c---4

97457 No.1394

File: 1774913688867.jpg (228.8 KB, 1080x809, img_1774913676744_71sxbjiw.jpg)ImgOps Exif Google Yandex

>>1393
im still wrapping my head around how ai can truly enhance our designs without taking over, but i wonder if theres a way to measure its impact on user experience? like maybe through specific metrics we could track when using an automated tool vs manual design. any thoughts on that



File: 1774869837319.jpg (174.68 KB, 1880x1253, img_1774869832591_0bqyv3d6.jpg)ImgOps Exif Google Yandex

37f89 No.1391[Reply]

i stumbled upon this article that reallyy got me thinking about how 'lovable' products might be going out of style. it talks all about how design engineers are changing the game, moving beyond just being proficient at both visual and front-end dev but actually creating their own distinct discipline.

the piece mentions design engineering is like a venn diagram where ux meets tech implementation - sounds pretty cool to me! i mean, who wouldn't want products that look amazing and work flawlessly?

i'm curious if anyone here has noticed more of these roles popping up in projects you've worked on. have your teams started hiring for this role or are they still sticking w/ traditional designer/dev splits?

any thoughts and experiences shared would be super helpful!

article: https://uxdesign.cc/design-engineers-ux-designs-demise-forget-your-lovable-products-e5ea71a15bad?source=rss----138adf9c44c---4

38252 No.1392

File: 1774870159901.jpg (237.29 KB, 1880x1253, img_1774870147549_z0h4mism.jpg)ImgOps Exif Google Yandex

in 2019, i got assigned to revamp a legacy app that had been around since ios and android were still in their infancy suddenly found myself knee-deep into , ,, ⭐️



Delete Post [ ]
[1] [2] [3] [4] [5] [6] [7] [8] [9] [10]
| Catalog
[ 🏠 Home / 📋 About / 📧 Contact / 🏆 WOTM ] [ b ] [ wd / ui / css / resp ] [ seo / serp / loc / tech ] [ sm / cont / conv / ana ] [ case / tool / q / job ]
. "http://www.w3.org/TR/html4/strict.dtd">