Does anyone have a web design inspiration site that's focused on sites that just look good and have a good UI & UX instead of collecting the most out there canvas animation thingies? Those might look good, but I can't get inspired by something that I can't replicate without a team of multidisciplinary people doing 3D design, WebGL, etc.
I used to have a number of good ones added to my RSS reader, but they have slowly cease to update. I could google for inspiration sites like that, but I know google will only give me listicle SEO spam.
What happened with the "above the fold" rule, that we put important info where the user don't need to scroll.
I clicked through some of them and I only see huge titles with parallax.
In e-commerce space you might take a look at: https://theheadlessclub.com/. It's exactly what you're looking for. Quote from about page:
"Most directories tend to put emphasis on shiny and showy hyper-animated web experiments. Unfortunately, many of these projects fail when criteria like performance, mobile, usability, and accessibility are considered. It’s hard to find one single resource on the internet that would combine both the technological excellence and highly polished design in ecommerce space. The Headless Club started as an internal agency tool to foster ecommerce best-practices across our development team. Now we’re sharing our findings with you."
Disclaimer: I'm the co-author (with folks from commerce-ui.com agency). We'll soon make it not specific to headless but to all e-commerce stores.
Headless means that you're using e-commerce platform only via API and build your front-end in whatever tech you want (next, nuxt, Remix, etc). It's different from a traditional approach when e-commerce platform handles front-end (HTML templates rendering). In Shopify can do both.
Funny that headless is now considered "traditional," when that was considered standard for a decade and a half. Relying on the platform was considered amateur.
"Traditional" is just another way to say "what was once the norm", so your comment is a bit pleonastic.
Is relying on the platform no longer considered amateur? If yes, call me old fashioned, because I've never liked those platforms...
Those might look good, but I can't get inspired by something that I can't replicate without a team of multidisciplinary people doing 3D design, WebGL, etc.
I'm with you. 98% of these lists are worthless for inspiration because they're mostly at student portfolio pieces or mock ups.
Show me some good accessible, fast, commercial designs that I can be inspired by and learn from, not some design agency's 3D spinning radishes blocking the text.
Bonus points if they manage to work in display advertising in a tasteful way.
I have a similar gripe that many of these design inspiration websites that I'm trying to use to inform all kinds of design objectives. They seem to be singularly focused on landing pages, but there are great ideas and implementations out there to full applications design. I wish we could find more inspiration for Interactions, user flows, how to show a lot of information in one viewport without overwhelming the user, and so on.
While not exactly what you asked for and instead a single article containing a collection of advice, albeit concretely illustrated in an arguably useful fashion, I can attest at least that I've found this one useful:
Quick aside, these are all marketing sites, so if you're looking for application UX/UI inspiration (which I was) this is not the thing.
A good number of these are aimed at developers, meaning I'm in their target market. So I'm going to state my opinion, knowing full well that these tactics are super prevalent which means presumably they work and I may well be an outlier. But I hope I'm not... ...so with that hope in mind...
If you want to market to me (Us?) - don't build this shit. Seriously, just don't. If I'm your target market, this isn't actually good web design.
Yeah, it's eye catchy, but you're making me dig for what I want to know: Does this actually solve my problem? The more marketing flash you put on top of that, the more I experience a sneaking suspicion that you're all style and no substance.
If you want to sell to me, use good clean UX that is pleasantly styled, but not flashy. And get to the point. Show me exactly what I need to know as fast as humanly possible, with a minimum of distraction and cognitive load. Show me your features. Show me your UX. Don't use graphical representations of your UX, show me the real thing. Screenshots of actual use cases. Show me how you handle the use cases that matter to me, your prospective user.
The more you hide your actual product, and try to distract me with fancy flash, the less likely I am to open up a conversation. I don't have time for this shit when I'm shopping for dev tooling. Make it as easy as humanly possible for me to determine whether you solve my problem in the way I need as quickly as humanly possible.
Maybe I'm an exception, but personally I think good web design is a design that communicates quickly, clearly, and cleanly while minimizing cognitive load.
These are not that. Many of them are expressly the opposite of that.
Edit: For those of you saying that sales are targeting managers not devs... uh... well... uh... I spent the last 5 years as DevOps/SRE Manager/Director so... uh... some of us keep our dev sensibilities I guess?
There are dozens of us (Arrested Development reference)!
Seriously though I think we are pretty rare for wanting to cut through the BS. I've talked with a lot of people about this and while many will agree with me, when they actually see the results they don't like it as much as the flashy. It's disheartening.
Nah, the reality is that most developer tools are B2C in disguise (with B2B pricing), and that in fact these polished marketing sites are perfect for the junior developers and PMs at large orgs who actually adopt free trials of things.
From your parent:
> Does this actually solve my problem? The more marketing flash you put on top of that, the more I experience a sneaking suspicion that you're all style and no substance.
This kind of person doesn't pay for stuff or asks too many questions. "CTOs" are the worst customers. They are always nickel and diming, willing to go through immense grief to "just" "use" "open source" and squeeze free from everywhere. This isn't bad, it's aligned with successful businesses. I'm saying that the people who pay for stuff are lazy, too, in a good way.
So much motion going on with these sites... I actually find most of these to pretty bad, just flashy. Great websites are fast, clean, organized, give me what I want with minimal fuss and look great at the same time.
I think these sites look very attractive, but this is a very subjective and specific definition of "good". Many of these pages do not finish loading in 3 seconds, for example. I'm not sure it would be correct to frame these as "astronomically good" web design.
The vibe I'm getting is "glossy magazine"… though given I've not actually touched a glossy magazine outside of a waiting room in about a decade, it's entirely possible I'm out of date.
That’s what I’m noticing as well. The content loads, then the content slightly changes once the styling loads and then the additional large sized content loads and then the animations load. So you’re trying to explore the website while everything is constantly resizing, populating along with animations playing all over the place. Also, there is a lot of scroll bar control being taken over. It just feels so limiting to the user to scroll, which I don’t particularly enjoy about modern web design trends. I understand that animations and scroll bar triggered events are great for product release pages, but I just don’t think they’re palpable on a home page.
I may be an old millennial, but wow I do not like the giant text and frivolous animations everywhere. It's like we're designing bill boards nowadays as standard for the web. Might as well bring back marquee tags and those silly 90s website GIFs.
RIP Flash-only Web sites, you were just born too early, we had to wait for CSS3 and unsecured AWS buckets to match your stunning beauty and butt-clenching security flaws.
Ol' Gen-Xer here - Oh, we do remember Flash only sites... I remember having to build one or maybe two of them even, of course after trying ultimately in vain to explain to the client just how bad an idea it was. Though this was still in the times before the security issues, before the Adobe years.
Hot take :
This is so "too much design" that we cannot even perceive content through it. It feels like "astronomically good" web design is about 72pt centered Helvetica and lazy-loading type of animations showing colorful picture and throwing some catch-phrases there and there.
I'll start: many of these are catchy, and even well executed. Many of them perform very poorly on my Linux VM running on a modest Windows host (VM ~6 GB RAM, 2x CPU, i7, no GPU).
That said, godly.website loaded very quickly and seemed to perform well.
I think there is barely room to hate this type of website. It knows what it is.
Another comment described it as a “glossy magazine” vibe, which seems perfectly apt. Lots of us bemoan the fact that the internet isn’t a textbook or newspaper anymore. It is annoying when, like, NYT or something like that goes in a silly direction, but we’re not out here complaining that Mad Magazine and the backs of cereal boxes aren’t functional.
You know what's astronomically bad? The website that tricks you into clicking on it by presenting newsletter subscription popup and then starting to load all animated videos at once.
I find godly.website a helpful resource, but I also agree too many of these are design studios and are of no interest to me. Even if you set the filter to web UI, it tends to showcase the sales page and not the UI.
Lots of crypto/NFT stuff which matches the maximum-hype aesthetic that is being selected for here. I suppose I wouldn't expect anything else from "Godly – Astronomically good web design inspiration" hosted at godly.website
The only conclusion I can draw is that "astronomically good web design" primarily concerns itself with ensuring that no more than eight words can appear onscreen simultaneously.
I feel like, more often than not, people's picks for "great design" are really just a massive image and some fancy type around it
Sadly I have neither the photography skills, nor the type licenses, nor the actual need for a massive hero image in 99 out of 100 projects, so thanks but no thanks.
I'll keep digging and banging my head against the screen.
This list is possibly as useful as asking Midjourney for inspiration, except half as fun
Given how popular they are, these modern designs must appeal to someone, but personally I find them really bad. It's pure form over function with the huge text that reduces my 24" monitor to the information density of a phone and the annoying fade-ins that interfere with quickly skimming the page. This kind of webpage makes me immediately suspicious. I find these landing pages much better: <https://hypothesis.readthedocs.io/en/latest/>, <https://cmocka.org/>, <https://pytorch.org/>.
https://cmocka.org is quite the collection of contrast errors and botched accessibility properties in only one page. https://pytorch.org is not much better. Neither form nor function in my personal opinion...
If I am going to be swayed that Obys' Grids[0] is bad, you better be comparing it to W3.org[1][2][3] or something..................................................
> contrast errors and botched accessibility properties
Yeah, the white on yellow could be improved, but the page is pretty good in ways I care about most: it loads quickly, it has decent information density, it gives me all the information and links I want right on the landing page, and it doesn't use anything that would interfere with skimming, such as lazily loaded images or animations.
Right there with you. Their focus is on smoke and mirrors, not putting content first. If the first thing I have to do to get to the content is move your interface or big pictures out of the way, you're doing it wrong.
Your argument (and GPs) is valid but it doesn't really belong here, as this is a "design inspiration" gallery, as opposed to a "content inspiration" or "accessibility" blog or whatever you misunderstood this to be.
I got exactly what I expected to see when I clicked on the linked website.
Good web design != good marketing design. Once marketers got control of UI design, every web interface became an interactive motion graphic, which is NOT. GOOD. UI. DESIGN.
I appreciate design that stretches boundaries. But, assembled all together, most of these felt the same. I got numb. A big sans-serif claim, gradient-colored text, sometimes a big 3-D toy to fumble about with since there is no other content on the page. The really edgy designs disrupted their own typography with scrolling elements. Cool, but... what's the point?
Robert Bringhurst once said "Design exists to honor content." That may be too conservative, as there is a place for design for its own sake. But few of these sites had anything to say other than "look at me!"
I agree with basically everything said here in the comments but wanted to add... after a certain amount of time a modal window popped up telling me to enter my email address to join their newsletter. It had no X button indicated anywhere. I thought I was trapped until I just tried clicking off of it.
While I like that functionality being available, an X to indicate that the thing is not required feels pretty necessary to me. I almost just closed the site when I thought it was required.
A big proportion of visitors will never see these sites at their astronomical best, as they will visit it with their phone.
Sites with animations and crazy stuff happening on desktop, but then show a small subset of that design on mobile are like ad campaigns made for Cannes: fun for the industry, but misses the mark in terms of market value.
It's sad to see how many of these projects are web3/crypto/nft related. I suppose the plus side here is that some devs/designers were able to (hopefully) make a decent paycheck making interesting work before the bubble(s) burst.
This stuff reminds me of the days when it was trendy to put a swingy ball that follows the cursor. It’s technically cool (as in “hmm how did they do that?”) but it adds little to the experience aside from concentrated cringe.
I absolutely do not want animations that emerge when scrolling down a page. Im scrolling because I want a linear view of things, and the silly animations take away my control of the experience.
All of these designs are horrible. They're not good, they're clever. These are interactive experiences, not websites. But that's all you can and should expect from marketing pages nowadays.
A good web design prioritises UX and accessibility, not first impressions for the sake of sales. Let your sales team take care of the first impressions, and focus on building a usable site instead of a clever one.
I really miss the old css zen garden style websites. It was such a rush to have your site featured on one of those. At one point my bud and I were going to revive cssthesis.com but were kinda swamped with startup life at the time and couldn't make the time for it.
I intensely dislike websites that use this style. All style, and no content. It takes you 3 minutes to get to the bottom of the page; and once you do, you realize that you have about five-sentences-worth of actual information.
That being said....
The New York Time is regularly running mixedia long-form journalism that intersperses scroll-bar-driven media with text. I'm not sure how much. Maybe one or two articles a week. The mixed media can be quite elaborate: animated graphs, video, diagrams with incremental annotation. I'm not entirely sold. But I can't help admiring what they're trying to do anyway. My read: that they are consciously trying to create a new vocabulary for presenting text-based information on the web.
The general style is as follows: four or five paragraphs of text, and as you scroll down, you encounter islands of animated media that are driven by scrolling. An example: a series of pictures, with annotations that appear sequentially explaining what your seeing. Or a graph, again with sequentially appearing graphs and annotations.
Some articles are more successful than others; but I will grudgingly admit that most of the animation sequences are worth about 1400 words.
Compare that to the web mockups on that page, where an entire website is worth about 36 words.
Probably an unpopular opinion, but honestly I wish MVC-type development was still popular. I'm working on a side project that doesn't need any of this animation or partial page reloads/rerendering, and I'm using .NET 6 MVC. Development is so much faster.
All of these websites look like cancer to use. HN is peak web design. It gives exactly as much information as I need and has zero fluff, plus it loads super fast.
> It gives exactly as much information as I need and has zero fluff, plus it loads super fast
All new sites I load by default in Firefox with NoScript active. If it's blank or useless, I move on.
The side effect is that an awful lot of sites load really fast and I rarely have to put up with the "we care about your privacy (while hoping to sell you out under the guise of legitimate interest)" cookie pop-up BS...
I used to have a number of good ones added to my RSS reader, but they have slowly cease to update. I could google for inspiration sites like that, but I know google will only give me listicle SEO spam.