Straight into the code!
Ask any Digital Designer what their favourite work tool is and you probably won't be surprised to hear it's something like 'Sketch'.
Many of us, myself included, will begin designing on Sketch as a point of entry (after any documentation, UX and strategy have been considered) and take it from there. Pretty standard stuff these days.
But I heard a really good tip from Dan Sheerman, Tech Lead / Front-end Developer at Headscpe in the UK on the latest Boagworld podcast; 'The Hidden Challenges of Effective Responsive Design.'
I love the idea of starting with a sort of, 'pre-fab type-kit' or 'Typeplate' that houses base typography, and demonstrates basic media query breakpoints. In fact, just search for 'base typography code' brings up pretty much just such a template.
We're talking quite literally of starting the design with code. You style the typography purely by CSS to get all the fonts, sizing and breakpoints right before you dive back into Sketch.
I work atomically, so after getting the sizes and media queries right, the next step would be to plug all that back into my usual typography page and let it drive the design.
I, uh... don't really do production quality code though, so for me, this is more of a starting resource that I guess the real heros can get right later.
The advantage here is understanding what is going to work from a really early point in the design. Figuring out these basic elements, and just seeing them scale in a browser, could potentially be a huge driver for a whole range of atoms and molecules that come later.
I'll update this post once I've given it a go. have no idea if it will be ahelp, or a hinderance.
By the way, if you've never heard of Paul Boag and his little podcast (I say little, but he's got ten's of thousands of listeners) then I highly recommend checking it out too. Those guys are usually bang on the money.