The Web Development Process Part 4: Wireframes

Wireframes are the last step in my assignment’s process and the step where things really start to come together. It’s also the step that took my the most time and the step I learned the most on. Continuing on and finishing with the Wee Bee makeover below is my wireframe for the new and improved website.

New Mockup 1

Screen Shot 2019-07-21 at 5.34.50 PM

Screen Shot 2019-07-21 at 7.36.38 PMScreen Shot 2019-07-21 at 7.36.54 PMScreen Shot 2019-07-21 at 7.37.05 PMScreen Shot 2019-07-21 at 7.37.11 PMScreen Shot 2019-07-21 at 7.37.19 PM

I was so thankful to my professor for introducing me to Balsamiq because this step would have taken much longer without that helpful program. My wireframe started out with the homepage, then the about me, online shopping page, blog, responsibility page and ended with the contact us page.

In the end I’m happy with how everything turned out but, as always, there’s room for improvements. This was the first wireframe I’ve ever made so I was confused and couldn’t find an answer as to whether or not it was alright that my pages were different lengths. I was trying to express that it was a page you would scroll down, but I’m not sure if that came across. I was also unsure if I should add the little ‘private policy’ and ‘terms and conditions’ links at the bottom of the page but I see them at the bottom of every web page so I figured I should.

I felt slightly limited in trying to add more abstract elements to my wireframe so I wonder if there’s a more standard program used in the industry or if Photoshop would have been a better choice.

Looking back now at the end of this project I feel like I have learned so much. I’m tempted to put my wireframe in my portfolio but I’m going to wait to hear some critique because it might not look good to anybody but me! Regardless I really enjoyed this project and can’t wait to do more like it soon.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s