Are there well known books, courses or video series that teach web application UI design in a systematic way?
"Learn UI Design"[2] provide some really high quality methodical videos[3] and content
[1] https://www.youtube.com/channel/UC2oCugzU6W8-h95W7eBTUEg
[3] https://www.youtube.com/channel/UCakPr8lc7Zcowd8Cp2Uy_Eg
It teaches several ways to prototype design, how to evaluate whether your design is efficient, and how to develop a design oriented mindset
It not only helped me make better designs, but also made me a better coder, because I started thinking about my code as a product to be used by others
It focuses on four fundamental concepts of graphic design that apply to everything visual, including UIs. Its four concepts form a language for thinking about the aspects of visual design like color schemes, font sizes, spacing, etc.
It has lots of examples and mini design exercises. And you can read it in just a few hours.
There are references that were involved in that but none individually nor as ensemble is a "systematic" source. So they wouldn't really fit your requirement. These range from Card & Moran to vendor design guidelines to general industrial design concepts.
You will learn the most by "doing" and solving real problems. Honestly half the issue is looking at customer use-cases and testing with customers which is the ultimate source. Doing it in a vacuum or from arbitrary recipes generally doesn't work. Customer. Customer. Customer.
My current company has a number of beta customers who are willing to try things due to long-term friendship combined with a modest discount on the first copies they buy. They are our guinea pigs and our inspiration for both problems and opportunities both for UI/UX but also intimately tied to product features.
We need to go back
(and no doubt other stuff by the same guy)
The systematic starting point is black and white, courier, and HTML.
They get you about 90% of this very webpage.
With a lot of iteration of course. Iteration is design's only methodology. Unsuccessful is it's predominate conclusion. Partially successful is as good as it gets. Running out of time is how a design is finished.
Surely read all you can about color theory, typography, and composition. All you can about web app organization. But accept that none of that is designing. None of it strictly necessary. None of it sufficient.
There's no such thing as a design in your head. Good luck.
[1] User Interface Design & Implementation (start by having a look at the readings; includes exercises and projects; have a look at the dozens of detailed examples of the latter to see the process that is taught here [9]).
[2] Software Studio (this one sets UI/UX design, at the end, with excellent videos [3,4], in the context of app design, not in isolation, as an extension to conceptual design [5,6], without which it is claimed that you can't get it right, and for which you need abstract data design [7,8]; very good assignments and project)
[1] http://web.mit.edu/6.813/www/sp18/
[2] https://stellar.mit.edu/S/course/6/fa18/6.170/materials.html
[3] https://drive.google.com/file/d/1qblmdoZIJQ4rYGgCPLNusEn2yWi...
[4] https://drive.google.com/file/d/1Cvco6r8a6oV3Sy89RKdIfrZCrGi...
[5] https://drive.google.com/file/d/1lzAbrqk9LNLhGMLbsTuVgAm6p9_...
[6] https://drive.google.com/file/d/1AZ85ui0k2QpCKgfJZXUPSk-jdSi...
[7] https://drive.google.com/file/d/1axvYX7kSWAmxDU451hyCcG-wt88...
[8] https://drive.google.com/file/d/1ET9UkOCE-l0c-FR_2w0TFudCAn8...
[9] https://docs.google.com/document/u/0/d/1KIIOS3W9vF4RT0PdX6cH...