A screenshot of high level wireframes in Adobe Illustrator

Hand drawn sketches of wireframesI prefer to take a mobile first approach when it comes to designing websites from scratch. I don’t know about you, but when I want to quickly look something up I always reach for my phone. Keeping this in mind allows me to visualize how the average user is using a website and what information they may be looking for first.

I will usually start out sketching by hand. I find it is an easier and quicker way of getting my ideas on paper. Once I have a few options down, I will switch gears and turn to Adobe Illustrator to create a digital version to send to the client.

When I create high-level wireframes I always start with the mobile view, working my way up through tablet and then finally a desktop view. Once again, Illustrator makes it easy to create guides, establish margins and align objects.