Hello DEV community,
I am seeking to level up my abilities as a designer to be able to boost my confidence building visually pleasing (Sorry I know this is vague) websites & UI.
I believe I exercise a good amount of HTML & CSS as I can take a design given to me and create it in code. I'd like to be able to start designing web UIs that I can myself translate into code. I was wondering if there are courses, resources, tips on how I can get better..
Thanks a ton!
Top comments (10)
The best tip I can give you is work on live sites that have traffic & you can change.
If you can see 50,000 people a day, you can make small changes that will improve conversion - you will learn much faster. A large % design tips published are made up & inaccurate.
Knowing what makes a website time on site 5.16min, not 1min 22 is the better level of web design.
A lot of visually pleasing design is why websites fail. Busy websites have very similar UIs & design decisions. This site we are on is a good example of good design as it fits purpose really well (it's early growth phase, content expansion, user adoption).
Over-visual web design is mostly (good creative agency tool) a huge mistake & there are graveyards full of fancy sites. The website is the frame for the content. Aim to lift the content & lower the boilerplate.
alexa.com/topsites top 500, white bg, dark txt, simple, low animation, high performance, big earning, value adding, profit center, high time on site (or fast execution), growing. Exception: Adult sites tend to be dark with light text. Bad UI costs actual money/jobs in cases. If you want a big or decent site, start with those principle.
More technical stuff:
developer.apple.com/design/human-i...
design.google
To design beautiful visual stuff:
If you reach a high time on site average (with decent traffic) you will have something that flies on it's own (in most cases). It is surprisingly hard to get those numbers up (at growth) but it teaches you the most.
I hope some of this is useful.
Wow thats an incredible amount of useful information! Thank you Vuild for your response. I feel like I've been tied up on the "visually pleasing" part a little too much and would likely have gone down to overdoing it at the expense of usability.
I think with this information, I feel more confident publishing something. I often get too hung up on what it looks like or the lack of fancy elements.
You are welcome. I hope it is useful. Do it this way:
80% of traffic usually goes to a small number of areas but most people put their energy into the homepage. FB/twit/Goog/Medium/yt do not give the highest priority to the home, they put the focus on the detail & listing pages (content). When you spend a month making a stunning homepage but your blog post gets hot on HN & your page view ave is 1.1ppv, nobody sees the home anyway.
People mostly click links in content, not boilerplate. They look at a handful of pages. You need a website with 1M pages. The visual arts should be the content mostly.
Common sense is the best way to look at things. How I explain it (and why most expert UI info is not true):
Do you know what the frame of the Mona Lisa looks like?
Imagine it had flashing lights & moving things on it.
Sometimes it is appropriate (animation sites, design agencies, movies, production) but a lot is people justifying their jobs/ideas/bias.
I put my site live, some of the best (really) in various disciplines have seen it & haven't finished the homepage (look at it). Doing it live forces you to accept/get on with things.
But how about local maximums? If your only tactic is A/B testing you’ll only optimize to a certain extent.
It's not my only tactic, it's to answer the question. We can discuss more advanced UI no prob, but I am addressing general ways to remove creative block/visual distraction from the workflow & to order the design process while addressing imposter syndrome specifically. I'll bet it all looks better than imagined.
It's more a 'get stuff done' than drilldown on UI/UX/ROI/conversion type info.
Start a UI thread & we can get into UI details that would help everyone. :)
A few resources I like to poke around with for inspiration are:
And then for reading, try:
Go and check this out. These are daily UI challenges you can take dailyui.com
Doesn't seem to be ready yet :(
Just checked and it looks like they are doing an overhaul to the content. Hope it gets more awesome than it was!
I really liked this design basics series on Sitepoint