Web Design
Let's talk about web design! Ask questions, share your work, and have fun!
@retrojoystick
My current frontend design stack consists of WordPress with Bricks Builder and Automatic.CSS, for quick design builds that can be wireframed on the fly. I've tried a few builders in the past, and this combination has ended up working pretty well for me.
What's everyone else working with?
0 reply
0 recast
0 reaction
@retrojoystick
anyone need a landing page or 20 hosted? hit me up for dirt cheap deals.
0 reply
0 recast
2 reactions
@retrojoystick
I think it's high time a spatial audio framework was put to use in accessible web design.
In a perfect world, haptic CSS, using a vibration api, would be a thing that @Apple doesn't block in Safari.
Anyway, here's a js audio framework that works, universally.
---
A=new AudioContext;
P=(f,x,o=A.createOscillator(),p=A.createStereoPanner(),g=A.createGain())=>{
o.connect(g).connect(p).connect(A.destination);
p.pan.value=x/innerWidth*2-1;
o.frequency.value=f;
g.gain.value=.1;
o.start();o.stop(A.currentTime+.2)}
onmouseover=e=>A.state=='running'&&(h=e.target.dataset.hz)&&P(h,e.clientX)
onclick=()=>A.resume()
---
frontend code example:
<!-- Just add data-hz="frequency" -->
<button data-hz="200">Left Bass</button>
<button data-hz="440">Center Mid</button>
<button data-hz="880">Right High</button>
Have fun!
0 reply
0 recast
0 reaction
@retrojoystick
If your components still live and die by viewport breakpoints, you’re falling behind.
Container queries are where it's at, regarding fluid responsiveness.
Get into it.
0 reply
0 recast
0 reaction
@retrojoystick
If you were tasked with a UI/UX redesign of https://www.berkshirehathaway.com/, how you make it better?
I'd add boobs everywhere.
0 reply
0 recast
0 reaction
@retrojoystick
This is a great write-up on native CSS physics, for anyone looking to add some razzle dazzle to their designs.
https://www.joshwcomeau.com/animation/linear-timing-function/?hl=en-US
0 reply
0 recast
1 reaction
@retrojoystick
I cannot stop building.
CutePages is something that some of y'all will find useful. If you're just getting into web design, or just want to build some quick landing pages or a site to use as a quick MVP, this tool is for you.
It's 100% free to use, and you can export each page as HTML, or zipped up in a package, ready to deploy.
https://cutepages.com/
1 reply
1 recast
1 reaction
@retrojoystick
How to build a WordPress-powered website, from start to finish, for beginners.
--
hunted @likesdotfun.eth, created by fronttobackdevelopment, powered by $likes
0 reply
0 recast
0 reaction
@retrojoystick
Who wants to dive head first into the world of building on WordPress with Web3 integration?
0 reply
0 recast
0 reaction
@retrojoystick
Here's a great article on the magic that is CSS, for everyone who wants to keep their code/framework as minimal as possible.
0 reply
0 recast
1 reaction
@retrojoystick
CSS custom properties are a great way to keep yourself organized when you're building out a website design. You can define pretty much anything you'd like, from colors, to weights, to borders, to border radii, to animations, etc. When you get to styling, you can reference these properties by using var(--custom-property) instead of constantly needing to type/paste your style code into your targets, which ends up creating a larger CSS file.
I'm sure that doesn't make much sense, so here's a great resource for anyone interested in learning how to define these variables.
https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_cascading_variables/Using_CSS_custom_properties
0 reply
0 recast
0 reaction
@retrojoystick
I didn't know what to do with this domain, so I put up a little mental wellness focused momentum builder on it. It uses local browser storage to keep track of progress, so it relies on the user using the same browser, and not clearing cached data.
If anyone has any ideas that would work great for this domain, I'm all ears, and open to irl contract-backed collabs.
Maybe it would work well as a cannabis focused UGC platform.
https://nug.gy/
0 reply
0 recast
0 reaction
@retrojoystick
So I'm a designer, but not a true coder. I do know intermediate front-end stuff, and can understand how backends work if I study what's going on.
That being said, I'm pretty proud to have vibe coded a WordPress plugin to what I would call completion, today.
It's the same plugin I was talking about in a previous post. I got tired of having to get out of my design environment to get clamp functions for my typography elements to be sized with, so I built a plugin that acts as a widget, and is accessible on both the admin dashboard and whatever frontend environment you're using.
I'll probably get it converted to a standalone at some point, but I don't want to get out of my comfort bubble, just yet.
Yay me. Here's the dashboard, and the modal UI itself.
Shout out to Gemini 2.5 Pro.
1 reply
0 recast
1 reaction