[HN Gopher] You can create a great looking website while sucking...
___________________________________________________________________
You can create a great looking website while sucking at design
Author : nearfal08
Score : 177 points
Date : 2022-05-14 16:24 UTC (6 hours ago)
(HTM) web link (thefullstackdev.net)
(TXT) w3m dump (thefullstackdev.net)
| egypturnash wrote:
| I like how several of the examples really rely on _art_ to create
| interest, and possibly as the source for their color palettes as
| well, and yet there is no discussion of this. No discussion of
| where to find stock art, no discussion of where to find someone
| to do custom art, no discussion of the pros and cons of stock vs
| custom art.
| strongbond wrote:
| You know, the first justifying reason for choosing Tailwind "It
| uses classes that are abstractions of CSS properties" just might
| not jive too well with someone who doesn't know all this stuff in
| the first place.
| treerunner wrote:
| This article is a recipe for ensuring you look just like
| thousands of other websites out there.
| hello_newman wrote:
| As a primarily backend dev, one thing that has recently helped me
| with my design skills is to use page builders.
|
| I've found that they've gotten really good over the last few
| years and the code they generate is actually pretty solid. I'm
| the kind of person where I think I can tell what good design is,
| but I can't actually design it from scratch myself.
|
| I recently bought a subscription to https://shuffle.dev/ which
| has a page builder for tailwind, bootstrap, material, and bulma
| and it's saved me a lot of time and generated some really slick
| looking sites.
|
| A $20 subscription is definitely a lot cheaper than a designer
| and is faster than waiting for a design and then building it
| yourself. I'm not affiliated with them in anyway, but would
| highly recommend it as a part of your workflow.
| squidbeak wrote:
| This lost me at 'Tailwind' which has nothing to do with design.
| MitPitt wrote:
| What does it do besides design?
| bpicolo wrote:
| Ymmv but I've found that using tailwind has helped my side
| project design story a lot. It has me thinking a bit more
| outside of the components box and makes it super easy to do
| subtle adjustment.
| Julesman wrote:
| Results may vary. Greatly.
| meristem wrote:
| Who is the user? Who is the site for? How does the design relate
| to the user and to the problem to be solved?
| sidedishes wrote:
| I'd initially misread this, thinking it was an article on how a
| lot of websites that look pretty can be surprisingly horribly
| unusable.
| Brajeshwar wrote:
| My personal confession is that I'm not a designer but I used to
| design a lot a decade+ ago. My friends, colleagues, and clients
| says I design really good websites. My trick was to follow
| patterns, sequences, and formulas.
|
| I once, met an old colleague after 10 years, and told me they are
| still maintaining a website I designed for clinics and had made
| minimal design changes in that span of 10+ years.
|
| I believe a thoughtful design is more about common sense.
| doliveira wrote:
| I think Portuguese and French have a better expression for
| this: "good", not "common" sense. I'm mentioning it because
| this sense for design is not that common. You may not be
| formally trained, but you're a designer.
| wwilim wrote:
| Yer a wizard, Harry
| yakshaving_jgt wrote:
| Article says "keep it simple" and then immediately features a
| professional illustration.
| Barrin92 wrote:
| Rich Hickey when talking about Clojure language design used to
| point out that 'simple' is not the same as 'easy'. In fact
| making something simple requires a lot of hard work. That's one
| of the reasons why you should use professional tools if
| possible. Because if they're good tools the people who made
| them have put a lot of effort already into making them simple
| in the first place.
| diordiderot wrote:
| Link to talk
|
| https://youtu.be/LKtk3HCgTa8
| s1k3s wrote:
| As a backend dev, I made myself an expert at Tailwind
| specifically for this issue. I admit, using Tailwind out of the
| box simply creates decent interfaces. However, I disagree with
| the article: I don't think I'm ever going to be able to design
| something great, simply because I don't have the skills for that.
| I just don't think any library / tool or whatever can make you a
| skilled designer.
| karaterobot wrote:
| Definitely. This is because design is an overloaded term.
| Creating a great looking website is a kind of design, in the same
| sense that interior decoration is a kind of design. But there's
| another kind of design which is more about solving problems or
| achieving some result given a set of requirements and
| constraints. This is the sense in which design is about "how it
| works" and not "what it looks like".
|
| Both are valid and useful, I just wish that there was a richer
| taxonomy to describe such different activities.
|
| In the same way that telling someone you're a programmer can lead
| to them asking you to fix their printer, telling someone you're a
| designer can easily lead to them asking you to pick paint colors,
| or make a logo for their school newsletter. From the outside,
| these seem like overlapping activities, but they are often
| unrelated.
| gregmac wrote:
| There are a lot of themes and CSS frameworks that make this so
| much easier than it used to be, but there's still a specialized
| skill around design. Developers that fail to understand this are
| doomed to build, at best, mediocre design.
|
| Early in my career I built a couple sites/applications that I
| thought were pretty decent -- after all, I "knew" HTML and CSS
| and how to use Photoshop, etc. Then we had an actual graphic
| designer come in, do some relatively small tweaks -- spacing,
| sizing, borders/gradients/corners, etc type of thing -- and it
| was a radical improvement. After a couple times of that happening
| I learned I just don't have that skill.
|
| If you're a programmer, think of this like the difference between
| "working code" and "working, elegant code". It's hard to get a jr
| developer to really understand the differences, because often the
| benefits aren't seen until you come back to the code months later
| to add something new. I'd consider code to be "elegant" when
| someone can rapidly understand it, and then easily modify it
| without breaking anything, and then do that _again_ in another
| few months. The extreme opposite would be where it gets to
| "throw it out and start from scratch".
| chiefalchemist wrote:
| No offence to the process and tools (e.g., Tailwind) but
| Bootstrap solved this sometime ago. The gist of the idea begin:
| Follow our lead, stay within the guardrails and you won't muck it
| up.
|
| Of course there's room for others doing the same. But Bootstrap
| did have an element of being a "design tool" for design-blind
| engineers.
| hedora wrote:
| Is this page broken in mobile firefox, or is one of the implicit
| tips that the actual page content (in this case, bullet lists)
| should be no more than 1/20th the size of section headers?
|
| I find the big chunky headlines distractingly bold and over word
| wrapped (with at most three words per line), but the li elements'
| characters are single digit pixels high on my retina-class high
| DPI phone display.
| Vladimof wrote:
| > I find the big chunky headlines distractingly bold
|
| I tend to scroll down and not read when I see these type of
| items... but either way, it's the same way on desktop so I
| think it is intentional
| jfk13 wrote:
| The greatest design can be undermined by careless content. Spell-
| check. Proofread. If writing isn't your strength, get a competent
| editor and proof-reader to help.
|
| A big, bold title with a grammatical error such as "create a
| great looking websites"[1] does not create a good impression.
|
| [1] Is this supposed to be singular or plural?
| z3t4 wrote:
| The most important skill is to know if something is good or bad.
| So its about having good taste. The rest you can learn by
| training. Do copy the best designs until you can make your own
| from scratch.
| seanwilson wrote:
| My tips:
|
| - Design is a skill you can learn but you need to put at least a
| few days or weeks into it to make some progress. A lot of people
| who say they can't design have barely spent a few hours working
| on their own designs or following tutorials. For example, I don't
| think anybody would say "I'm not good at Java" without trying to
| learn it first but people do this with design all the time
| without giving themselves a fair chance to try.
|
| - Don't design and code at the same time. You'll waste time and
| burn yourself out getting lost in CSS rabbit holes, trying to
| make the code look pretty etc. and then when you get it working
| it and you step back to look at it, you realise the design
| doesn't work and it needs more iterations. Design a mockup first
| in something like Figma or InVision and only start coding when
| the design is ready. You can iterate on the design an order of
| magnitude faster this way because you can just drag/drop things
| around instead of fighting with how to align and style things in
| CSS.
|
| Generally once I have an initial rough design drawn in a design
| tool, I duplicate the whole thing, tweak it (like changing the
| colors, sizes, fonts), duplicate that, tweak it etc. to explore
| and combine lots of different design ideas until I happen upon
| some combination I like. It's hard to replicate this process and
| avoid tunnel vision when you're designing in an IDE instead.
| dceddia wrote:
| And on the subject of learning the skill through practice,
| probably the most effective thing I've tried has been "copy
| work", something I learned about in an article[0] by Erik
| Kennedy a few years back. Basically: reproduce existing good
| designs, pixel-for-pixel.
|
| It's like the 80/20 of design practice. It's amazing the kinds
| of small details you start to notice when you try to faithfully
| copy a design.
|
| 0: https://www.smashingmagazine.com/2017/02/improving-ui-
| design...
| DeathArrow wrote:
| Yep, copy but don't look at the source. Make it look 100% the
| same but do it yourself.
| dsincl12 wrote:
| Completely agree. I spent a lot of time when learning design,
| "designing" writing code since I was a developer first. That
| was a lot of time wasted but it took effort and will to learn
| all the design tools and understand the process for sure, but
| it was definitely worth it.
| stickfigure wrote:
| > Design a mockup first in something like Figma or InVision and
| only start coding when the design is ready.
|
| I do this the opposite way. Just get the data crudely on the
| page and figure out the information architecture first. Then
| figure out how to make it attractive. Often during
| implementation I realize "oh, this data doesn't work quite the
| way I expected it to" and the IA changes.
| code_biologist wrote:
| Yeah, being handwavy about IA is absolutely a common sin of
| weak designs. I love getting a design that's technically
| sound too.
|
| Another problem I've seen at work with the "design first"
| approach vs planning for technical feedback on an initial
| design: our frontend engineers would take the design and
| implement it exactly as is, papering over differences between
| the data entry and the underlying data model as needed --
| then users get confused about what _exactly_ each option or
| interaction does. It 's close enough to be serviceable (and
| not get fixed) but different enough to be annoying.
| seanwilson wrote:
| > Another problem I've seen at work with the "design first"
| approach vs planning for technical feedback on an initial
| design: our frontend engineers would take the design and
| implement it exactly as is, papering over differences
| between the data entry and the underlying data model as
| needed -- then users get confused about what exactly each
| option or interaction does. It's close enough to be
| serviceable (and not get fixed) but different enough to be
| annoying.
|
| This is where you should design wireframes first (e.g.
| rough greyscale sketches), turn them into clickable
| prototypes (Figma and InVision let you link up wireframes
| this way), and get feedback on these from user testing and
| the developers before creating high-definition designs or
| doing any coding.
| wwweston wrote:
| Is IA even a discipline anymore? I haven't heard people speak
| in those terms for almost a decade, and it's probably been
| longer since I heard it frequently.
|
| If it is still a discipline, what does one read to pick it
| up?
| lupire wrote:
| Parent was talking about coding the UI ("CSS"), not the data.
| michaelsalim wrote:
| Agreed with both.
|
| My own experience for the second point: separating it makes a
| huge difference because I'm in such a different head space when
| focusing only on design.
|
| What's funny is, 90% of the time this works well. But sometimes
| I just can't design something I like in figma. For those cases,
| I start coding and most of the time, I come up with a good
| enough design. The difference in how I think between the two is
| interesting.
| irrational wrote:
| The fact that people get college degrees in graphic design, yet
| we think we can duplicate their skills with little effort shows
| an amazing degree of hubris. This is like business people
| mocking programmers and saying that anyone could do it.
| avereveard wrote:
| Yep. Here's my tip: just drop 15$ on theme forest.
| TobTobXX wrote:
| There's no doubt a graphic designer can do more things better
| in this area. But a dev can acquire a skillset that is
| sufficient. I for example feel confident designing a frontend
| to the satisfaction of a customer, but I would never be able
| to put together a flyer or design an ad.
|
| As a comparison: While a skilled sculptist is undoubtetly
| better at his craft than a mechanic, the latter can take
| pride in finishing off a machine part just as much as the
| sculptist, and to an untrained eye, the parts display an
| equal amount of skill.
|
| Learning-by-doing gets you far. Actually investing the time
| and studying the field gets you further, but is more
| expensive.
| indymike wrote:
| > people get college degrees in graphic design, yet we think
| we can duplicate their skills with little effort
|
| No one has said you can "duplicate their skills". What the
| article is suggesting is that you use a framework with great
| design engineered in: Tailwind. In the case of Tailwind
| you'll benefit from the collected UI work of Adam Wathan and
| about 200 others.
| lupire wrote:
| You can get a college degree in drawing too, but you don't
| need one to be able to do nice sketches.
|
| Don't need a college degree for making software either
| hansvm wrote:
| _Can't_ anyone program? A few hundred of my classmates spent
| a couple quarters casually learning C++ in high school from a
| teacher barely scraping together the lessons a day before she
| taught them, and that was enough of a kickstart that most of
| us are some kind of programmer by trade, many of us in FAANG.
|
| Sure it takes a little time to learn, you could probably
| short-circuit that process with more effort, and there are
| greater heights to be achieved with sufficient dedication,
| but the majority of programming just isn't that difficult.
| Just about anyone _could_ do it with a little effort.
|
| That's also ignoring the compounding effects of education.
| People get college degrees in graphic design, but a couple of
| those years are shared between majors, some sizeable fraction
| of the unique couple years of training are dedicated to
| learning how to _efficiently_ perform certain tasks, and some
| other sizeable fraction is UI/UX knowledge that's somewhat
| duplicated in other fields. Is there really that much hubris
| in saying that some kinds of relatedly skilled professionals
| might only need to put in a little effort to equate to the
| ~<1yrs of unique effort obtained in a graphic design degree,
| especially when the professional in question doesn't need to
| use the entire degree and especially when learning is
| moderately accelerated by having learned other tangential
| things to hang the new knowledge on?
|
| Maybe yes, but if so I don't think it's obvious enough to
| warrant a single-line dismissal.
| [deleted]
| dspillett wrote:
| I think there is a level imbalance there, even in your
| statement.
|
| I can design stuff, a bit, but at the sort of level of
| someone in the programming world scouring stack-overflow and
| putting parts together, and maybe coming up with something
| new (in the sense of new to me, it probably exists a great
| many times over already).
|
| Some design "properly", from fundamental building blocks and
| existing ideas, applying the right tools for the job. Much
| like I program a lot of the time.
|
| A degree in graphics design isn't that though. There you'll
| be shown the fundamentals being derived from first
| principles, and the better students will be expected in
| future to maybe come up with new ideas/fundamentals.
|
| Being a designer and having a design degree differ in a very
| similar way to being a developer and having a computer
| science degree.
| DeathArrow wrote:
| I would just do the coding first and use whatever crap I have
| on hand (Bootstrap, standard fonts) because I want the design
| to follow functionality, not the other way around.
|
| And because design takes more time than coding for me. So, if I
| decide that something is wrong and throw the project, this way
| I lose less time.
| efortis wrote:
| Illustrator or Inkscape can import PDFs, so you can iterate
| between code and graphic design programs by exporting the page
| to PDF.
|
| That is, somethings are easier to experiment with or to start
| out in code.
| sharps_xp wrote:
| this might be controversial, but i just want to write semantic
| html and be able to toggle the design. if the design requires
| additional elements or JS, then it's way too complex for a solo
| dev (for me anyway).
|
| i think classless css frameworks really opened up the possibility
| for backend devs to spin up a project as long as they can write
| good thoughtful html.
|
| i'm building my own classless stylesheet that i plan to use
| across all of my projects because todays classless are mostly for
| content or marketing sites but what i need is more app ui.
| ashes-of-sol wrote:
| hedora wrote:
| I just want to _read_ semantic HTML and handle the page
| formatting myself.
| ffhhj wrote:
| Do you plan to define your own tags to have a richer semantic
| html, and then translate it into plain html with corresponding
| js/css? Because html is very poor. Where is my menu tag??
| clairity wrote:
| > "Where is my menu tag??"
|
| https://developer.mozilla.org/en-
| US/docs/Web/HTML/Element/me...
|
| <menu> is used like an unordered list, with <li> tags inside
| it, but has a specific semantic meaning.
| clairity wrote:
| > "i'm building my own classless stylesheet that i plan to use
| across all of my projects..."
|
| i'm doing the same! i tried use bootstrap again recently, and
| although it's gotten better from older versions, i just
| couldn't atop fighting it's anti-semantic assumptions (don't
| even get me started on tailwind!).
| DeathArrow wrote:
| Yes, you can. By learning what good design is and how to
| accomplish it.
|
| I am a software developer and I sucked at design. But I learned a
| few bits of design, tried different approaches from what I've
| learned, did and redid a lot of designs. Waited a bit to clear my
| eyes and redid the designs again. Until they looked OK.
|
| I not want to say that I am a good designer or I can replace a
| professional designer, but that I think I can accomplish decent
| designs for my own needs.
|
| It would be a better ideea to just pay a pro designer and save
| some money, since he will do the design way faster than I can and
| better. But I like to do all the things myself if it is a
| personal project.
| zwaps wrote:
| If the person creating this website are reading: Please do not
| pop up a "sign up for newsletter" pop up before one can even take
| one decent look at the article.
|
| There could not possibly a more clearer message saying: "we don't
| even want you to read what we write, we just want your e-mail".
|
| Incidentally, I did not get to read this article, because of said
| pop up, and if you think I'm gonna hunt for that tiny x button as
| response to that dick move instead of closing the tab, well.
|
| Edit: if this ain't clear, this isn't good design
| ajdude wrote:
| I was actually just about to post this. I clicked the link,
| began to read, and before even getting through the first
| paragraph, I encounter that full-page pop-up message for the
| e-list. At that point I just closed out the site.
| amelius wrote:
| If you can recognize great design, then you can create great
| design. Period. Just trust your inner feedback loop, and know
| that great ideas often come as a surprise from experimenting.
| mg wrote:
| Just when I make a break from fumbling with html and css to
| create a landing page!
|
| I am 45 minutes in and it looks like this:
|
| https://www.gnod.com/guest
|
| Feedback is welcome.
| spookybones wrote:
| I'm on my phone, but the text feels too compact. The paragraphs
| would look better with bigger margins.
|
| Also, the top feels like a logo, navbar, and a hero all in one.
| I would work on it more as a logo and lose the "Welcome to"
| since the next sentence also functions as a greeting.
|
| The green dot is an interesting touch, but presently looks like
| a status indicator/green light, that, on a black background,
| attracts the eye more than the content and the sign-up button.
| Princetobi wrote:
| thestepafter wrote:
| Would recommend the same green / yellow as the circle for the
| primary button.
| mg wrote:
| Yes, maybe.
|
| I am not totally sure the green/yellow circle makes any sense
| though. I consider removing it.
| joemi wrote:
| Looks good to me. I quite like its simplicity.
| JusticeJuice wrote:
| Hi. I'm a designer, and thought I'd spend 10 mins on this to
| show the little tweaks I'd reach to first. I didn't do any
| thinking about the content, and I haven't tried to push away
| from the brutalist visual style you're going for.
|
| https://www.figma.com/file/pUBqrZ0zUjXfVAc6nR13ZU/Gnod?node-...
|
| Type. Everything about good typography is optimising for
| legibility. First off, you absolutely nailed the line length. I
| did increase the line-height to 150%, and swapped roboto for
| inter. I think Inter UI is a bit easier to read at small sizes,
| I find roboto comes out kinda excessively bolded on most
| screens.
|
| Grid / padding. I increased the padding around the card quite a
| bit, from like 10px to 24px. A good way to find the correct
| padding is putting in way too much, then pulling it down until
| it's starting to feel cramped, tip from refactoring ui
| actually. Everything is in 8px units where possible. Notice the
| "Welcome to" and "Hello" text are both vertically aligned.
|
| Sizing / visual prominence. Visual prominence is just about
| telling people where to look first, when you first open up the
| page, where is the eye drawn. Considering the size of the
| 'Welcome to Gnod' text, I assume that's what you're trying to
| highlight. I've reduced the size to just 18px - only 2px bigger
| than the 16px body font. But, cause it's got it's own padded
| background colour, it's still right where the eye goes. There's
| lots of ways to draw attention without size, and you don't need
| to use more than needed. Same with the dots, I don't really get
| what they're for honestly, but I made them a bit smaller.
|
| Icons, swapped them out for font-awesome icons, felt a bit more
| premium idk.
|
| Colour, I changed the pure black to off-black, slightly blue.
| It might seem like designers just hate contrast, and that might
| be true. But, there's lots of arguments for using 'rich'
| blacks, but I won't get into it haha. My subjective choice.
|
| Anyway, that's my 10 cents, ignore as needed haha.
| bavila wrote:
| So much better. Well done.
| saint_angels wrote:
| I think it's a nice start for a unique style. I would suggest
| highlighting the main action button with some color.
| mg wrote:
| Thanks. The style is already more or less defined by the home
| page, which I designed a while ago. So I mostly stitched
| together bits and pieces from the home page for this landing
| page.
| livinginfear wrote:
| The nav circles are a bit misleading. I'm clicking on them, and
| nothing happens. Otherwise, the design is very nice!
| emadabdulrahim wrote:
| uhm... yes and no.
|
| This post fails to explain the core principle of designing
| websites; the content comes first, always.
|
| 1. Write: Write the content first, in google docs or whatever. 2.
| Edit: Go over your content, edit it. Cut it in half in possible.
| Remove most of the fluff. 3. Information Hierarchy: Structure
| your content. Go over this a few times. 4. Emphasis: Given each
| piece of the content, how best to emphasize it based on what its
| saying?
|
| Now you're ready to think about design. Browse websites that you
| like and first focus on their typography. If you understand what
| makes good typography, you're already more than halfway there.
|
| Obviously there's a lot more to it. My point is your content is
| your raw material that _needs_ designing. If your content is not
| good, I don't care how good your design skills are, your website
| will suck.
| monkin wrote:
| Everyone can make a great-looking website, and not everyone can
| make it useful to end-users or goals. Worth remembering that
| websites are "living" organisms that evolve with your users, and
| you need to quickly adapt to any patterns that users throw at it.
| unnouinceput wrote:
| I recommend to any programmer, no matter how sucky is at design,
| to start using your program. As in enter at least 1000 times data
| in it, or click on tools you offer. I bet after 50 tries, you'd
| start redesign it, then after another 100 you'd improve its
| performance. By 1000 tries, even if it's still ugly at least will
| be easy to work with. And that will have appreciation of your
| users. Then you give it to an UX designer to make it beautiful.
| Oh, and when you get it back from said UX designer go again with
| data entering, to check if the designer didn't screw your
| previous awesomeness.
| gernb wrote:
| > Border Radius: Do not use border-radius. Square buttons and
| boxes give off serious vibes.
|
| Every screenshot on the page is using border radius except for
| microsoft
| fidrelity wrote:
| No border radius is the recommendation for 'serious' in the
| article.
|
| The author chose 'fun' where that was allowed according to
| their own principles.
| [deleted]
| bzxcvbn wrote:
| I'm not taking web design advice from a website that throws a
| whole-page popup at me after scrolling a bit.
| vmception wrote:
| The way I do it is starting with the logo.
|
| I have a graphic designer work with me on the logo. With the
| finished logo you get style guidelines and an entire kit of all
| logo formats and resolutions.
|
| You also get:
|
| 1) Color scheme - primary and secondary colors (this article
| reinforces this as well)
|
| 2) Typography - primary and secondary fonts. Now your use of any
| fonts especially custom fonts is no longer arbitrary, and
| congruent to a theme
|
| 3) Evocative messaging. The logo already evokes something in the
| viewer, the site is now congruent to that
|
| This gives you a great launchpad and highly combustible
| accelerant to propel everything forward.
| tobr wrote:
| > 2) Typography - primary and secondary fonts. Now your use of
| any fonts especially custom fonts is no longer arbitrary, and
| congruent to a theme
|
| It isn't necessarily a good idea to use the same typeface as
| the logotype for setting other text, if that's what you mean.
| It can make the logo just seem like some text. Obviously not a
| strict rule, you can make it work, but there's value in having
| the logo stand apart.
| vmception wrote:
| this should be in the style guide as well, but not all
| designers do that
| jstummbillig wrote:
| No. No, you can not. You can't even do it while you don't suck at
| design. You actually need to be really good at web design to
| create great looking websites.
|
| Great design is hard. If you have seen a cool, simple design and
| thought "well, that's easy, it's just a bunch of text, a few
| lines and one primary color" and tried to copy it, you know how
| hard. Everything matters and you have no clue why it does. Or
| how. Sure, you can just do the 1-to-1 copy and there's frameworks
| to allow for exactly that-- but that is when you get a bootstrap-
| material-tailwind look and while that's fine and ticks some
| boxes, most people would probably agree that that does not feel
| like great design.
|
| Design is hard hard every time anew, because more so than with
| code, it requires something different every time (whereas good
| code, in my opinion, should strife to be as boring and repetitive
| as you can get away with, and if it's all tried, tested and
| recycled more power to you)
|
| Let's not buy into the bait and don't get deterred either. I am
| all for enabling the maximum amount of people to do cool shit,
| but it would be great if we could in the process not berate that
| which we aspire to accomplish by lying to ourselves. You don't
| need to be a great designer to create something cool. Go ahead
| and create. But if you want great design, you actually need to
| get great at design.
|
| Fortunately, you can just start by doing shitty design and take
| it from there.
| xmprt wrote:
| > but that is when you get the bootstrap-material-tailwind look
| and that is not so great either now, is it
|
| The crux of your argument rests on this point and I think it's
| worth taking a step back and realizing that this is subjective
| and also that many people think the bootstrap-material-tailwind
| look is actually pretty good if not great.
|
| It probably looks like crap to your trained eye but if the
| average person can't tell if something is wrong then it's
| probably just fine. I've seen a lot more cases of overzealous
| designers trying something custom and new and having it fail.
| Boring technology is often the best kind.
| tootie wrote:
| I think the stuff in this article is very useful and it is
| definitely easier than ever to create a non-terrible design.
| They can create guardrails that makes your design is legible,
| responsive and mostly accessible. That's not a "great" design,
| that's a passable design. The bigger trick is UX. How do you
| actually optimize user behavior and minimize frustration.
| That's a whole other skill.
| Stevvo wrote:
| I think it's a matter of scope. Building a simple personal
| blog? Most developers can probably make something fairly
| readable and pretty with some thought and a CSS framework.
|
| Increase the complexity to something that has more interaction
| with users and their data and you would do yourself a service
| to hire a competent designer.
| passivate wrote:
| I am not a designer, so I take a more pragmatic view. If the
| intent is to earn money through your website and you are
| earning a ton of it, then you've succeeded. It doesn't matter
| if an outsider considers it good or bad design. But that' s
| just my simple-minded view.
| jstummbillig wrote:
| The whole conversation has been a bit sloppy about the
| differences between design and looks (and the difference is
| not entirely clear most of the time) but suffice to say: If
| you intent for your page to do x and you accomplish that
| because of and not in spite of the design, then, by
| definition, the design is good (and it might even be great).
|
| > If the intent is to earn money through your website and you
| are earning a ton of it, then you've succeeded
|
| Sure, but just as that does not mean your code is great, it
| doesn't mean your design is. "Earning a ton of money" is not
| exactly a well defined company goal. For example, if a better
| design (or code) could yield 2x what you make, even if 1x is
| "a ton", you might reconsider your stance on either. Or you
| maybe you wouldn't. Who am I to say.
| jyriand wrote:
| Landing page is not a website. Wish there were more examples of
| some functional aspects of good design.
| mordechai9000 wrote:
| I am trying to learn to make web based application interfaces.
| Like, say, a web form that manages a stateful process. The user
| provides info to a form, initiates a set of actions, and then
| monitors the results and provides further input.
|
| I am definitely not a designer. Mostly I just want a design
| that looks decent and stays out of the way.
|
| I have tried widget libraries but I have been happier with the
| results I am getting from plain old css.
| PaulHoule wrote:
| That is a problem with so many themes I see. For a real web
| site you need something that scales across pages that have
| little text and a lot of text, mobile and desktop, etc.
| PaulStatezny wrote:
| Two words: Refactoring UI
|
| https://www.refactoringui.com
|
| I read it and began to apply what I learned, and my team now
| considers me the design expert of the team. And trust me, I'm
| not a naturally gifted designer.
| eins1234 wrote:
| Wanted to second this recommendation.
|
| It's still very hard for me to design a _good_ looking
| website from scratch as that takes actual creativity and
| imagination, but after reading Refactoring UI I at least have
| a bunch of tactics to stop myself from designing _bad_
| looking websites, because I now know exactly _what_ makes
| them look bad.
___________________________________________________________________
(page generated 2022-05-14 23:01 UTC)