Web Design Process: From Wireframe to Website

Recently I wrote about sketching out a wireframe first, on paper, before opening up any software program. We call that Stage 2: Information Design. (Stage 1: Strategic Planning is all about getting and analyzing content and establishing a goal or objective for the website).

Well, I wanted you to see what became of that sketch. (It became a website, of course)

After I sketched out, on paper, where I wanted content to go, I used Mockflow to design the homepage wireframe.

After a couple of revisions from the client, we moved onto Stage 3: Visual Design. This is the stage where all the colors and typefaces come in. We essentially wrap the design around the content.

After a few revisions from the client, it’s onto Stage 4: Production. This is the stage where the picture above becomes a working website with links, rollovers, rotators, database integration and more.

Talk to us about designing your new website.

Photo by Rich Wooten on Unsplash