[sorry for wall of text, just a braindump of design stuff]
So you’ve hit the normal point in the design process where you’ve got too wide a scope and you get paralyzed. This is always going to be the case. I guess design is quite similar to programming in that it’s a method of dealing with complexity, and where you are is analogous to building a webapp, and starting by trying to do everything. When I was primarily a designer, the worst possible projects were always when a client said “just design me something”. The scope of any project is always enormous, and it takes a very long time to narrow it down. On the other hand, the jobs where the constraints were tight were the best to work on, and almost always led to the best designs, because I could focus immediately on the design. You need constraints, and helpfully, you’ve got one very, very useful constraint.
Start with your mobile version. It’s really restrictive, and as you say, there are well-established paradigms. Make it work on mobile viewport sizes, and make it work well. Then change the orientation, see what breaks. Fix that. Then go to tablet size. Do the same. Then go to desktop.
Things like navigation are really good to focus on first. At mobile, you don’t really want important nav items hidden away. So can you fit them all on one line? If not, maybe you want to use icons? Is this a good approach, will people understand what the icons mean. As the size increases, do you show more items? Where do you put the nav - would it be useful to have it at the bottom, so people can hit the items with their thumb, making it easier to use one handed? If you do that, what effect does it have on what you imagined for the rest of the design?
Focus on one thing you think is important and that you have an idea of how it should be implemented. Don’t be precious about it though, and build out stuff as fast as possible, and give it to someone to try.
The scope does extrapolate very quickly, but you need to grab hold of a a few small things at first, and work outwards from that. Try to pick the most important bit, but often you don’t realise quite what that is at first, so go for something you think you’ve got quite a solid idea of how it should function.
Work from functional to aesthetic - you can go the other way, but it makes the development side that bit harder.
Just keep polishing and polishing - it’s gets to be a grind as you go past the fun stuff and start to repeat yourself, but you get there in the end.
Don’t lose sight of the overall look and feel, it’s really easy to get trapped into polishing a single thing, so when you feel yourself stalling, move onto a different piece of functionality. Keep stopping and taking stock, zoom out so you can see the all the parts together - key aims is a fluid, unified experience, and it’s really easy to lose that and go down blind alleys.
One major thing I always find productive is find something you really like, aesthetically. Could be a colour combination, or a font you really like, or something very specific like a form input validation style you really think works. Focus on that, build it out - if it’s a font, get the spacing and weight looking really good on basic body text, then move onto headers, button text, etc. If it’s colours, try them with text, with backgrounds, with image overlays, different tints and shades for buttons, active states etc - note, this is where CSS frameworks are great; they’ll generally always have a Sass/Less version that you can set up the variables for. If it’s something more specific, then make that element work - really work, so tune the animations between states, maybe, until it it feels really fluid. Then make another element, say, a button, that follows the same pattern, maybe has the same colours and animation timings. And then the containers for the elements - echo the border styles, shadows, etc.
Re that last paragraph, this is book is great: https://www.amazon.co.uk/Visual-Grammar-Design-Briefs-Christian/dp/1568985819. There’s nothing particularly spectacular about it - it’s just a compendium of different strategies for laying out content displayed in a very simple, stark style. But it’s useful
This guy’s BA project is fantastic, covers a variety of animation strategies and the reasons for their use, I’ve used it as a go-to reference for years: http://www.ui-motion.com/#home
The designer Andy Rutledge’s archive articles here (all the ones under Practice) were very useful to me (note of warning, maybe ignore the Culture section unless slightly rabid US conservative politics are your bag. He’s a very good designer though).
Google’s Material Design documents are really good - whether you think it’s a good thing, or whether you think it’s awful, Matías Duarte et al thought very carefully about both individual elements and the overall scope. And that scope is massive, so it’s super impressive as a design system. The underlying design ideas are good - pinch at will.
There’s a book called ‘A Graphic Design Process from Start to Finish’ by Index Press which, although print-focussed, is a very nice overview of the full process, aimed at all levels of designer. It was a short run I think, so the copies on Amazon are a bit overpriced for what it is, but if you can find a cheap copy it’s definitely worth a look.
Here’s Bruce Tognazzi’s Principles of Interaction Design as well, it’s great: http://asktog.com/atc/principles-of-interaction-design/, though it’s going over the same ground as the books you mentioned.
