loading...
Cover image for Wireframing - Web Design 101

Wireframing - Web Design 101

sidrodev profile image sidrodev ・2 min read

I am taking Dr. Angela Yu's The Complete 2020 Web Development Bootcamp on Udemy and it is awesome. I started not to long after finishing Colt Steele's Bootcamp course. I just want to solidify, as best as possible, the basics and then from there start doing some work.

Right now, I am on Web design 101 - Wireframing. Dr. Yu says "it's easy", "shouldn't take you long" but in reality it is far from "easy". Now, don't get me wrong, sketching what a site and/or app should or will look like is "easy", as I can draw stick figures just fine, but the process that goes into it isn't "123, testing, testing, test, test".

She did mention about the process for developers is to look at what others have done and draw inspiration from those and then do wireframing, mock and probably prototype but even before looking at someone else's stuff, what is it that I actually want to convey? Or what would my client want to convey and how can I capture that? Questions like those come to mind even before I look for "inspiration". Now, are those questions relevant? Don't know. I just know that I can "oooh", "aaah" someone's website all I want but not having an idea of what I want and/or looking to convey does not help me in drawing inspiration.

It might just be me. But that is what I was thinking. By the way, if anyone is just starting in Dev and want to go to a Dev bootcamp, both Dr. Angela Yu and Colt Steele classes on Udemy are awesome. They may have some outdated examples but the info still stands. Also, freeCodeCamp.com is an invaluable resource as well. I have not yet done there course, but I have used their articles for help understanding something in JavaScript, NodeJS, etc. Medium is another resource I use a lot as well. Ooooh! Let's not forget Dev.to and Wikipedia. I love YouTube, but YouTube is not the only place for great info, continued learning and knowledge expansion.

Anyways, I was speaking on "wireframing", before I went on a little tangent. Well, if you read, or will be reading, what I write, you will see that often! 🤣😎 So, wireframing, itself is "easy". It's just drawing a diagram of where you want what on a browser for a particular site I am designing. However, coming to that is where, I think, is the issue and not as easy. Right now, I don't know what I want or what I want to convey and therefore "stuck"!!! So for now, I'll just look at the "inspirations" and wireframe something similar to what "speaks" to me and continue with the lesson.

Yeah! I know. I do believe in "recreating the wheel" as long as it propels me forward. Who knows, I may add something new or come up with a different perspective during the process! 😁

Discussion

pic
Editor guide