For whatever reason, you might find yourself as a developer in the position of building an application without design specifications. It could be that the project is for internal use only and designers would only complicate things (heh). Or maybe you actually asked for designers' help but you were told they are busy.
But more often than not, it's the client who decides to not "waste" their tight budget on design… Just as a side note, it turns out, skimping on design doesn't result in savings, but rather paradoxically the contrary is true!
So what can you do as a developer to create a sound application that doesn't have grave usability issues? Of course, you will be using a well-established library like Material Design, but that only provides you with UI elements. You can still mess up the user experience.
Well, here are some UX design tips that are easily applicable:
Variant A. puts more strain on users' minds than B.
BTW, I prefer putting the primary button to the right and the secondary one(s) to the left, but whatever arrangement you choose, make sure it's consistent throughout the application.
Labels are an integral part of any UI. Menus, forms, buttons – they all feature labels. So one tip is to try to make them as descriptive as possible while still keeping them short. If that's not possible, at least make sure they are not confusing, i.e. their meaning can be easily understood from the context.
By clicking CANCEL you are cancelling your subscription or you are cancelling the cancellation?
Fonts that are too thin, too bold, or too narrow hurt legibility.
THE SAME THING CAN BE SAID ABOUT OVERLONG SENTENCES IN ALL CAPITAL LETTERS.
Not to mention poor contrast... Note that what might seem easily readable for you, a youngster with high-end devices, might not be as easily legible to others. This is a nice example of don't:
It might not be such a big usability issue, but it surely looks sloppy. Just pick a library of the plethora available online nowadays, pick a style, and stick with it. For instance, Material Designs offers a wide range of pictograms in several styles: line, filled, rounded, two-tone etc.
...instead of asterisking all mandatory fields
In case there are more optional fields than mandatory ones, you should ask yourself why are they there in the first place?
For mobile, the minimum clickable area should be 44x44 px, maybe 40x40 px if space is a problem. On desktop screens, I wouldn't go below 32x32 px.
Icons are everywhere, and for good reasons: they save space, convey meaning visually, they reinforce CTAs, and help interfaces look cool. However, unless they are universally recognisable like like, check, save, delete, etc., always accompany them with explanatory labels.
Often developers (and designers too!) use clever icons to express nuanced concepts, and in order to save space, they end up ditching the accompanying labels. Well, don't do that. Use overflow menus instead maybe.
.
An integral part of any UI is text, i.e. UI copy. I'm talking headlines, empty state screens, notifications, tooltips, instructions, dialogues, and error messages. More often than not, technical people tend to use a rather technical language in UI copy instead of writing it for regular people. The most common offenders are badly written error messages, like the classic and unhelpful "An error occurred". There are memes about them, so you know what I'm talking about.
Here's one I found recently and made me laugh real' hard:
If your list of options is very long, you could add search functionality to the dropdown (transform it into a combobox). Or you could break up all those options into multiple dropdown lists.
The opposite situation, with a dropdown list of only 2 or 3 options, is not that great either. In this case, it's better to use radio buttons instead.
That's all, folks! I hope these tips will help you build better applications without designs, but also that you won't have to.