Starting a new project? Start from the bottom
“Think twice before you jump” This is a famous saying that we’ve heard since we were kids. It means to think before we start something new. But what if you’ve thought to the end and forgets something important while doing it?
The same come’s with when developing a new web application. You need to have sketches from the bottom layer to the top layer. In this post, I’ll show you how to “Design Wireframes” for your new web application.
For starters, What are wireframes? Imagine you are building a house… It’s really important to have a blueprint before you start building it. The wireframe is the blueprint of your web application. Enough with the talk and let’s get into the business.
Designing a wireframe is simple. You just have to start from the beginning and link each step. Before that, you’ll have to pick a designing tool for designing. I selected a free online tool called “draw.io” to design my wireframe.
At SEF, there was a requirement to design a dashboard for an upcoming project called “ScholarX”. I and the crew split the work and I had to draw the wireframes for the mentee section.
Drawing something like this with draw.io is “a piece of cake”. Start drawing from the home-page and so on. After designing the home-page you have to think about every interactive component of your design and draw possibilities for all of them. After finishing your work it’ll look something similar to this.
Sometimes you’ll feel like it’s a time waste to draw wireframes. But believe me, developing the UI with wireframes is a lot easier. What do you waiting for? Go start working on your wireframes!
