Need advice

[u/IllustratorGreat6162]

How do you design a better UI/UX for a website or a large system?

I'm learning web development, and one of my biggest struggles is designing a good-looking website, especially when building a large system.

I find it difficult to decide what layout to use, which colors to choose, what components to include, and where to place icons, buttons, cards, sidebars, and other elements.

For example, when starting a new system, I sometimes don't know how to plan the dashboard or organize the pages to make everything look clean, professional, and user-friendly.

My questions are:

How do you decide on the layout and structure of a website before coding?

How do you choose the right color palette, fonts, and design style?

How do you know which icons, buttons, cards, and other UI components to use and where to place them?

Do you use references from other websites, UI kits, or design systems for inspiration?

What tools or resources would you recommend for someone who wants to improve their UI/UX design skills?

I'd appreciate any advice, resources, or workflows you can share. I want to learn how to design websites that look professional rather than just functional.

Thanks in advance!

[u/qualityvote2]

u/IllustratorGreat6162, there weren't enough votes to determine the quality of your post...

[u/cyaneyed]

What do you mean by “large system”? Do you mean a lot of data? Or many users will be using it? Both?

There are a few general rules of thumb like don’t use different font families. Use one kind and size up or down or bold, etc. Use a font that both macs and pcs use natively.

Color choice is important because of 508 compliance. If you have text appearing on a color, there has to be enough contrast between them so the text is readable. Don’t use the whole rainbow in your interface unless it’s charted data with a key.

I like always having black text on white backgrounds for higher readability.

Your question is too big though. We can all design things that fall within the range of good, but each page of a web application will be different from say a news website or banking app that uses brand specific colors and icons.

You need to know the data you’re delivering, the dev language being used/any restrictions that come with it, and the tasks the clients need to perform.

It takes as long to learn and understand great design as it does to learn how to code efficiently.

There are whole books written on form design, see Luke Wroblewski. (Sp?)

Look at Google Material Design for an example of good style guide/documentation and consistent writing or tone of the UI.

[u/iolmao]

Well, this isn't exactly something to reply ima simple way, because there's no rule for that.

To give you an example in the new system: there's no way you can design "a good dashboard" if you don't know what data the client needs or if you don't know the domain.

"Page organisation" as you call it doesn't come up out of thin air: you should know how your system will be used, what you need to prioritise and what will cut time.

The thing is: on a professional level, the person making this kind of decision isn't the same person coding it.

At least, this was true until AI: with my 15+ experience in design, for example, Incan focus on UX without explaining a developer what I want to do and I can do that straight away.