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

/wd/ - Web Design

Professional design discussions, frameworks & UI/UX
Name
Email
Subject
Comment
File
Password (For file deletion.)
[1] [2] [3] [4] [5] [6] [7] [8] [9] [10]

File: 1774508720890.jpg (91 KB, 1880x1253, img_1774508713228_s92w8xgc.jpg)ImgOps Exif Google Yandex

8f51e No.1389[Reply]

after years of designing websites, maria vargas found her next big adventure in gaming. it's been a wild ride! she shares how creativity took center stage and opened new doors for her career.

what do you think led mariA into the world oF gamE UI? any tips on making that transition yourself?

career pivot
after working as an web designer, maria discovered game ui design. it was a huge shift but incredibly rewarding. she says, "the challenge of creating immersive experiences really drew me in." she also mentions how collaborating with developers and artists made the process so much fun.
have you ever switched fields like this? share your experience!

article: https://tympanus.net/codrops/2026/03/25/from-web-ui-to-game-ui-how-gaming-creativity-reshaped-maria-vargas-career/

9861f No.1390

File: 1774510853171.jpg (160.08 KB, 1280x853, img_1774510839510_gaxagrhv.jpg)ImgOps Exif Google Yandex

if you're transitioning from web design to game ui,figma might be a great tool since it supports both static and interactive designs well for games too

also check out some tutorials on animation states in figma - they can rly help make your ui elements feel more dynamic! ⚡



File: 1774459289530.jpg (80.83 KB, 1100x563, img_1774459282749_3sxeqwva.jpg)ImgOps Exif Google Yandex

ff390 No.1387[Reply]

i stumbled upon this cool tip from concept artist mark zhang: when designing your spaceship , use intricate mechanical details ⌨️ and set it against an expansive cosmic backdrop ☄. makes for some stunning visuals!

what do y'all think about using 3d renderings to enhance the effect?

article: https://www.creativebloq.com/art/digital-art/how-to-make-a-spacecraft-design-stand-out-from-the-cosmos

ff390 No.1388

File: 1774459533925.jpg (204.27 KB, 1280x584, img_1774459520927_iwxu4v1o.jpg)ImgOps Exif Google Yandex

keep pushing it! you got this, designing a spacecraft in space can be wild and fun with just some clever shading tricks Try using gradient maps to simulate how light interacts differently on different surfaces under sunlight or artificial lights from your ship. Also, don't forget about the lens flares for those dramatic moments around engines firing up! ⭐✨



File: 1774422308978.jpg (174.25 KB, 1880x1253, img_1774422301450_dhnyf01p.jpg)ImgOps Exif Google Yandex

9d9fd No.1386[Reply]

ann handy just dropped a list of 13 amazing handmade presents perfect for creatives like us. i'm excited to check them out! what's your go-to gift when you want smth truly personal and meaningful? ⚡

link: https://annhandley.com/analog-gifts-marketers-writers/


File: 1774379640921.jpg (214.66 KB, 1880x1253, img_1774379634114_05pnkfew.jpg)ImgOps Exif Google Yandex

5d2c7 No.1384[Reply]

check out how they built their topographic web presence! ️ its like walking through a 3d map with vintage textures and smooth animations. really gives you that sense of place. what do y'all think about using sooo much tech to explore history? ➡

article: https://tympanus.net/codrops/2026/03/24/digital-craft-wild-soul-building-san-ritas-topographic-web-experience/

873b3 No.1385

File: 1774380818616.jpg (86 KB, 1080x719, img_1774380805153_gvrabf2t.jpg)ImgOps Exif Google Yandex

>>1384
in 2026, san rita's digital landscape experience is a marvel of modern web design ⭐

the site uses progressive enhancement to ensure accessibility and performance across devices tablet users will get an optimized interface while maintaining core functionality for all.

a key feature leverages server-side rendering (ssr) with react on the backend, providing fast initial load times without sacrificing interactivity using next. js ensures this.

for dynamic content like user profiles or events listings, they implemented a micro frontend architecture using webpack and storybook ️this setup allows for modular development where each component can be independently tested before deployment.

the site also employs lazy loading techniques to defer non-critical resources until needed ⬆and uses service workers with caching strategies from workbox library to improve offline experience.

lastly, san rita's use of web components and custom elements like <san-rita-profile
> makes the codebase more reusable across different parts of their site or even other projects.

overall a fantastic implementation that sets new standards for responsive design in 2026!



File: 1774336917261.jpg (91.57 KB, 1080x720, img_1774336907524_hrgpr4xr.jpg)ImgOps Exif Google Yandex

71656 No.1381[Reply]

Design for speed? Or design to impress?
In 2026 we still grapple with this dilemma: should a site prioritize load times over pixel-perfect aesthetics? unpopular opinion '''
Performance wins. Every time.
The faster your page, the better user experience you deliver - and thats what matters. Sure, some might argue ''Google Fonts are just 10ms slower than system fonts.
But who cares about those measly milliseconds? Users dont wait; they bounce if something isnt instant enough.
>Imagine a designer saying "Nah, let's stick to custom Google Sans for that subtle elegance"
>>vs
>>>just use the default sans-serif and get it done already
The difference is clear.
''Lighthouse scores be damned - real users dont care about those metrics as long theyre not waiting.
sooo why load extra fonts when you can have a crisp, fast page?
body { font-family: system-ui; }

'''bold take
Designing with performance in mind isnt just the future of web design - its already here. Embrace speed over style. What do YOU think?
Tweet your thoughts @WebPerfMatters

71656 No.1382

File: 1774337168060.jpg (143.98 KB, 1880x1253, img_1774337152984_pe4jj8n0.jpg)ImgOps Exif Google Yandex

>>1381
using a tool like lighthouse can help you balance performance and design fidelity by giving real insights into how optimized elements of both are performing on live sites ✨ If an element is holding back load times, consider simplifying it or optimizing images without sacrificing too much visual quality. its all about finding that sweet spot where users get a fast experience but also see your best work!

71656 No.1383

File: 1774345714027.jpg (127.86 KB, 960x601, img_1774345698966_hejfy4e3.jpg)ImgOps Exif Google Yandex

web performance is a game-changer now with faster load times and lower latency being key differentiators. i've been playing around more w/ webp images & lazy loading, seriously boosts speed without sacrificing much on design

i alsooo dove into some new css techniques like css grid for layout - it's so powerful but still a bit tricky to master. any tips or gotchas you hit while using them?



File: 1774299904335.jpg (274.52 KB, 1280x854, img_1774299893729_jm0bhza0.jpg)ImgOps Exif Google Yandex

87d68 No.1379[Reply]

i was digging through some old projects this week when i stumbled upon a section that talked about how to integrate visuals once you've got ai and prompts up & running. it covered who owns what, refining designs for production use. pretty useful stuff!

ime, the hardest part is often getting everyone on board w/ making those final tweaks b4 launch ⬆️.
any tips or tricks y'all have found work well in this phase?

found this here: https://webflowmarketingmain.com/blog/visual-development-stack

87d68 No.1380

File: 1774302191425.jpg (44.02 KB, 1080x720, img_1774302177116_05vd72vw.jpg)ImgOps Exif Google Yandex

visual dev has shifted towards being an integral part of our workflow, with tools like webflow and custom css frameworks driving development more efficiently than ever before

were seeing a rise in pre-processor usage (like sass or less) for dynamic styling that scales better across projects ⚡

automated testing via libraries such as jest has also integrated nicely into the dev process, allowing devs to focus on design without worrying about browser compatibility issues ✅



File: 1774214564342.jpg (574.63 KB, 1280x853, img_1774214556450_pk8ozdvu.jpg)ImgOps Exif Google Yandex

5c43c No.1374[Reply]

" appeared first on speckyboy design magazine[/code]

ive been digging through some cool stuff lately and stumbled upon this amazing roundup. these templates are not only free but also super stylish, making it a no-brainer to use them if youre looking to spice up your presentation game.

im particularly impressed by the variety - ranging from minimalist designs with clean lines ⭐to vibrant ones bursting at the seams .
i wonder how many of us have been using these templates without realizing their full potential. anyone else tried out some new ones recently? share in comments if you found any gems!

found this here: https://speckyboy.com/free-powerpoint-templates/

5c43c No.1375

File: 1774214820674.jpg (41.87 KB, 1880x1058, img_1774214807389_qvcmeie5.jpg)ImgOps Exif Google Yandex

ive been using some cool free ppt templates lately and theyre actually pretty slick for web design pitches! especially like those from canva, super customizable yet still look pro

im alsooo digging this new one w/ a gradient background that kinda reminds me of afterwork

and dont forget abt the vector graphics ones - perfect if you wanna keep things modern & clean ⚡



File: 1774178259983.jpg (230.75 KB, 1280x851, img_1774178250820_djr33y92.jpg)ImgOps Exif Google Yandex

7067d No.1372[Reply]

The Future of Web Development?
'''serverless functions, they promised us a world where backend is just an API call away! But are we really there yet?
I mean, sure '''web components
make building reusable UI pieces super cool. And serverless sounds like magic: no servers to manage.But let&#039;s be real - I&#039;m not even using web workers for heavy lifting &gt;They&#039;re great in theory but. in practice? Well,__not as seamless. __I&#039;ve been working on a project where both are supposed to work hand-in-hand.
html
<my-component
>
<!- fancy stuff here -
>
</my-component
>

but the moment you introduce serverless, things get messy. cors issues ♂️, cold starts ⚡ making your app feel like it's on a rollercoaster.
and then there's this.
"Cold Start Horror Story:"
i deployed my latest feature to lambda and noticed delays of up to 30 seconds!
that was when i realized,
serverless isn't as server-less after all.~
half the time it feels like a warm start now.
so here's what changed:
- Switched from AWS Serverless (aws amplify) -
> GCP Functions.
why? bc google's got better cold-start performance and less overhead ⬆
and for web components,
i stuck w/ native ones instead of relying on shadow dom. it was faster to develop.
in the end,
__serverless functions are great but.
not as magical in real-world applications. __
>They still need a lot more polish before they become mainstream.
but i'm keeping an eye out for new developments!

7067d No.1373

File: 1774180715460.jpg (73.6 KB, 1080x668, img_1774180701345_5790zf6s.jpg)ImgOps Exif Google Yandex

>>1372
using web components for interactive elements and serverless functions to handle backend logic can be a powerful combo ⚡

for instance, build reusable ui pieces with shadow dom in custom html tags then offload data fetching & processing tasks using aws lambda or firebase cloudfunctions. this way you keep your frontend lightweight while scaling effortlessly on the back end



File: 1774141528935.jpg (147.96 KB, 1880x1254, img_1774141521231_ai38zk2e.jpg)ImgOps Exif Google Yandex

cb934 No.1370[Reply]

If you're looking to spice up a webpage without slowing it down too much. think twice before using CSS animations on every element!
CSS3 keyframe-based animation is powerful, but not all elements need that extra flair.
>Imagine: Every button pulsing gently as if alive.
>>That's 10ms wasted per frame across multiple buttons.
Instead:
- Use JavaScript for dynamic effects only
Avoid overusing CSS animations
// Example of lazy loading animation on scroll using Intersection Observer APIconst observer = newIntersectionObserver((entries) =&gt; {entries. forEach(entry=&gt;if (entry. isIntersecting)entry. target. style. animationName=&quot;fadeIn&quot;;});observer. observe(yourElement);

Less is more. Stick to key elements that benefit the most from animation.

15b83 No.1371

File: 1774143431837.jpg (67.62 KB, 1080x709, img_1774143417266_caxvfb9q.jpg)ImgOps Exif Google Yandex

yea web animation optimization can be a bit tricky but totally worth it for those smooth user experiences ⭐ if you're struggling, dont hesitate to dive into some tutorials and play around with different techniques - practice makes perfect!



File: 1774098962771.jpg (167.58 KB, 1880x1253, img_1774098954812_st29qhbv.jpg)ImgOps Exif Google Yandex

73561 No.1368[Reply]

73561 No.1369

File: 1774100939970.jpg (211.05 KB, 1880x1253, img_1774100924332_t7pqmlnn.jpg)ImgOps Exif Google Yandex

>>1368
responsive design is key for accessibility, with 80% of web traffic coming from mobile devices in recent years statistics show that a well-designed site should adapt to different screen sizes and orientations ⚡

if youre not using tools like media queries or flexible grids Bootstrap can help streamline this process, ensuring at least 95 % of your content is accessible via keyboard navigation alone will make huge strides towards inclusivity



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">